How I run my site for (basically) free
Like many indie hackers, I work on different side projects while holding a full time job. As I deploy some of these apps, I find myself very conscious of how much money I'm spending on the projects.
For a while I found myself in analysis paralysis trying to optimize my spending down to almost zero. Well, I did it.
Jamstack
If you haven't heard of jamstack, you can check out what it is here, but it's essentially delivering a static JavaScript payload to the browser and using serverless APIs to create back-end functionality.
Here's my strategy to run a jamstack site and keep costs to a minimum, while still serving my needs.
Site - Nuxt.js + Vuetify
One downfall of jamstack is that SEO is not great when you're serving up a JS SPA with no data populated (see here). While search engines are getting better at executing JS while crawling, there is still no guarantee that the content of your site will populate for SEO purposes.
To get around this I use Nuxt.js, a framework built for Vue that allows you to statically render pages at build time and deploy the full html pages to a CDN. My site traveling weather has roughly 3,000 pages being statically generated and deployed to a CDN to show weather data in a variety of cities. These html pages are fully generated before being delivered to the browser so search engine bots can index them easily.
I currently use cloudflare pages to host the static site files, but there are a variety of low/no cost CDN options out there.
API - Azure Functions
The web API that services the site is built on azure functions, which are Microsoft azure's implementation of serverless functions. You get ~1,000,000 free executions every month on the consumption plan, and beyond that it goes up by the pennies per million requests. They also support a variety of languages.
Analytics - Azure App Insights
Since I'm already running azure functions, I can easily hook up azure application insights to get analytics on visitors and performance on my sites. It's free for low-mid range usage.
Storage - Azure SQL
This is the only real cost with my setup besides DNS. I currently use Azure SQL databases as my go-to storage, which is probably the least-optimal part of this cost effective setup. This decision really came down to my familiarity with building on Azure SQL.
A note on familiarity
You may have noticed a lot of Microsoft services being utilized, and that's mainly because I choose technologies that I'm familiar with from my day job to build and prototype ideas quickly. If you're considering what stack to build your projects with, familiarity should always be one of the biggest deciding factors. If you can't build and iterate quickly, the feedback loop is going to be too slow to validate and improve your ideas.
I kind of took a different approach. I built my site and put it in the GCP compute engine which is lifetime free until your site doesn't need much CPU or RAM.
I took this approach because I don't want to limit my options(technology choice, framework choice & etc) at the time of building my site. Here I just need to worry that it shouldn't use a lot of computing power & memory that's it. Anyway at starting we serve fewer users and limited use cases so that's not a problem.
Check details here -> https://cloud.google.com/free/docs/gcp-free-tier/#compute
Thanks for sharing. I am a huge fan of jamstack too, I use Gatsby + Netlify for my newsletter/blog website.
I've used AWS a ton and also GCP, but haven't had much experience working with Azure. Any clear cut benefits of Azure over AWS/GCP in your experience?
Thanks for sharing. As a devops guy I found out AWS serverless model is quite good and cheap, especially for AWS it has Amplify framework where I could manage all the infrastructure as code. I've used Azure in my last full time job as well but found it a little bit less user friendly compared to AWS.