About NEXT.js
What is Next.js?
It is a React framework that has additional features such as server-side rendering (SSR) and it performs static-site generation. It has the benefits of react and also consists of additional features.
What is Server Side Rendering(SSR)
SSR enables the server to access all necessary data and process the JavaScript to render the page. The page is then returned to the browser in its full and it is rendered immediately. It loads web pages quickly and improves user experience along with its responsiveness. It also useful for improving the SEO ranking of the website as it can load faster and helps in scanning more of the site content for SEO trackers.
Features
- It has a page-based routing system which with also supports dynamic routes
- Pre-rendering both SSG and SSR are supported on a per-page basis
- It automatically splits the code for faster page loads
- It has Client-side routing along with optimized prefetching
- It has built-in CSS and Sass support, and also supports any CSS-in-JS library
- It has a development environment with Fast Refresh support.
- It uses API routes to build API endpoints with Serverless Functions
- It is also fully extendable
When Should we use Next.js
- Next.js is suitable for making optimized pages that rely on organic search traffic.
- It is mostly used for websites rather than web applications because SSR allows it to perform the same way regardless of the device the client is using.
- It is not that great for building secure applications which require authentication as it is not good for server-side rendering.
Pros and cons of Next.js
Pros:
- It is faster than react due to SSR.
- It has features for exporting static sites.
- It is easier to learn for those who know react
- It supports page routing, CSS,TypeScript and JSX,
- We can quickly add plugins to customize Next.js to your specific page’s requirements.
- It also has all the benefits of react and additional features
Con:
- It is an opinionated framework, so it has a specific method and toolset with which it can construct your apps.
Where to learn NEXT.js :
- Next.js docs
- Youtube tutorials such as: