I did some research and I stumbled upon this:
https://www.section.io/engineering-education/node-versus-next-react-approach/
Next.js is a react server side framework, which some advantages. But its main selling point is that it renders react server side.
What I do not understand is that: cant we already do this with node? i believe react allows a to string method to convert react to an HTML/js file?
https://reactjs.org/docs/react-dom-server.html
(and I know we can also use the rehydration method for combined server-client experience)
Also like, isnt next.js based off node ie just a node framework?
I guess I am trying to understand why i would want to learn next.js.
Thanks :)
next.js - What's the difference between "next start" and "node server.js"? - Stack Overflow
Next.js vs Express.js
Using Node JS backend for Next JS
React + nodejs or Nextjs
Videos
Maybe it's because answers are outdated, but they didn't help me.
Basically Next.js documentation explains that. And the explanation is hidden on a build level.
next build (without standalone flag) will automatically trace each page and its dependencies to determine all of the files that are needed for deploying a production version of your application. And to start that version you need next start. That version cannot be start with node server.js.
While next build with standalone flag Next.js will automatically create a standalone folder and copy only the necessary files for a production deployment including select files in node_modules. That version should be started with node server.js.
UPDATED
I think you're trying to build custom server (https://nextjs.org/docs/advanced-features/custom-server)
According to that document, they mention this part which may be related to what you're looking for
Before deciding to use a custom server, please keep in mind that it should only be used when the integrated router of Next.js can't meet your app requirements. A custom server will remove important performance optimizations, like serverless functions and Automatic Static Optimization.
OLD ANSWER
next start usually goes along with next build (https://nextjs.org/docs/api-reference/cli#production) and it has its own custom configs under next.config with a ton of good stuff like file compression, routings, image optimization, etc. (under the hood, it also uses Webpack and Babel for builds)
node server.js is just simply to run a server and does nothing else. Therefore, if you want to have better builds like NextJS. You need to add libraries into NodeJS.
You can find some useful libraries here.
https://blog.bitsrc.io/23-insanely-useful-nodejs-libraries-you-should-know-in-2020-5a9b570d5416
Express.js vs Next.js: What is the difference?
A little bit about each framework:
1) What is Express.js?
Express.js, or simply Express, is a backend web development framework for Node.js. It is intended for the development of web applications and APIs. Itโs been dubbed Node.jsโ de facto standard server framework.
This answer explains what Express is in greater detail.
2) What is Next.js?
Next.js is the React framework for production.
Let's debunk this sentence:
- "Framework": It has a lot of built-in features (e.g file-routing which replaces
react-router-dom) that help you solve common problems. - "For React": Next.js just enhances your React apps and adds more features to them.
- "For Production": There are certain problems that you will need to solve for almost all production-ready React apps. Next.js solves those for you.
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 is needed.
Express.js vs Next.js features
Some Express.js features are:
- Robust routing
- HTTP helpers (redirection, caching, etc)
- View system supporting 14+ template engines
Next.js provides the following key features:
- Zero setup. Use the filesystem as an API ( You do not need Express to build a full-stack application)
- Server-Side rendering (SSR)
- Static site generation (SSG)
- Single-Page application (SPA)
- Development of faster applications
- Optimization of pages
- SEO websites
- Automatic code splitting
Conclusion
Express.js is a backend framework for building APIs whereas Next.js is a full stack framework that builds upon React to improve the SEO, development experience, and performance of your project. One of these features IS a built-in API routing system that could replace Express.js.
It all depends on the case you have and your personal preference. If you are building a private page (admin panel that can only be accessed with authentication) that does not need to be found by search engines, you do not need Next.js and will need Express.js. If you are building a public website (e.g. e-commerce website) and you are using Next.js for SEO optimization, you could replace Express.js with it.
TL;DR
You can replace an Express API with Next.js's API routing system but that only makes sense if you're building a full-stack React project. If it's a standalone API, using Next.js to replace just that API doesn't make any sense.
Express is a general purpose tool for building HTTP servers in Node.js.
Next.JS is a tool for building an HTTP server specifically to perform server-side rendering of a React application (and which comes with some general purpose features so you can do things like build a server-side API for that React application to access in the same package).