Why NextJS over ReactJS?

Ankit RattanAnkit Rattan
3 min read

See, you are making beautiful websites with React, no problem. But sometimes, little, little troubles come, no? Like:

Google Search Problem: Your website looks very nice, but when someone searches on Google, it's not showing up properly. Like your shop is beautiful, but nobody knows where it is.
Slow Start Problem: When someone opens your website first time, it takes some time to load, no? Like waiting for the chai to boil. People don't have patience nowadays!
Backend Headache: For small, small things, you need a separate backend guy, or you do extra work. Like you need a separate kitchen for making just one omelette.
Deploying Tension: Putting your website live, it's a big headache, lots of settings, no? Like preparing for a big wedding, so many things to manage.
If you are saying "Haan bhai, this is my problem!", then Next.js is your hero, ready to save the day! See how it works:

  1. Google loves Next.js: Server-Side Rendering (SSR) ka Kamaal! This is the biggest magic of Next.js. Normally, your React app makes everything on the user's computer. But Next.js, it makes the webpage ready on the server itself, then sends it to the user.

Why this is good?

Google sees everything: Google's robots can properly read your website, so your website comes up higher in search. More customers for your shop!
Fast, Fast Opening: Website opens very quickly, no waiting time. User happy, you happy!
Good for all mobiles: Even old phones, cheap phones, they open your website fast because less work for them.
It's like sending a fully cooked biryani instead of sending all the ingredients and telling the user to cook it!

  1. Smooth, Smooth Navigation: Chale Jaao Kahin Bhi!
    First time, Next.js gives you fast page. Then, when you click on other links on your website, it's super fast, like flying. You get the best of both worlds, fast start and fast movement inside the app.

  2. API Routes: Your Backend Inside Frontend!
    Small, small backend work? Like saving data, getting user info? You don't need a separate backend server. Next.js lets you make small API things right inside your project. Very easy, very convenient! Like having a small stove right in your bedroom for midnight snacks!

  3. Data Fetching: Apna Data, Apna Tareeka!
    Next.js gives you good, good ways to get your data. You can get data when the page is being built, or when someone asks for it. You have full control, no tension. No more messy useEffect to fetch data!

  4. Routing: No Tension, Just Folders!
    You want a new page? Just make a new file in the pages folder, and it becomes a page! No big, big settings for routing. It's so easy, like arranging your clothes in different drawers.

  5. Ready for Big Projects: All Goodies Inside!
    Next.js comes with many smart things built-in. Like it makes your code smaller, optimizes pictures automatically. It helps your website run super smooth without you doing extra work.

  6. Big Family, Big Support: You Are Not Alone!
    Next.js has a very big community, many developers using it. If you have any problem, you can ask, and many people will help you.

Is it Difficult to Change? No!
Changing from React to Next.js is not like demolishing your old house and building a new one. You can slowly, slowly make changes. Your React knowledge is still useful, it's the base. Next.js is like adding more floors to your building, making it bigger and stronger!

2
Subscribe to my newsletter

Read articles from Ankit Rattan directly inside your inbox. Subscribe to the newsletter, and don't miss out.

Written by

Ankit Rattan
Ankit Rattan

Coder By Profession, Creator By Mind! NIT Delhi