Gascan
I rewrote/created a gas milage tracking app using Vuejs called Gascan. This was necessary mainly because I am a cheapskate.
The Django Version
A few months ago, I created a gas milage tracking app using Django. I had just recently started learning how to use Python, and I thought this would be a good project to learn with.
It was ok. I learned that Django is fine, (not amazing, kind of annoying, but fine) and that Python really sucks when it comes to versions and or package management, which is not exactly a unique opinion.
So, I got the app working. Check out the Django version of Gascan. I think it was pretty well executed. It has a simple email based sign up. You can register multiple cars, and each one can have many “fillups”, and the app calculates the gas milage. Pretty much exactly what I set out to do.
But why?
I have an aging Honda Fit. It gets pretty good gas milage, but it seemed like it was getting worse. So I started tracking the gas milage using Apple notes and the calculator app.
This was also fine. But here’s what usually happened. I’m at a gas station. There’s usually a lot of people, sometimes waiting for the pump. I feel pressure to get out of there as quickly as possible. So I generally just write down the odometer and the gallons of gas, and get out of there, leaving the calculation for later. Which I almost never did.
To me, this seemed like a perfect opportunity to try creating an app. The calculation is simple, but it would be nice if it happened automatically, something a computer is much better at doing than me.
Plus, A few years ago, I was looking for gas milage apps on the app store. They all kind of sucked, and they all had ads. So I thought it would be a good excuse to try making my own.
Back to the present day. So I had my gas milage app. I had my phone. Unfortunately, I also had Heroku. Heroku is great. I’ve used them before for lots of things and I’ve always been impressed with everything they do.
However, their ~30 second waiting time for the free app tier was basically making it so I pretty much never actually used my app, because the loading time seemed much longer when I’m sitting at the pump, waiting for the app to wake up. I know that I could have solved this problem by throwing money at heroku, but, remember, I am a cheapskate, and I didn’t want to pay the heroku hobby price.
Just do it in JavaScript
After my last project, I knew I could create a free app using Netlify that wouldn’t have the same 30 second wake up period. Also, I have been using Vue.js lately, and I thought this would be easy to recreate using that.
Ace of Database
But, you’re thinking to yourself, “Hey idiot, you won’t have any data persistence without some kind of backend”, and you’d be right. Using this approach meant I had to come up with some other way to store the fillup data.
I decided that localstorage would be good enough for my purposes. I don’t think that I really need to persist this data over long periods of time. Basically, this will stick around until I get a new phone or clear out my browser.
The way I see it, tracking your gas milage doesn’t really need to always have absolute data integrity. Generally, I get a feeling that my car is running poorly, and I want to see if it’s all in my head or of it’s really true. So, over the next month or so, I can track my gas milage. Then, if I want to do it again, sure, I guess it’d be nice to know what it was last year, but in my mind, it’s really about what’s happing in a smaller clusters of time.
Plus, if I really want to make this more robust, I can try to figure out some kind of way to keep this data around so it’s not just stuck on my phone - but I can do that later.
So, I went ahead and did it in vue, using localstorage. This also made it so you don’t have to create user accounts. Which I think is a nice bonus.
Midwest Can Company
When it came time to do the branding, I had already decided I wanted to call this thing “Gascan”. I did a duckduckgo image search for gas cans.
I really didn’t like the look of this:
But I did like this:
I remember having one of those as a kid in the 80s. It looks so much cooler than the modern plastic ones, so I based the branding on that.
So now I have a gas milage tracking web app that loads pretty much instantly, and I can track my milage without waiting or paying any money to Heroku.