My Favorite Tech Stack

As web developers, the success (and our sanity) of our projects often comes down to the tools we choose. Over the years, I’ve settled on a set of essentials that cover everything from code to deployment to monitoring. In no particular order, this is the software I use when I create my projects.

Git & GitHub

I would be surprised if you haven't heard about it yet. I almost didn't include it on the list as almost every project already uses it, but I would be remiss in mentioning it as I wouldn't be able to quickly test and iterate on my projects without it.

Why I love it:

• Non-negotiable version control: branching, pull requests, code reviews, and rollback safety.

• GitHub Actions powers CI/CD out of the box—run tests, lint, and even deploy directly on merge.

Next.js

Although typically over-kill for most of my projects, next.js is an incredibly powerful framework that lets me create full-stack web applications without having to create separate back-ends for my projects. Server actions, folder based routing, and generating server side html are the biggest wins that I get from Next.js. If you have never used it before, the official documentation is verbose and amazing (just make sure you are in the app section of the docs and NOT the pages section). In addition, virtually every library that I use has documentation on how to implement it with Next.js allowing implementation of new features a breeze.

Why I love it:

• Hybrid SSG/SSR lets you choose performance or dynamic data per page.

• File‑based routing, API routes, and built‑in image optimization reduce boilerplate.

• App Router + Server Actions give you powerful data fetching and mutation patterns.

Pro tip: Incremental Static Regeneration (ISR) is your friend for pages that need rare updates—cache at build and refresh in the background.

Tailwind CSS

CSS is a pain. Positioning a div just the way you want can be more difficult than Leetcode's daily question. If your like me and would rather have preset defaults for styling your markup, tailwind is the answer. AI is also much better helping with tailwind styling than default CSS if you regularly receive help from your favorite AI.

Why I love it:

• Utility‑first means no more fighting CSS specificity or scope leaks.

• JIT engine only emits classes you use, keeping final CSS slim.

Pro tip: Pair with Headless UI or ShadCN components for accessible, unstyled building blocks you can theme via Tailwind config.

ShadCN/UI

ShadCN is a gift from above for prototyping UI for new applications. Between Alerts, Modals, Cards, Forms, Date pickers, and everything in between; ShadCN allows you to mock up interactive applications without writing thousands of lines of boilerplate.

Why I love it:

• Provides a library of unstyled, accessible components that integrate seamlessly with Tailwind CSS.

• Rapidly scaffold reusable UI pieces—modals, forms, cards, and more—while retaining full design control.

• Maintained with best practices and TypeScript support.

Pro tip: Customize the component styles via your Tailwind theme and extend with your own variants for consistent branding across your app.

UploadThing (Image Management)

De facto easiest way to manage image uploads in Next.js. Everything 'just works' and provides robust tooling to help with anything you might need with images. The free tier is incredibly generous and most likely all you will ever need.

Why I love it:

• Simplified file uploads with built‑in S3 support and pre‑signed URLs.

• Automatic image resizing, optimization, and webhook callbacks post‑upload.

• Great TypeScript support and easy integration into any React or Next.js form.

Convex (Database + Backend Functions)

This is where I’m replacing the old Prisma section—and honestly, I’m excited about it. Convex isn’t just a database; it’s a real-time data layer and a backend runtime that lives right next to your data. You write typed queries and mutations in JavaScript/TypeScript, and Convex handles storage, indexing, auth integration, optimistic UI, and live updates automatically. No ORMs, no glue code, no separate server to babysit.

Why I love it:

• Zero-boilerplate backend: Write queries/mutations like regular functions; deploy without managing servers.

• Real-time by default: Data changes stream to clients—your UI stays in sync without extra wiring.

• Type-safe end-to-end: First-class TypeScript support across schema, queries, and client calls.

• Auth-aware and secure: Easy integration with providers like Clerk; access control lives close to your data/functions.

• Optimistic updates & caching: Built-in patterns that play nicely with modern React state.

Pro tip: Model your data around access patterns, not just entities. Convex indexes are lightweight—add a specific index per hot query to keep reads snappy. And keep server-only logic in Convex actions (great for calling third-party APIs or doing multi-step workflows).

Clerk (Authentication)

While not as robust as WorkOS, Clerk is the easiest way to setup auth in a next.js application. Everything you need to manage auth has already been streamlined with Clerk SDK - allowing you to skip the headache of implementing auth when its already a problem solved by others. The free tier will be more than enough for anything but the largest applications.

Why I love it:

• Drop‑in auth UI with email, social login, and magic links.

• Prebuilt Next.js components and hooks for protecting routes and fetching user data.

• Built‑in user management dashboard and webhooks for customizing flows.

Pro tip: Use Clerk’s middleware to guard your Next.js API routes and pages server‑side, preventing unauthorized access early.

Vercel (Hosting & Analytics)

My favorite service for hosting my applications. I wont bore you with the countless reasons I like Vercel over other services but I can safely say that Vercel has saved me from many headaches, docker files, and monthly VPS subscriptions. If you are prototyping your new application, Vercel is the way to go. Great free tier for testing your applications.

Why I love it:

• Zero‑config deployments: push to GitHub and every branch gets a preview URL in seconds.

• Native Next.js support: edge functions, image optimizer, serverless API routes, and more.

• Built‑in Analytics give you real‑time performance metrics (web vitals, page load times) without extra scripts.

TanStack Query

TanStack Query, the evolution of React-Query, has been a developer's favorite for managing data in your React application. Between massively reducing database calls by caching requests, built in loading and error handling, and great documentation; TanStack is a must use library for every web application. I can't imagine an application not benefiting from this library in some way.

Why I love it:

• Declarative fetching, caching, and synchronization of server state in React.

• Features like cache invalidation, pagination, and optimistic updates handle complex UIs with minimal code.

• Smooth integration with Next.js App Router and server actions for SSR/prefetching.

Pro tip: Install React Query Devtools to inspect queries and mutations at runtime.

ChatGPT Codex (AI Pair Programmer in the Cloud)

This one deserves its own spotlight. ChatGPT Codex has quickly become my favorite LLM-powered tool when building apps. It’s more than autocomplete—it feels like pairing with an engineer who not only understands your stack but also your workflow.

What sets Codex apart is that it builds in the cloud. You can spin up parallelized prompts, test multiple approaches at once, and merge the best results back into your project. Even cooler: it seamlessly creates Git branches as part of its workflow. That means I can leverage my Git knowledge—branch, test, merge, rollback—directly with AI-driven feature development. No messy copy-paste, no risky overwrites, just a clean, version-controlled workflow.

Why I love it:

• Parallelized prompting: Explore multiple solutions to the same problem without context-switching.

• Git-native branching: AI-driven features arrive in isolated branches—making merging and rollback effortless.

• Cloud builds: Heavy lifting happens remotely, so my local environment stays snappy.

• Seamless integration with existing stacks: Feels like Codex was designed to plug straight into a Next.js + Convex + Vercel flow.

Wrapping Up

These tools form the backbone of my modern web‑dev workflow. Git/GitHub keeps history organized, Next.js and Tailwind and ShadCN tackle the frontend, UploadThing streamlines file uploads, Prisma/PostgreSQL handles data, Clerk secures access, Vercel deploys and monitors, and TanStack Query masters server state. Together, they let me focus on building great features and shipping fast. As always, I'm still experimenting with various parts of my workflow and have not yet decided if they will remain in my toolbox going forward. If you see something missing and you believe it deserves a shout out - let me know at undermouseweb@gmail.com