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

Prosjektoppsett og CLI

Lær hvordan du initialiserer et nytt Next.js 15-prosjekt og navigerer i den grunnleggende prosjektstrukturen ved hjelp av kommandolinjegrensesnittet.

Leksjon 1 av 411 trinn

Prosjektoppsett og CLI er en gratis leksjon i Next.js 15 fullstack (App Router + Server Actions) på CoddyKit. Dette er leksjon 1 av 4. Du kan lese hele leksjonen gratis nedenfor – og deretter øve praktisk i nettleseren med en innebygd kodeeditor og en AI-veileder som er tilgjengelig døgnet rundt. Den er en del av læringsløpet i Next.js 15 fullstack (App Router + Server Actions), og fremdriften din synkroniseres mellom nettet og CoddyKit-appen. Kurset i Next.js 15 fullstack (App Router + Server Actions) inneholder totalt 4 leksjoner.

Next.js 15: Ditt første steg

Velkommen til Next.js 15 – React-rammeverket for raske, skalerbare og produksjonsklare apper. Først skal De opprette et prosjekt og lese strukturen fra CLI-en.

Dette trenger De

Før De begynner, trenger De Node.js 18.17 eller nyere – det tilbyr JavaScript-kjøremiljøet, og pakkebehandleren (npm, Yarn eller pnpm) installerer avhengighetene Deres.

Initialisere prosjektet

Opprett et nytt prosjekt med create-next-app – det setter opp alt for Dem. Kjør bare dette i terminalen.

npx create-next-app@latest

Forklaring av oppsettsvalgene

CLI-en stiller noen spørsmål. Det viktigste er å svare Yes to App Router – dette er nødvendig for Next.js 15. ESLint og Tailwind er nyttige, mens TypeScript er valgfritt.

Navigere i det nye prosjektet

Når oppsettet er ferdig, får De en ny prosjektmappe. Gå inn i den med cd, så er De klar til å begynne.

cd my-next-app

Prosjektstrukturen

Gjør Dem kjent med de viktigste genererte filene: app/ inneholder sidene og layoutene Deres, public/ statiske ressurser, package.json avhengighetene og skriptene Deres, og next.config.js konfigurasjonen.

Den sentrale `app`-mappen

app/-mappen styrer App Router: layout.js for delt brukergrensesnitt, page.js for den unike visningen til en rute, og globals.css for globale stiler.

Prosjektskript og `npm run dev`

Skriptene Deres ligger i package.json. Det De kommer til å bruke mest, er npm run dev – det starter utviklingsserveren.

npm run dev

Hei, Next.js!

Når utviklingsserveren kjører, åpner De localhost:3000 for å se appen. Siden gjengis av app/page.js – her er en forenklet versjon.

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

Rask sjekk: Grunnleggende oppsett

De har lært hvordan De kommer i gang med et Next.js-prosjekt. La oss teste kunnskapene Deres!

Oppsummering: De første stegene med Next.js

Oppsummering: De satte opp Next.js 15 med create-next-app, utforsket app/-mappen og startet utviklingsserveren. Neste tema er filsystembasert ruting.

Gratis å komme i gang

Lær deg TypeScript med en AI-veileder – gratis

Skriv og kjør ekte kode i nettleseren, få umiddelbar hjelp fra en AI-veileder som er tilgjengelig døgnet rundt, og fortsett der du slapp – på nettet eller i appen.

Kurs
22
Leksjoner
88

Ofte stilte spørsmål

Er leksjonen «Prosjektoppsett og CLI» gratis?

Ja – hele teksten i «Prosjektoppsett og CLI» er gratis å lese her på nettet. For å øve interaktivt med en innebygd kodeeditor og en AI-veileder som er tilgjengelig døgnet rundt, og for å låse opp resten av Next.js 15 fullstack (App Router + Server Actions)-kurset, kan du oppgradere til CoddyKit PRO. Kurset i Next.js 15 fullstack (App Router + Server Actions) inneholder totalt 4 leksjoner.

Hva lærer jeg i «Prosjektoppsett og CLI»?

Lær hvordan du initialiserer et nytt Next.js 15-prosjekt og navigerer i den grunnleggende prosjektstrukturen ved hjelp av kommandolinjegrensesnittet. Du øver på Next.js 15 fullstack (App Router + Server Actions) med praktisk kode som du kjører direkte i nettleseren, mens en AI-veileder som er tilgjengelig døgnet rundt, svarer på spørsmålene dine mens du jobber deg gjennom leksjonen.

Trenger jeg erfaring for å begynne med Next.js 15 fullstack (App Router + Server Actions)?

Ingen tidligere erfaring er nødvendig. Next.js 15 fullstack (App Router + Server Actions) på CoddyKit er lagt opp for både nybegynnere og viderekomne, så De kan begynne her eller helt fra start og lære i Deres eget tempo. Dette er leksjon 1 av 4.

Hvor lang tid tar leksjonen «Prosjektoppsett og CLI»?

De fleste CoddyKit-leksjoner tar omtrent 5–10 minutter. Hver leksjon er kort og interaktiv, slik at De gjør jevne fremskritt og kan fortsette akkurat der De slapp – både på nettet og i appen.

Kan jeg skrive og kjøre kode i denne Next.js 15 fullstack (App Router + Server Actions)-leksjonen?

Ja. Alle Next.js 15 fullstack (App Router + Server Actions)-leksjoner har en innebygd kodeeditor, slik at De kan skrive og kjøre ekte kode direkte i nettleseren og få umiddelbar tilbakemelding fra AI – uten lokal konfigurering.

Alle leksjonene i dette kurset

  1. Prosjektoppsett og CLI
  2. Grunnleggende filsystembasert ruting
  3. Oversikt over sider og oppsett
  4. Stilisere Next.js-appen din
← Tilbake til Next.js 15 fullstack (App Router + Server Actions)