Flutter, Google Places & Mason
Let’s say you have an idea for an App that requires leveraging the Google Places API to find places and get information about them. You want this App to run on iOS and Android devices, so you would probably choose Flutter to develop it (duh). So, you pull up your sleeves and get coding… for a week? Maybe two? I mean, that Google documentation isn’t going to read itself, models and data layers aren’t just going to be implemented magically, and the super fun native configurations for permissions may take a try or two to get them just right. Let alone the overall architecture of your Flutter App. And how about testing? Are you even sure everything you’ve put together works as intended? It looks like those two weeks are starting to look a bit generous, but… what if I told you you could’ve got all that stuff done in the time it took you to read this intro? Don’t believe me? Well… They say a GIF is worth more than a thousand words, so check this out.
🧱 Meet the google_places_starter
The google_places_starter is a mason brick that populates a very good Flutter App ready to interact with the Google Places API. If you’re new to mason, I’ve gathered up a few links for you to become familiar with it.
- mason_cli — allows developers to create and consume reusable templates called bricks powered by the mason generator.
- Code generation with Mason by Very Good Ventures (VGV).
- Mason GitHub Repository by Felix Angelov.
And how does it do all that, you ask? Well, magic. Kind of…
🦄 It uses very_good_cli for the creation of the base App. Therefore, it follows VGV’s best practices and standards for architecture, directory structure, workflows, localizations, testing approach, state management with bloc…
📦 It populates 4 packages
- google_places_client — Implements an HTTP client to interact with the Google Places API. It currently supports
- Place Details — /details
- Find Place — /findplacefromtext
- Nearby Search — /nearbysearch - google_places_models — Includes Dart models to handle JSON objects from the Google Places API.
- This package is brick itself. - google_places_repo — Exposes a repository implementation to interact with the Google Places API via the GooglePlacesClient.
- permission_client — Handles on-device permission requests.
🔑 It allows developers to set different Google Maps API keys for their corresponding execution environments: development, staging, and production.
📍 It includes the necessary configurations for Android and iOS to provide in-app location permission.
🧪 It comes with 100% code coverage through unit, bloc, and widget testing.
All you need is to have mason_cli and mason setup on your local machine, install the google_places_starter brick and execute it. Follow this super simple guide to get you up and running in a second.
🗺 My Google Places App
I decided to put this brick to good use and create a fairly simple App that allowed me to (prove my point) browse for Google Places and see their details. So, this is what I came up with.
The only additions I had to add on top of the auto-generated code were the UI widgets and state management logic for the home and place details screens. I haven’t done the math on it, but implementing those two things took me a couple of hours while implementing the underlying auto-generated code took me about… MUCH LONGER.
All this code is open source, so feel free to check it out here and test it yourself.
💭 Final Thoughts
The key takeaway here is that, by using this tool, you’ll save yourself a lot of time and headaches and will be able to get down to business with your idea and start implementing the features your App deserves. The world is your oyster!
Lastly, here’s my GitHub open source repository hosting mason bricks that help Dart/Flutter devs to enhance and speed up their coding experience.
And, that’s it! I would love to hear your feedback about this blog or discuss any related topics, so feel free to drop a comment or reach out to me on Twitter.
