Let me start my blog with my favorite JS tech stack (at least for 2024):
-
supabase (postgresql + auth)
-
nextjs
-
tailwindcss (using shadcn/ui)
Supabase
I’ve built one client project on supabase already and to be honest this is the only project that works without issues and my support. It simply works.
The second reason I’ve chosen supabase specifically for my side projects is because of the ability to focus more on the frontend part and product logic and not dive deeply into the backend part.
And the authentication for nextjs is out of the box! It’s simple (cookie-based) and secure enough I hope.
Next.js
Not much to say here.
Nextjs became a default choice for the react development.
Vite is a good one too, but no server-side rendering or routing.
So nextjs is more like an all-in-one solution for full stack web development. And it’s very simple to deploy to Vercel as well.
shadcn/ui
It’s a collection of different UI components you don’t install via the package manager. Based on radix primitives and styled with tailwindcss.
You can simply initialize shadcn/ui in a project with CLI:
npx shadcn-ui@latest init
Do some configuration stuff depending on which framework is used in your project and you’re good to go.
You can then add any component to your codebase, e.g. button:
pnpm dlx shadcn-ui@latest add button
You’ll own this code and can modify this UI component as it’s not installed as a dependency but only copy-pasted to your codebase with the CLI tool.
I’m currently trying these components in my very first side project (monoflash — single-sided cards for language learners) and I do like this approach a lot.
That’s it!
Extremely simple (no extra API services) and so potentially powerful (you can decouple the postgres DB at any time in the future and build your very own backend if you need to).