You are currently viewing Introduction to Next.js | Why should we Learn it?

Introduction to Next.js | Why should we Learn it?

What is next.js Used for

In this article, we will see about what is next.js and why it is used for.

What is next?

The docx define next JS as the react framework for production.

The React framework for production

React

If you think about building application with react. You know that it’s not quite possible to build a full feature rich application ready to be deployed for production. React is a library for building user interfaces. It is responsible for only the view layer of an application. You have to make decisions on other features of the app like routing, styling, authentication etc.

Next.js

It is a react framework. So, it is a package that uses react for building user-interfaces but it also comes loaded with a lot more features that enable you to build full fledged production ready application. Features exactly like routing, styling, authentication, bundle optimization, etc. There’s no need to install additional packages. Next.js provides everything for you. Opinions and conventions need to be followed to implement the said features. However, we don’t have to worry much about that as there are conventions that have emerged from a team with years of experience writing react appls for production.

So, to reiterate next.JS is a framework for building production ready application.

Why learn Next?

Next.js simplifies the process of building a react application for prodcution. Let me list down some of the noteworthy feature you would probably want in a react application. which next.js provides out of the box.

  1. File based routing: When builing a react app you need to install a third-party routing package, configure it and add code every time you need to create a route. Next JS provides file based routing to simply this task.
  2. pre- rendering : Which means that nextjs generate HTML for each page in advance instead of having it all done by cliend-side JavaScript. Pre-rendering can result in better performance and SEO which something we all want.
  3. ¬†API routes: You can create API’s with Next.js. So, next.js is really full stack framework. You can write the front-end code in react but also write API’s that can be called by the react app.
  4. Support for CSS modules: Next also support CSS modules, which saves you the time of choosing CSS library because you are allowed to use the CSS framework like tailwind or even a CSS in JS library like style component. But next js supports CSS modules out of the box.

Leave a Reply