I made an API-first app!

Published on Sep 15, 2020

I WON! At least I feel like I won. I finally made an API-first app that's pushed to production out in the real world. And it works! It's a Rails todo list REST API as backend, and then a Vue app as frontend to fetch data from the API, via axios, basic auth and environment variables.

https://todolist-railsapi.herokuapp.com/todos/ <=> https://hello-world-axios.netlify.app/

But amongst tech stacks, this has got to be one of the weirder combinations. Vue with Node maybe. Or any of the more recent and modern frameworks to handle the backend server. Rails is usually thought of as a monolith, not quite JAMstack. So how did I come to this combo?

Last year I discovered JAMstack, and I knew it in my gut (even though I'm a coding noob at that time) that I want to explore this tech stack for making web apps, and eventually my SaaS. But I didn't know how to get there. I dabbled with Stackbit then and it was such a great way to slowly orientate myself to JAMstack, since you can literally spin up a JAMstack website in minutes using Stackbit. I made tiny customizations to the template, slowly begin to read a little JSX/React/Gatsby, how everything connected together. But how do I make an API, and which frontend framework should I use to fetch data from it? I knew a bit of Ruby on Rails by then (from my learning to code journey the year before), and I always felt that creating a backend on Rails felt within my reach. It wasn't as scary as using other frameworks. And I'd done it with Rails before already. So I decided to go for Rails as my backend framework of choice.

Then I (re-)started my journey of learning how to code, this time with Vue.js. AN hour of code everyday. Just start. I got inspired by what @dannypostmaa was doing with his product Headlime, and he also didn't know how to code eight months ago! When asked, he said he picked up Vue.js because it looks easiest to start. So I researched a bit, and discovered it suited my programming taste. It can be adopted progressively, and all that's needed was to add a script to the html file, just like the good old jQuery days. That was familiar because all the HTML, CSS and JS were all used the same way I was used to in web development 101. It was not so scary unlike React, Next.js and Gatsby where everything was JS. Learning Vue had been such a joy. I could never have known that I would enjoy coding this fun, all because of a framework that was suited to me. But more importantly, I also found incremental ways to learn coding and to stay motivated, by browsing mini Vue projects on Codepen, and learning from them.

And now, after almost two months of feeling my way through coding on Vue and then Rails, I have a production-level kind of app (albeit a very basic one) using that Rails-Vue stack. It felt like I'd come so far from only knowing how to make informational websites using HTML, CSS and JS. Or to go even further back, from making sites using Wordpress. 

And the best part? That sense of excitement and possibility, from what was a tiny little spark, to what's a blazing fire today. Now that is precious beyond measure.