Project instellen en CLI
Leer hoe u een nieuw Next.js 15-project initialiseert en de basisstructuur van het project verkent met de opdrachtregelinterface.
Project instellen en CLI is een gratis Fullstackontwikkeling met Next.js 15 (App Router + Server Actions)-les op CoddyKit. Dit is les 1 van 4. Je kunt de volledige les hieronder gratis lezen en daarna in de browser praktisch oefenen met een ingebouwde code-editor en een AI-begeleider die 24/7 beschikbaar is. Deze les maakt deel uit van het leertraject Fullstackontwikkeling met Next.js 15 (App Router + Server Actions). Je voortgang wordt gesynchroniseerd op het web en in de CoddyKit-app. De cursus Fullstackontwikkeling met Next.js 15 (App Router + Server Actions) bevat in totaal 4 lessen.
Next.js 15: je eerste stap
Welkom bij Next.js 15 — het React-framework voor snelle, schaalbare apps die klaar zijn voor productie. Eerst zetten we een project op en bekijken we de structuur ervan via de opdrachtregel.
Wat je nodig hebt
Voordat je begint, heb je Node.js 18.17 of hoger nodig — dit biedt de JavaScript-runtime en de bijbehorende pakketbeheerder (npm, Yarn of pnpm) installeert je afhankelijkheden.
Je project initialiseren
Zet een nieuw project op met create-next-app — hiermee wordt alles voor je klaargezet. Voer dit uit in je terminal.
npx create-next-app@latestUitleg over de installatievragen
De opdrachtregel stelt een paar vragen. De belangrijkste: antwoord Yes bij App Router — dit is essentieel voor Next.js 15. ESLint en Tailwind zijn handig; TypeScript is optioneel.
Je nieuwe project verkennen
Wanneer het proces is voltooid, krijg je een nieuwe projectmap. Ga erin met cd en je kunt meteen aan de slag.
cd my-next-appDe structuur van je project
Leer de belangrijkste gegenereerde bestanden kennen: app/ bevat je pagina's en indelingen, public/ statische middelen, package.json je afhankelijkheden en scripts, en next.config.js de configuratie.
De centrale map `app`
De map app/ vormt de basis van App Router: layout.js voor gedeelde gebruikersinterface, page.js voor de unieke weergave van een route en globals.css voor algemene stijlen.
Projectscripts en `npm run dev`
Je scripts staan in package.json. Het script dat je voortdurend gebruikt, is npm run dev — hiermee start je de ontwikkelserver.
npm run devHallo Next.js!
Open localhost:3000 terwijl de ontwikkelserver actief is om je app te bekijken. Die pagina wordt weergegeven door app/page.js — hieronder zie je een vereenvoudigde versie.
export default function Home() {
return (
<main>
<h1>Hello CoddyKit!</h1>
</main>
);
}Snelle controle: de basis van de installatie
Je hebt geleerd hoe je een Next.js-project start. Test je kennis!
Samenvatting: je eerste stappen met Next.js
Samenvatting: je hebt Next.js 15 ingesteld met create-next-app, de map app/ verkend en de ontwikkelserver gestart. Volgende onderwerp: routering op basis van het bestandssysteem.
Leer TypeScript met een AI-tutor — gratis
Schrijf echte code en voer die uit in je browser, krijg direct hulp van een AI-tutor die 24/7 beschikbaar is en ga verder waar je gebleven bent op het web of in de app.
- Cursussen
- 22
- Lessen
- 88
Veelgestelde vragen
Is de les “Project instellen en CLI” gratis?
Ja — de volledige tekst van “Project instellen en CLI” kun je hier gratis op het web lezen. Als je interactief wilt oefenen met een ingebouwde code-editor en een AI-begeleider die 24/7 beschikbaar is, en de rest van de cursus Fullstackontwikkeling met Next.js 15 (App Router + Server Actions) wilt ontgrendelen, kun je upgraden naar CoddyKit PRO. De cursus Fullstackontwikkeling met Next.js 15 (App Router + Server Actions) bevat in totaal 4 lessen.
Wat leer ik in “Project instellen en CLI”?
Leer hoe u een nieuw Next.js 15-project initialiseert en de basisstructuur van het project verkent met de opdrachtregelinterface. Je oefent met Fullstackontwikkeling met Next.js 15 (App Router + Server Actions) door code rechtstreeks in de browser uit te voeren. Een AI-begeleider die 24/7 beschikbaar is beantwoordt je vragen terwijl je de les doorwerkt.
Heb ik ervaring nodig om met Fullstackontwikkeling met Next.js 15 (App Router + Server Actions) te beginnen?
Ervaring vooraf is niet nodig. Fullstackontwikkeling met Next.js 15 (App Router + Server Actions) op CoddyKit is opgebouwd voor beginners tot gevorderden, zodat je hier of bij het begin kunt starten en in je eigen tempo kunt leren. Dit is les 1 van 4.
Hoe lang duurt de les “Project instellen en CLI”?
De meeste lessen van CoddyKit duren ongeveer 5–10 minuten. Elke les is kort en interactief, zodat je gestaag vooruitgaat en op het web en in de app precies verdergaat waar je was gebleven.
Kan ik code schrijven en uitvoeren in deze les over Fullstackontwikkeling met Next.js 15 (App Router + Server Actions)?
Ja. Elke les over Fullstackontwikkeling met Next.js 15 (App Router + Server Actions) bevat een ingebouwde code-editor, zodat je rechtstreeks in je browser echte code kunt schrijven en uitvoeren en direct feedback van AI krijgt — lokale installatie is niet nodig.
Alle lessen in deze cursus
- Project instellen en CLI
- Basisprincipes van file-system routing
- Overzicht van pagina's en layouts
- Uw Next.js-app stylen