Next.js

Next.js is a React framework for building full-stack web applications.


Next.js features

  • Routing - A file-system based router built on top of Server Components that supports layouts, nested routing, loading states, error handling, and more.

  • Rendering - Client-side and Server-side Rendering with Client and Server Components. Further optimized with Static and Dynamic Rendering on the server with Next.js. Streaming on Edge and Node.js runtimes.

  • Data Fetching - Simplified data fetching with async/await in Server Components, and an extended fetch API for request memoization, data caching and revalidation.

  • Optimizations - Optimization of images, fonts, and scripts

  • Styling - Support for many style approaches, such as CSS Modules, Tailwind CSS, and CSS-in-JS

  • TypeScript - Improved TypeScript support, including improved type checking and faster compilation.

App Router vs Pages Router

App Router is introduced in Next.js 13, fully stable since Next.js 14, it's the modern way to build apps with support for React Server Components, Streaming, Layouts, and Server Actions.

Pages Router is the original routing system in Next.js, used in versions before 13.