The $65/Month Tech Stack I Use to Build and Launch Projects Quickly
Some developers seem to constantly switch their tech stack, chasing after newer, smarter, or cheaper tools to save a few dollars here and there. But is it really worth it? I've been using the same technology for years, which has enabled me to ship project after project quickly. The best part? It costs me only about $65 per month. In this article, I'll walk you through my entire stack and explain why I've chosen each component.
The Frontend Setup
Let's start with the frontend. I use Next.js, which is built on top of React. This provides the flexibility and component-based architecture I prefer for building applications. Next.js includes built-in routing, which can take a little time to get used to, but after one or two projects, it becomes incredibly straightforward.
For example, to create a new 'all listings' page, I simply navigate to the app
folder and create a new subfolder, let's say listings
. Inside that folder, I create a page.ts
file. At the top of this file, I add the 'use server'
directive.
// app/listings/page.ts
'use server';
import ListingsClientComponent from './ListingsClientComponent';
// This can be used to set metadata for the page
export const metadata = {
title: 'All Listings',
description: 'Browse all available listings.',
};
export default function ListingsPage() {
// Server-side logic can go here
return <ListingsClientComponent />;
}
This ensures that all operations within page.ts
are executed on the server. This is particularly useful for tasks like adding a metadata object directly in the file. Typically, you would then create a client component and import it into this page.ts
file. On the client-side component, you can leverage all the powerful hooks like useEffect
and useRef
.
For styling, I consistently use Tailwind CSS because it significantly speeds up the process of making design changes. It's one of those tools that's hard to live without once you've used it. I often pair it with Daisy UI, a library built on top of Tailwind CSS. Daisy UI offers numerous pre-built components like buttons, modals, and alerts, which are convenient and easy to implement. It also includes over 20+ themes. So, if I want to implement a dark theme for a new project, I can easily enable it with Daisy UI without having to manually figure out a matching color palette. I just select a theme, and I'm good to go.
Integrated Backend with Next.js
Now, let's discuss the backend. The great thing about Next.js is that you no longer need a separate backend service. All the necessary logic can be housed within the same Next.js project. You simply create your endpoints inside the api
folder. For each endpoint, you create a route.ts
file, and all your routes are defined right there. This is incredibly efficient because it eliminates the need to manage separate Node.js backends, which also saves money.
For cron jobs, I define them all within the vercel.json
file located in the project's root folder. This provides a clear overview of when each cron job is scheduled to run.
Database: Flexible and Scalable
For the database, I typically use MongoDB. While some developers have reservations about it, I've never encountered any issues. MongoDB provides the flexibility I need, and making changes to the data structure is very straightforward. I use Mongoose to help define schemas and add validation. For database management, I rely on MongoDB Compass. It offers a great overview of the database and is incredibly helpful during development for easily modifying or adding data, which is also beneficial for debugging.
When starting a new project, I spin up a free M0 cluster on MongoDB. For larger, more critical projects, I opt for a backup plan at $10 a month, which is a worthwhile investment for peace of mind. For offline development—like when traveling or in a café without Wi-Fi—I use a local MongoDB instance on my machine, which works perfectly.
Authentication and Payments
For authentication, I consistently use Clerk. It's well-supported by Next.js and is incredibly easy and quick to set up. While there's much debate about using NextAuth or other alternatives, Clerk works perfectly for my needs due to its simplicity.
Setting up OAuth for providers like Facebook, Google, or X is as simple as flipping a switch. That said, for production, you still need to create a developer account with each provider (e.g., on Facebook). However, Clerk provides excellent guides that walk you through this process, making it relatively easy to configure for a live environment.
Clerk is also great for implementing magic links. I personally prefer using magic links over storing encrypted user passwords in the database. It's a much simpler and more secure approach, and Clerk makes it very easy to implement.
Note: When you begin with Clerk, you need to set up a webhook to sync user data with your own database. This process is quick, taking less than 10 minutes to configure. It's worth noting that Clerk is free for the first 1,000 users. For local testing of webhooks, I use ngrok, which is also completely free.
For payments, my go-to solution is Stripe. I use Stripe Connect for marketplace platforms. It does take some time to get familiar with the Stripe ecosystem and its API.
- Standard Projects: For a project that isn't a marketplace, the setup is relatively straightforward. You just need to decide between one-time payments or subscriptions and then set up a webhook to listen for events from Stripe, such as a successful payment.
- Marketplaces: These are more complex because you need to enable users to both buy and sell. This requires setting up a complete user onboarding flow where sellers are directed to Stripe to provide their banking details to accept payments. In this model, you act as the intermediary between the buyer and the seller. This involves more setup time, but like anything, it becomes easier with experience.
Hosting, Deployment, and Operations
I host all my projects on Vercel, the company that created Next.js. This makes Vercel a perfect partner, especially when used with GitHub. My workflow involves connecting my GitHub account to Vercel. Whenever I push changes to my GitHub repository, Vercel automatically detects them, pulls the latest code, and deploys it to the live environment seamlessly. For this service, I pay $20 a month, which I consider a fair price for the automation it provides.
For emails, I use SendGrid. It makes setting up transactional emails and automated email journeys very simple. Adding a new email sender is also straightforward. SendGrid's free plan allows me to send up to 100 emails per day.
If a customer reports a minor bug, I check the logs in Vercel. There, I can view production errors and API responses for the last 24 hours, which is usually sufficient for troubleshooting. This logging feature is available for free.
Analytics and SEO
For analytics, I use Google Analytics, which I set up via Google Tag Manager. This allows me to track essential metrics like user counts, page views, and bounce rates. I also occasionally set up custom events, for instance, to track how many users click the 'checkout' button, which is also managed within Google Analytics.
For SEO, I use a combination of Google Search Console and a keyword tracker called SERP Robot, which costs $5 a month. With SERP Robot, I can monitor my Google rankings for specific keywords. I track this because I know that reaching the top 10 for a valuable keyword like 'MVP marketplace' will drive a significant number of new customers. It's also useful for seeing the impact of changes I make to my articles on search engine results pages (SERPs).
Asset Management and Performance
On several of my projects, I use Cloudinary for image storage. It provides greater control and can enhance performance. Speaking of performance, I don't need to manually configure a CDN because Vercel, Next.js, and Cloudinary handle it automatically. This ensures that users worldwide receive a fast version of the site. Cloudinary also offers a generous free tier, so this comes at no extra cost.
Productivity and AI Tools
In the final category of productivity and AI, I use Cursor for coding. It's like having a coding partner right beside you. I can give it instructions, and it executes them for me. I particularly like Cursor's Command-K feature, which allows me to select a piece of code and quickly apply a specific change to just that section.
I still use ChatGPT, but primarily for high-level planning, like getting an overview when starting a new project. For the actual coding and implementation, I rely on Cursor. I pay $20 a month for both of these tools.
Final Thoughts
So, that's the stack. One crucial thing to remember is that nobody really cares what technology you use—especially not your end-users. They just want the product you've built to work reliably. Whether you choose Ruby on Rails, Rust, or Bootstrap instead of Tailwind, it doesn't matter. The key is to use what you're comfortable with and stick to it. This allows you to master your tools, becoming faster and more proficient at building.
Join the 10xdev Community
Subscribe and get 8+ free PDFs that contain detailed roadmaps with recommended learning periods for each programming language or field, along with links to free resources such as books, YouTube tutorials, and courses with certificates.