Next.js 15 fullstack (App Router + Server Actions) · Lektion

Projektkonfiguration och CLI

Lär dig initiera ett nytt Next.js 15-projekt och navigera i den grundläggande projektstrukturen med kommandoradsgränssnittet

Lektion 1 av 411 steg

Projektkonfiguration och CLI är en gratis lektion i Next.js 15 fullstack (App Router + Server Actions) på CoddyKit. Detta är lektion 1 av 4. Ni kan läsa hela lektionen gratis nedan och sedan öva praktiskt i webbläsaren med en inbyggd kodredigerare och en AI-handledare som är tillgänglig dygnet runt. Den ingår i lärvägen för Next.js 15 fullstack (App Router + Server Actions), och Era framsteg synkroniseras mellan webben och CoddyKit-appen. Kursen i Next.js 15 fullstack (App Router + Server Actions) innehåller totalt 4 lektioner.

Next.js 15: Ditt första steg

Välkommen till Next.js 15 — React-ramverket för snabba, skalbara och produktionsklara appar. Först ska vi starta ett projekt och läsa dess struktur från CLI:t.

Det här behöver du

Innan du börjar behöver du Node.js 18.17 eller senare — det tillhandahåller JavaScript-körmiljön, och dess pakethanterare (npm, Yarn eller pnpm) installerar dina beroenden.

Initiera ditt projekt

Starta ett nytt projekt med create-next-app — det skapar hela grundstrukturen åt dig. Kör bara detta i terminalen.

npx create-next-app@latest

Förklaring av konfigurationsfrågorna

CLI:t ställer några frågor. Den viktigaste är: svara Yes to App Router — det är nödvändigt för Next.js 15. ESLint och Tailwind är bra att ha, medan TypeScript är valfritt.

Navigera i ditt nya projekt

När processen är klar får du en ny projektmapp. Gå in i den med cd, så är du redo att börja arbeta.

cd my-next-app

Projektets struktur

Lär dig känna igen de viktigaste genererade filerna: app/ innehåller dina sidor och layouter, public/ statiska resurser, package.json dina beroenden och skript, och next.config.js konfigurationen.

Den centrala `app`-mappen

Mappen app/ styr App Router: layout.js för gemensamt gränssnitt, page.js för en routings unika vy och globals.css för globala stilar.

Projektskript och `npm run dev`

Dina skript finns i package.json. Det du kommer att använda hela tiden är npm run dev — det startar utvecklingsservern.

npm run dev

Hej Next.js!

När utvecklingsservern körs öppnar du localhost:3000 för att se din app. Sidan renderas av app/page.js — här är en förenklad version.

export default function Home() {
  return (
    <main>
      <h1>Hello CoddyKit!</h1>
    </main>
  );
}

Snabbtest: grunderna i konfiguration

Du har lärt dig att starta ett Next.js-projekt. Nu testar vi dina kunskaper!

Besvara frågan i den interaktiva lektionen

Sammanfattning: dina första steg i Next.js

Sammanfattning: du konfigurerade Next.js 15 med create-next-app, utforskade mappen app/ och startade utvecklingsservern. Nästa steg är filsystemsbaserad routing.

Gratis att börja

Lär dig TypeScript med en AI-lärare – gratis

Skriv och kör riktig kod i webbläsaren, få omedelbar hjälp av en AI-lärare dygnet runt och fortsätt där du slutade – på webben eller i appen.

Kurser: 22
Lektioner: 88

Börja lära dig gratis Visa hela kursen

Vanliga frågor

Är lektionen ”Projektkonfiguration och CLI” gratis?

Ja – hela texten till ”Projektkonfiguration och CLI” kan läsas gratis här på webben. Om Ni vill öva interaktivt med en inbyggd kodredigerare och en AI-handledare som är tillgänglig dygnet runt och låsa upp resten av kursen i Next.js 15 fullstack (App Router + Server Actions), kan Ni uppgradera till CoddyKit PRO. Kursen i Next.js 15 fullstack (App Router + Server Actions) innehåller totalt 4 lektioner.

Vad lär jag mig i ”Projektkonfiguration och CLI”?

Lär dig initiera ett nytt Next.js 15-projekt och navigera i den grundläggande projektstrukturen med kommandoradsgränssnittet Ni övar på Next.js 15 fullstack (App Router + Server Actions) med praktisk kod som körs direkt i webbläsaren, medan en AI-handledare som är tillgänglig dygnet runt svarar på Era frågor under lektionen.

Behöver jag någon erfarenhet för att börja lära mig Next.js 15 fullstack (App Router + Server Actions)?

Du behöver inga förkunskaper. Utbildningen i Next.js 15 fullstack (App Router + Server Actions) på CoddyKit är upplagd för allt från nybörjare till avancerade elever, så att du kan börja här eller från början och gå fram i din egen takt. Detta är lektion 1 av 4.

Hur lång tid tar lektionen ”Projektkonfiguration och CLI”?

De flesta CoddyKit-lektioner tar cirka 5–10 minuter. Varje lektion är kort och interaktiv, så att du gör stadiga framsteg och kan fortsätta precis där du slutade – på webben eller i appen.

Kan jag skriva och köra kod i den här Next.js 15 fullstack (App Router + Server Actions)-lektionen?

Ja. Varje Next.js 15 fullstack (App Router + Server Actions)-lektion innehåller en inbyggd kodredigerare, så att du kan skriva och köra riktig kod direkt i webbläsaren och få omedelbar AI-feedback – utan lokal installation.

Alla lektioner i den här kursen

← Tillbaka till Next.js 15 fullstack (App Router + Server Actions)