Next.js
A React framework that adds server-side rendering, static generation, and full-stack capabilities to React applications.
Next.js has become the standard way to build production React applications, adding routing, server-side rendering, and API routes that React alone doesn't provide. It's required or strongly preferred at a large portion of startups and modern product companies building web applications.
Typical time to job-readiness: ~6 weeks.
Learning Next.js
Beginner
Build a Next.js app from scratch — learn file-based routing, the App Router vs Pages Router distinction, and how to fetch data with Server Components or getServerSideProps.
Intermediate
Implement SSR vs SSG vs ISR deliberately based on data requirements, handle API routes, integrate NextAuth for authentication, and deploy to Vercel.
Advanced
Optimize Core Web Vitals, architect multi-zone applications, and understand the React Server Components model deeply. Evaluated on whether you can explain why you chose a rendering strategy, not just that you used one.
Key concepts
- App Router vs Pages Router and the trade-offs of each
- Server Components vs Client Components — what runs where
- Rendering strategies: SSR, SSG, ISR, and CSR and when to use each
- File-based routing and dynamic route segments
- Data fetching patterns (fetch in Server Components, React Query in Client)
- Image, font, and script optimization built into the framework
Common interview topics
- When would you use SSR vs SSG vs ISR for a given page
- Explain React Server Components and how they differ from Client Components
- How does Next.js handle code splitting and lazy loading
- How do you implement authentication in a Next.js application
- What are the Core Web Vitals and how does Next.js help optimize them