Next.js is a popular and powerful React JS based framework for building full stack web applications. It provides lot of useful features out of the box such as Server Side Rendering, Code Splitting, Routing, Built in SEO Support and lot more.
Next.js is not an replacement of React. Next.js is an react based framework where react js is a library to build UI components.
Setup using create-next-app
- Run
npx create-next-app@latestcommand. also you can pass --typescript flag for typescript project. - Run
npm run devcommand - Visit
http://localhost:3000to view application.
Folder structure will look like this
Here is a complete list of features Next.js provides.
-
Client and Server Rendering Flexible rendering and caching options, including Incremental Static Regeneration (ISR), on a per-page level. Documentation
-
Nested Routing Layouts and Streaming with an intuitive file-system router, built with React Server Components and Suspense.. Documentation
-
Built-in Optimizations Automatic Image, Font, and Script Optimizations for improved UX and Core Web Vitals.. Documentation
-
API Routes Build API endpoints to securely connect with third party services and be consumed from your frontend. Documentation
-
Middleware Run code before a request completes for features such as authentication, A/B testing, and localization. Documentation
-
CSS Support Support for CSS Modules, Sass, PostCSS, and CSS-in-JS - allowing you to use your preferred styling method. Documentation
Who is using Next JS?
Hulu | Tik Tok | Nike | HBO | Netflix Jobs and many more
So are you interested to try out the Next.js? Stay tuned for future next js blogs.