Frontend foundations

The web starts with three kinds of files (HTML / CSS / JS). You set those down firmly, then add React 19 → Next.js 16 → Tailwind 4 one stair at a time.

By the end:

• Write meaningful static HTML pages
• Compose any layout with the box model, Flexbox, and Grid
• Bring pages to life with JavaScript variables, functions, and events
• Think in React 19 components
• Understand the Next.js App Router data flow
• Keep design consistent with Tailwind tokens
• Finish with form validation and loading UX
• Safely upload, validate, transform, and store images
• Work with TypeScript's strict mode, narrowing, generics, and utility types

Flow

[1] Internet ──▶ [2] HTML ──▶ [3] CSS ──▶ [4] JavaScript ──▶ [5] React 19
                                                                  │
                                                                  ▼
[10] TypeScript ◀── [9] Images ◀── [8] Forms·UX ◀── [7] Tailwind ◀── [6] Next.js

Steps 1–4 are the browser standards basics. 5–7 are modern frameworks (React → Next → Tailwind). 8–10 finish with the product-grade polish (forms · media · types).

Prerequisite — getting-started steps 1–5 (Node + pnpm + VS Code).