Next.js vs Node.js: hoe ze samenhangen

Next.js vs Node.js: framework tegenover runtime, uitgelegd | We.Inc

Node.js draait JavaScript buiten de browser; Next.js is een React-framework dat daarbovenop draait. Bekijk de stack laag voor laag, één endpoint in beide en wanneer u welke gebruikt.

Node.js is een runtime: het programma dat JavaScript uitvoert op een server of uw laptop. Next.js is een React-framework voor het bouwen van websites, en de buildtools en server ervan draaien op Node.js. De keuze is dus zelden het een of het ander. Elke Next.js-app heeft Node.js eronder nodig, terwijl een Node.js-app niets met Next.js te maken hoeft te hebben.

Runtime tegenover framework

Vraag

Wat het is
JavaScript-runtime
React-framework

U installeert het als
Een programma op de machine
Een npm-pakket in een project

Bouwt webpagina's?
Alleen als u die code schrijft
Ja, met routing en rendering ingebouwd

Verwerkt HTTP?
Met node:http of een library zoals Express
Pagina's plus Route Handlers

Afhankelijk van de ander?
Nee
Ja, minimaal Node.js 20.9

Starten in productie
next build, daarna next start

De snelste manier om de relatie te zien is kijken naar de lagen waar een verzoek doorheen gaat. Klik hieronder op elke laag van een typische Next.js-app om te zien wat die doet en wie ervoor verantwoordelijk is.

Klik op een laag, van de browser bovenaan tot het besturingssysteem onderaan.
Lees wat die laag in een Next.js-app doet.
Vergelijk verderop de voorbeelden van de kale Node.js-server en de Next.js Route Handler.
Gebruik de beslisrijen in de tabel om te kiezen wat uw project nodig heeft.

Controleer node --version voordat u Next.js installeert. De huidige documentatie noemt Node.js 20.9 als minimum.
Gebruik op servers een long-term support-release van Node.js en zet lokaal en in productie dezelfde hoofdversie vast.
Als uw project alleen een API zonder webpagina's levert, is een kale Node.js-server of een backendframework lichter dan Next.js.
Een statische export van een Next.js-site heeft Node.js alleen tijdens de build nodig. De uitvoer bestaat uit gewone bestanden die elke webserver kan hosten, ten koste van functies die alleen op de server werken.

Veelgestelde vragen

Is Next.js een backend of een frontend?

Allebei, binnen grenzen. Het rendert React-pagina's op de server, stuurt interactieve delen naar de browser en laat u Route Handlers schrijven voor JSON-endpoints. Het is niet bedoeld als volledige backend voor veel andere clients.

Moet ik Node.js leren voor Next.js?

U hebt Node.js geïnstalleerd nodig en enig gevoel voor npm en de terminal. Diepe kennis van de node:http-module is niet nodig, want Next.js regelt de server voor u.

Heeft Next.js nog een Edge Runtime?

De runtime-optie voor routes noemt nu 'nodejs' als standaard en 'edge' als verouderd. De documentatie vraagt u de runtime-export uit routebestanden te verwijderen, dus nieuwe code moet van Node.js uitgaan.

Kan ik Next.js draaien met Bun of Deno?

De deploymentdocumentatie van Next.js noemt Bun als geverifieerde adapter en Deno Deploy bij andere platforms met een eigen integratie. Buiten de Node.js-server verschilt de ondersteuning per functie, dus lees de notities van het platform.

Is Express hetzelfde soort ding als Next.js?

Meer dan Node.js, omdat beide libraries bovenop Node.js zijn. Express is een minimale toolkit voor HTTP-servers; Next.js is een volledig websiteframework rond React.

Node.js in één alinea

De Node.js-site noemt het een asynchrone, event-driven JavaScript-runtime, ontworpen om schaalbare netwerkapplicaties te bouwen. In de praktijk laat het JavaScript bestanden lezen, netwerkpoorten openen en met databases praten, wat een browser niet toestaat.

Wat Next.js daarbovenop toevoegt

Next.js maakt van een map React-componenten een site: routes op basis van bestanden, server rendering, data ophalen, afbeeldingen en lettertypen verwerken, en een productieserver. Als u next start uitvoert, is die server een Node.js-proces, en volgens de documentatie ondersteunt deze deployment elke functie van Next.js.
Tijdens de ontwikkeling geldt hetzelfde voor next dev, en next build draait op Node.js om pagina's te compileren en vooraf te renderen.

Kiezen voor een project

Bouwt u een website of webapp met React? Gebruik Next.js en accepteer Node.js als onderdeel van de setup. Bouwt u een commandlinetool, een worker die een wachtrij verwerkt of een pure API? Schrijf het direct voor Node.js of met een backendframework en sla Next.js helemaal over.

Kale Node.js-server

Gebruikt alleen de ingebouwde node:http-module. U bepaalt zelf de poort, de headers en de routing. Start het met node server.mjs.

Next.js Route Handler

Het bestandspad wordt /api/hello en Next.js draait de server. Onbekende paden krijgen automatisch de 404-pagina van het framework.

Waar Node.js draait in een Next.js-project

Scripts in package.json

Elk script start een Node.js-proces: de ontwikkelserver, de productiebuild en de productieserver.

Browser

De bezoeker

Ontvangt HTML die Next.js op de server heeft gerenderd en laadt daarna alleen JavaScript voor Client Components, zodat knoppen en formulieren werken.

Uw app-code

Pagina's, layouts en Route Handlers in de app-map. Dit is React plus een paar Next.js-conventies, geschreven in JavaScript of TypeScript.

Het framework

Koppelt mappen aan URL's, rendert Server Components, bundelt clientcode en draait de productieserver die next start opstart.

De runtime

Voert al het JavaScript hierboven uit op de server: de build, de ontwikkelserver en elk verzoek in productie.

Besturingssysteem

Uw host

macOS, Windows, Linux of een container. Next.js noemt macOS, Windows inclusief WSL, en Linux als ondersteund voor ontwikkeling.

De lagen van een Next.js-app

Kies een laag

Verantwoordelijk: {v}

Laag {n} van {v}, van boven naar beneden

Gratis beginnen · Geen creditcard nodig

Gerelateerd: Gidsen

Product

Voor wie

Functies

Bronnen

Bedrijf

Sitemap