HomeWho We AreContact

A Tale of Two Apps

By Neil Ludlow
Published in Personal Projects
August 20, 2024
6 min read
A Tale of Two Apps

This is a tale of my first two personal mobile apps I added to the two mobile app stores, Google Play and Apple’s App Store, UK MPG Calculator and MPG Multi Vehicle.

UK MPG Calculator was my first mobile app on the app stores in around June 2022, I believe. MPG Multi Vehicle was published on the app stores around June 2024. This is just a look at each one with some of the differences and similarities between the two.

Shortdark apps on Google Play…

Shortdark apps on Google Play

Shortdark apps on Apple App Store…

Shortdark apps on Apple App Store

Background

I am a software developer. Most of what I’ve worked on has been web-based. I started off with HTML and CSS in 1999, then some javascript and ASP in 2000, before settling into PHP and SQL which were my main languages for quite a while.

There was a time when I might not have pushed myself and learned new things, but by about 2017 I decided to start learning as many new things as I could. The pattern goes something like this:

  1. Learn a language by following some kind of course.
  2. Do some little projects in the language, generally as part of the course.
  3. Use the language to build something that is bigger and actually does something useful, which would be a personal project.
  4. Once I have used the language in the wild, start to accept work using the language.

The reason to do step 3 is that while it may be a good course, there will be many holes. Making a fully-functioning app that does everything you want it to do is the only way to prove to yourself that you are able to do what you need to with the language.

With something like an app, you also have the added complication of having to get the app approved by each app store. Coming from a course, the thing they will probably not talk too much about is publishing the app after it’s finished. The reason is obviously that the app stores can change at any time, so the information can get out of date quite quickly. Some of what is involved in getting published will be the same for any app, some may be specific to that particular language.

UK MPG Calculator

UK MPG Calculator was created in 2020 after learning React Native. My car at the time did not have a MPG reading on the dashboard, so I wanted a way to calculate the MPG (miles per gallon) the car was getting.

It was modified from an example. All the things that weren’t needed were stripped out and made it so that you add the information from filling up and the second time you fill up and add the information it tells you what your MPG is for the time between fill-ups. Then, I added other calculations such as miles per day, cost per day and cost per mile. At some stage I started adding extra screens and functionality, like the graphs. At some point one of the app stores wanted more account functionality, such as forgotten password functionality and delete account, so that was added and it was starting to look like a proper app.

UK MPG Calculator on Google Play…

UK MPG Calculator on Google Play

UK MPG Calculator on Apple App Store…

UK MPG Calculator on Apple App Store

This app is created with React Native (Expo) which means the same code can be compiled for both Apple and Google. The data is stored in a MongoDB database, and the app speaks to the database through an API which is made with NodeJS. Having this kind of setup gives a lot of control because I can choose exactly which info to store, and when I want to display information on the graph, I choose which data the app receives. I have a lot of this kind of control because I’ve built the API myself. The downside of this level of control is that I have to code all the functionality myself, including things like the reset password.

Everything works pretty well. As far as I’m aware, it’s fairly bug-free. I’m not a designer so I’d say the look and feel of the app could be better, especially on the larger tablet screens, and would be better if it was for a client. For this, I didn’t feel that I’d learn much from spending on a lot of time on getting the app to look perfect.

MPG Multi Vehicle

Having made the UK MPG Calculator app in 2020 and having changed cars a few times since making it, in 2024 I needed a way to be able to put different cars’ data into the same account. The previous app only allowed one car per username. I could have modified the previous app but changing from one to many cars would have been a headache so I decided to learn another language and start from scratch.

With MPG Multi Vehicle, I not only wanted multiple vehicles, I wanted to be able to manually choose the date for each reading so that I could enter in the old data for previous cars. Other than this I didn’t have any further requirements but I did want to build it in a completely different way to before.

As such, this app is built in Google’s Flutter framework, which is similar to React Native in that it allows the two apps to be compiled from the same code. Also, this app does not have a separate API and database, instead it uses Google’s Firebase. Firebase provides a way to store data in a similar way to MongoDB, and means that a lot of the user functionality such as registering, signing in and forgotten password, are all done for you.

MPG Multi Vehicle on Google Play…

MPG Multi Vehicle on Google Play

MPG Multi Vehicle on Apple App Store…

MPG Multi Vehicle on Apple App Store

I like how the second app turned out. I found flutter very simple, on the whole, and I really liked the graph package which allows greater flexibility.

Because I’m just querying the Firebase database directly instead of an API, all the calculations (miles per gallon, cost per mile, cost per day, etc) are calculated in the app itself. In simple language, you only have one thing to code, the app, instead of two things, the app and the API. This basically cuts the amount of coding in half, and means there are half as many things to worry about. But, it also means that I couldn’t make the calculations in the API and pass the app the information it was asking for with these calculated values. So, the app itself is doing more of the heavy lifting than the previous app was.

Again, it’s not a work of art but I was able to make it work in a mainly bug-free manner and get it published to both app stores relatively quickly.

Discussion

As mentioned already, both apps are completely different in how they are created and how they function.

Making the first app was the steepest learning curve. Not only was it not web, but you learn the language, then get it working on android and iphones, then you have to deal with the two app stores. So, after working on the first app, and having worked on other apps in the meantime, the second app was a lot easier in many ways, but it was still a completely different language.

On the one hand, I liked the API style of app for the first app, but on the other hand I liked the speed in not having to make an API for the second app.

The second app has more vehicles and so we’re able to see more and different graphs and data. Having said that, as I write this, I didn’t bother calculating a lot of the data from the first app. The second app would be nice to work on further, make more calculations and create more graphs. I could even make the main MPG list of each vehicle look a bit simpler, like in the first app, so that you can click into each date to see the detailed information.

I’d say that these apps are just personal projects, so don’t really matter in the greater scheme of things. For commercial clients, I’d prefer to use an API for greater control, although there will be arguments for using Firebase as an API too.

For my third personal mobile app, I don’t know which method I’ll use to create it at this point. Maybe one or the other, or a hybrid.

MPG Multi Vehicle graphs

Conclusion

Learning new stuff is great!

In these two apps I learned two app frameworks which allow you to build for android and iphone simultaneously (React Native and Flutter). The boring, behind-the-scenes way the apps work are both very different, which is great because it means that I’ve learned twice as many things.

Simply having built something both ways is very useful, and gives added ammunition for the next app project I start.


Tags

#react-native#flutter#firebase#node#mongodb

Share

Previous Article
Renewable Energy in Yorkshire
Neil Ludlow

Neil Ludlow

Freelance Software Developer

Table Of Contents

1
Background
2
UK MPG Calculator
3
MPG Multi Vehicle
4
Discussion
5
Conclusion

Related Posts

Renewable Energy in Yorkshire
August 12, 2024
8 min
© 2024, All Rights Reserved.
Powered By

Quick Links

About ShortdarkContact

Legal Stuff

Social Media