It is no secret that software development means constant learning. New languages and frameworks come out frequently. And you are required to learn to keep up to date continuously. Recently, I finally decided to pick up the NextJS. It is a newer framework that is gaining much popularity, and I can see why. After almost ten years as a software developer, focusing mostly on UI, it is a framework that impresses me from the start. It impresses me like mixins did before we had modern frameworks and like React did when released. Bellow, you can find the list of all the useful features you get out of the box when you use NextJS. Features that you should consider when choosing technology for your next project.
1. Easily creating project
Just like creating a ReactJS project, it is easy to create a NextJS project. For it, you can use create-next-app with npx. Use the following command to create a project.
npx create-next-app PROJECT_NAME --use-npm --example https://github.com/vercel/next-learn-starter/tree/master/learn-starter
2. It supports CSS and PostCSS, and SASS with minimal setup
CSS and PostCSS are available out of the box. And with just installing one dependency, you can use SASS also.
3. It supports CSS modules
CSS modules enable scoped CSS, which gives better-organized code and reduces bugs in it.
4. Routes structuring
NextJS gives clear guidelines on structuring. All page components need to be in a folder with name pages, and NextJS builds a router according to its content. That means if you have a component named Post.js in a folder /pages/blog, this component is available in the route /blog/post.
5. Prerendering
ReactJS does support server rendering, but it far from easy to implement. NextJS enables two types of pre-rendering. Static pre-rendering executed during the build and server-side, which runs on every request. This both improves your website performance and is SEO friendly.
6. Provides SWR hook
NextJS comes with an SWR hook that you can use to make the request. It provides you with many useful features like caching, focus-tracking, and fetching on the interval.
7. API server
If you have API code, you can place it into pages/api folder. Routes work like page components, and you can have all your code in one project.
8. Ease deployment
Vercel maintains NextJS, and they provide you easy integration with GitHub to deploy your application on their platform.
There are many other useful features in NextJS, but these are, in my opinion, the most useful ones. Just prerendering should give you enough of a reason to consider it for the next project.
For more, you can follow me on Twitter, LinkedIn, GitHub, or Instagram.