Pi Garage Mobile App

- 2 minutes read - 382 words

Along with the backend part of Pi Garage I really wanted to have a mobile app (both iOS and Android) so that it would be easy for users to use Pi Garage without having to configure a 3rd party app (like Home Assistant) or via an API page (like Swagger).

I have had experience with React Native and found the experience akin to fingernails on chalkboard. I wanted to use something that had a better developer (and maintainer) experience.

Having a look at alternatives I found Ionic and Flutter. Without delving too deep into the differences I was drawn to Flutter for some reason even though I didn’t have any Dart experience. I knew for the most part that it utilised the Material Design system underneath so this would allow me to use off the shelf components without having to reinvent the wheel.

As above I had not had any experience with Dart or it’s ecosystem and some things initially slowed me down. I typically like using UI prototyping software for UI development (such as Storybook) but I didn’t know one right away (I’m still looking for a good alternative) and this slowed down the development.

Pi Garage App

Pi Garage App

I will say though that the Flutter dev tools and VS Code integration is much better than React Native and have found it a refreshing positive experience to develop with. It hasn’t been all roses though as I’ve had a few pet peeves and these are listed below.

  • Auto formatting not working if you are missing a “;” character at the end of a statement or if you are missing a bracket.
  • “const” vs dynamic data. Flutter/Dart expects that things in the UI are “const” where applicable so that it can optimise itself. When you introduce some dynamic element your code block will be red and you will have to find where to insert the “cost” to fix it as it won’t automatically fix itself.

NOTE: Those problems may have solutions with VS Code configuration but I just have not found it yet and are just some small niggles to be aware of. It’s worth noting that I normally have my VS Code setup to auto format on save for javascript/typescript so not sure if this prevented Flutter/Dart tools from fixing the above.