6 min read

My Tech Stack For MVPs


I was looking for a tech stack that lets me build side projects or MVPs for cheap, and ideally for free. My other criteria for choosing the tech stack were more practical like

  • Should not have a steep learning curve.
  • Decent documentation and community.
  • Easy to deploy.
  • I should be able to focus on my business logic and not have to worry about the basic boilerplate.

With some side projects, learning a new language or framework is as important to me as finishing the side project. But I also looked up some no-code tools in case I don’t have the time to code or if the task is boring.

No-code Tools

Tools like Airtable or Glide are great to build some basic apps. And these tools create the entire app, no need to worry about the backend or the frontend. Airtable also has a free tier and an AI helper that can create templates for basic use cases.

And for cases where one might want to experiment by changing the landing page to figure out what leads to a good customer conversion, tools like Carrd or Framer have a great WYSIWYG editor. Carrd even has a free tier.

Somewhat Technical Tools

I like to use AI coding agents to work on mundane programming tasks. Github Copilot, Cursor or Windsurf can generate decent code. My experience with AI coding agents is mostly positive as long as the problem statement contains sufficient technical detail about the expected implementation e.g. a prompt like “build a React component to display the price of a product that accepts props like a string and number that represents the price that should be displayed. The font size for the price should be 3rem” will produce better results than “build a React component to display price of a product”. Copilot has a free tier that I use for most of my grunt work.

Products like Vercel, Lovable and Bolt have more context-aware AI agents i.e. they generate apps using a particular framework. These products can take a prompt like “build a bug tracking app” and generate a working app in a framework while following all the conventions of the framework. I found that this is great for when I am new to a framework and don’t know exactly how to implement something, or, if the task at hand is just not interesting enough.

These products also accept images or designs from a Figma project to build a page that looks like the image or the Figma design. They work better with more well-defined, specific prompts that contains some description of the implementation detail e.g. “Build a bug tracking app that has a UI as shown in the attached picture named picture-1.jpg. Please ensure that the UI is responsive. Also add a day/night theme toggle in and use the colour theme from picture-2.jpg for the night theme.”

Vercel and Lovable also deploy the code they generate to their own platforms. In fact, this blog is hosted on Vercel! Bolt meanwhile integrates with Netlify for deployment. All of these products have a free tier for deployment that works just fine for side projects. The generated code can also be exported and deployed on external platforms.

More Technical Tools

Using these tools is probably the cheapest in terms of money but more expensive in terms of time and sanity.

The Language

For building a side project or a MVP-type web app, I think the most practical and versatile language is JavaScript or TypeScript because it can be used for

  • Frontend.
  • Backend, at least for side-projects, MVPs or prototypes.
  • Gen AI powered applications can be built with the Javascript port of Langchain
  • Desktop apps using Electron JS.

So choosing Javascript or TypeScript saves the overhead of switching between languages and tooling.

The Framework

So now, I was looking for a Javascript framework where I could write both frontend and backend code in and build a modern looking UI. I narrowed it down to Next.js or, using Vite + Express.js with the vite-express plugin that integrates Vite with Express.js. I chose Next.js because that seemed easier than setting up Vite + Express.js. Deploy would be easier with Next.js since it’s just one app. I also found that Tailwind is a great time saving tool for CSS styling.

The Database

I prefer using Postgres for most of my projects because of it’s versatile nature. It’s open source and can handle

  • Structured data like a traditional RDBMS
  • Unstructured data files, blobs or JSON documents
  • Geospatial data
  • Vector data that is used in AI applications

It’s also a database that I have experience with and for a new project that is evolving, I know that Postgres will satisfy most of the use-cases.

Among cloud hosted Postgres solutions, I found that Supabase works best for me. They have a free tier for apps that have up to 50k monthly active users and a limit of 2 active projects. I also considered using Neon. But I ended up choosing Supabase because it also provides authentication integration for SSO with popular identity providers like Google or Github.

Deployment

For deploying my apps, I considered using the serverless offering on all major cloud providers like AWS, Azure, DigitalOcean and Google Cloud. I chose AWS because it has the largest free tier for my use case. I also briefly considered the cheapest tier of DigitalOcean droplets because at $5/month, it looked like a good option for hosting multiple apps on one host. But eventually I realised that for my use case, even with multiple apps, the AWS lambda free tier is more than enough. AWS has also built a nice abstraction on top of their lambda product called the AWS Serverless Application Model (SAM). They also have templates to get the users started that covers most popular languages and frameworks.

Conclusion

So my final tech stack is

  • Language: TypeScript
  • Framework: Next.js
  • CSS Styling: Tailwind
  • Database: Supabase, which also provides authentication and integration for SSO.
  • Deployment: AWS SAM

I also used quite a mix of AI coding agents to build my app and I thought the free tier wasn’t enough for my needs. I now feel that there’s never been a better time to build and validate MVPs on the cheap.