I had been struggling with creating schemas for objects and aligning those objects with the Firebase Firestore fields. Typescript had been on my radar for some time, but I hadn't worked with it before.
Typescript was really easy to integrate into the project. Vue 3.x is written fully in Typescript so it has excellent support. All I had to do was run
vue add typescript and the rest was straightforward. Obviously I had to learn some of the special keywords that Typescript has, but I am quite familiar with the pattern of using Interfaces.
Since I've had a few months away from this project, I realized that my original app was not mobile friendly! Whether I like it or not, the majority of people won't give my app a try if it doesn't work on their phone.
I spruced up the login screen and simplified the dashboard so it's easily viewed on screens down to an iPhone 5.
It's getting closer to an initial launch and trial by some close friends and family!
I had a goal to ship Topple before the end of 2020. The time frame slipped a bit, but I'm still planning to release the app as an MVP to get user feedback.
Getting the logic ironed out to calculate the paydown data was crucial to the app's functionality. Now that this is working, I will work on the UI.
I have a goal of shipping Topple 1.0 before the end of 2020. I decided to use Firebase for authentication and data storage. It's simple to install and set up so I didn't have to spin up my own database.
Over the weekend, I worked to integrate Firebase into my Vue.js application locally. I learned about a few features that I didn't know existed for Firebase.
First, Firestore has a function called
onShapshot that allows the app to fetch database updates when they happen. This keeps the local state and the database data in sync.
Second, Firebase Auth offers a function called
onAuthStateChanged that allows you to call logic every time the event triggers. I used this hook to monitor the database collections once the user had logged in.
I'm very excited to ship this app so people can use it to topple their mountains of debt!
I wanted to learn more about Vue. I had recently become frustrated with the limitations of my Excel spreadsheet for planning and tracking my debt payments.
This was a great project to start with. I built a single .html file with a script of the Vue code. My next goal is to release a full-fledged Vue app and integrate Firebase 👍
I want to help people get out of debt by planning and tracking progress.