I love when articles and websites have a short version that goes straight to the point on top but also has some more nuances added throughout the article so I will be using that method of writing here.
TLDR;
I love it so much because of these features:
- ServerSideRendering (SSR)
- Next JS image optimization function
- Vercel CI / CD integrations with GitHub.
- React & Typescript compatibility
- API routes
Intro
For those that don't know NextJS is a React-based framework that adds some nice features to make the React developer’s quality of life better. I will let NextJS website do the heaving lifting here "Next.js gives you the best developer experience with all the features you need for production: hybrid static & server rendering, TypeScript support, smart bundling, route pre-fetching, and more. No config needed.”
ServerSideRendering(SSR)
I started using it mostly because of the ServerSideRendering of static sites. It provides better readability for bots as the HTML shown on the client browser is fully readable and not a bunch of javascript HTML characters that are impossible to understand. Also using this function ServerSideRendering will make your website load faster because the end-user is receiving plain HTML and not a lot of Javascript, JSX, or any other abstraction that needs to be converted back to HTML on the browser.
NextJS Image optimization
NextJS Image optimization function is great if your site has a lot of photographs, as ServerSideRendering this function helps on the load time of the website. With this function, my gallery website ( https://gallery.ronnycoste.com ) achieved these results!
Vercel CI / CD
Vercel CI / CD integrations with GitHub are amazing! I have used Heroku, and Netlify and they do not do as many checks automatically as Vercel for free, in those other platforms usually you will have to become a paid user to be able to have access to this. The response time also is pretty bad mainly on Heroku if you use the free service. So while the CI / CD is not unique to Vercel and Next the experience is of the best.
React & Typescript support
React & typescript compatibility does not need any more explanations other than it works with typescript and react. All the packages available for those two will also work in next.
API Routes
API routes on NextJS are pretty easy to implement as the framework creates some api endpoints that are easy to use and maintain.
So yeah I love NextJS… it has simplify a lot of my decision making and added a lot of structure to the way i build websites.