If you are reading this, you’re probably a React developer who is deciding between Create React App (CRA) and Next.js for your new project. I have used both extensively in several projects and have come to love Next.js for its simplicity, ease of development and the tons of features it adds on top of React.

Let’s break it down covering the top benefits and caveats to make the decision.

CRA & Next.js

CRA is the official recommended method for most people to kickstart a new React project. It strips away all the hard parts of connecting Webpack or Babel and allows us to dive right into building our app.

Next.js is a React framework from Vercel (previously known as Zeit). It packs powerful features, but the best of them all is Server-Side Rendering.

Top Benefits of Next.js

Server-Side Rendering (SSR)

With SSR, when your application loads on the browser, the server will return the HTML of the page to be rendered. Contrasting this with Client-Side Rendering (CSR), the server return an empty HTML with only the various links to JavaScript files it needs to load.

This means that with SSR, the browser can start to display the HTML while the JavaScript files download parallelly and execute. With CSR, the user is left looking at a blank page longer before the page becomes available and interactive. Hence, SSR can have huge upsides in terms of user experience.

A deeper experiment done by LogRocket, shows the effectiveness of SSR in terms of speed and Lighthouse scores.

Free hosting on Vercel

As a developer, I have a huge number of side projects and what’s better than being able to host them for free? Vercel offers free hosting of Next.js projects where you can even create API-based applications with serverless functions.

I have hosted 3 applications on Vercel so far with great uptime and continuous deployment by connecting with GitHub. The platform is just amazing to host Next.js apps.

#redux #javascript #react #nextjs