React + Node.js + PostgreSQL

If you read a hundred web developer job listings, this combination - often with TypeScript - is the one you'll see most. It's also a genuinely good architecture: one language from browser to server, and a database that won't need replacing as you grow.

Who gets this pick

This is the most common full-stack result. You'll see it when you're not on shared hosting, not building a real-time app, and at least one of these is true: you're comfortable or experienced, your goal is getting a job, or you're in a larger team.

Two ways to build it

Separate frontend and API. A React app built with Vite talks to an Express API over JSON, and Express talks to PostgreSQL. The boundaries are explicit, each part can be deployed and tested separately, and it's the clearest way to learn what each layer does. This is what our guides use.

One full-stack framework. Next.js (or React Router's framework mode) runs React on both server and client, with server-side code calling PostgreSQL directly. Fewer moving parts to deploy and very common in industry - but it blurs the line between frontend and backend, which can make learning harder. Try it once you've built the separate version.

A first project: a job application tracker

It's useful while job-hunting, and it exercises everything an interviewer wants to see:

1. API first. Follow our Node + Express + PostgreSQL guide, then adapt it: an applications table with company, role, status, and dates.
2. React frontend. A list with status filters, a form to add applications, and inline status changes.
3. Stats. A summary panel driven by SQL - applications per status, response rate - using GROUP BY.
4. Accounts. Sign-up and login with sessions in secure, HTTP-only cookies, and every query scoped to the logged-in user.
5. Ship it. Deploy all three parts, write a README with screenshots and a live link.

Hosting and cost

A common, low-cost setup:

• React on Netlify, Cloudflare Pages or Vercel (static, free) - see our React deployment guide.
• Express API on Render, Railway or Fly.io. Free tiers sleep when idle; always-on starts at a few dollars a month.
• PostgreSQL on Neon or Supabase, both with free tiers.

Mistakes to avoid

• Hard-coding the API URL in React. Use a VITE_API_URL environment variable so development and production point at the right places.
• CORS and cookies by trial and error. Allow your frontend's exact origin and set cookie options (secure, sameSite) deliberately.
• Validating only in the browser. The API must validate every request itself.
• N+1 queries - one query for a list, then one more per item. Use a join or WHERE id = ANY($1).
• Editing the production schema by hand. Use migrations from day one.

For teams

Adopt TypeScript across both halves, share types or validation schemas between them, and agree on ESLint and Prettier before the first pull request. A single repository with client/ and server/ folders keeps changes that span both layers in one review.

Keep going