Next.js & React
Client-Side Rendering (CSR)
What It Is
Generating HTML in the browser after the page loads
Analogy
Cooking the meal at the table — the diner waits while you prepare
Try It Out
SSR vs CSR
Server-Side (SSR)
1Server renders HTML
2Send complete page
3Fast initial load
Client-Side (CSR)
1Send empty shell
2JavaScript loads
3Browser renders
Related Terms in Next.js & React
Framework
A food truck that comes with the kitchen already set up — you just add your recipes
Component
LEGO blocks — each one is self-contained, and you combine them to build something bigger
Props
Instructions given when you delegate a task — "here's what you need to know"
State
The current mood of your restaurant — busy, slow, sold out — and the sign you flip accordingly