Summary  
This chapter covers scaffolding a code project using a CLI tool, managing dependencies with a package manager, and launching a live-reloading development server to begin customizing the application structure.

General domain of usage  
Front-end web development

## Trin 6: Initialiser projektet
For at opsætte projektet skal du bruge terminalen. Åbn terminalen i din kodeeditor (hvis den ikke allerede er åben), kør følgende kommando, og tryk på Enter:
```
npm create vite@latest .
```


Når du bliver bedt om det, skal du vælge **React** som framework ved hjælp af piletasterne:

Vælg derefter enten **JavaScript** eller **TypeScript**, afhængigt af din præference:

Når opsætningen er fuldført, vil Vite bede dig om at installere afhængigheder. Kør følgende kommando:
```
npm install
```

Når installationen er færdig, start udviklingsserveren ved at køre:
```
npm run dev
```

Efter at have kørt disse kommandoer, vil du se en lokal udviklings-URL — typisk: `http://localhost:5173/`. Du kan åbne dette link i din browser for at se appen live.

## Trin 7: Begynd tilpasning
Projektet er sat op, og du kan begynde at tilpasse det:
- Dit hovedarbejde foregår i **src**-mappen;
- Du finder standardfiler som `App.jsx` og `main.jsx`, som du kan ændre eller erstatte afhængigt af projektets behov;
- Hvis du tidligere har arbejdet i CodeSandbox, kan du genskabe din velkendte struktur: sørg for at have en `main.jsx` (Vites ækvivalent til `index.js`) som indgangspunkt og byg din hovedapplikation i `App.jsx`;
- Opret yderligere mapper efter behov for at organisere dine komponenter, styles og assets.

Hvilken kommando bruges til at starte et nyt React-projekt med Vite?

Lær at opbygge dynamiske, interaktive brugergrænseflader med React. Forstå kernekoncepter som JSX, det virtuelle DOM og genanvendelig komponentbaseret arkitektur. Anvend stylingteknikker ved hjælp af inline styles, ekstern CSS og CSS-moduler for skalerbart design. Håndter state og sideeffekter effektivt med React Hooks og del data på tværs af komponenter ved hjælp af Context.

Opnå forståelse for de centrale principper i React. Du vil lære om JSX (JavaScript XML), opbygning af genanvendelige UI-komponenter og rendering af elementer. Derudover vil du udforske vigtigheden af datainhentning og betinget rendering i React-applikationer. Ved afslutningen af dette afsnit vil du have et solidt fundament i Reacts væsentlige begreber, hvilket forbereder dig til succes med de mere avancerede emner i de følgende afsnit.

Undersøg de forskellige metoder til at tilføje styles til React-applikationer. Du vil lære, hvordan man anvender styles på individuelle komponenter, bruger dynamiske styles og opretholder en skalerbar og vedligeholdelsesvenlig stylingtilgang i projekter.

Kraftfulde funktioner i moderne React-udvikling. Hooks revolutionerer måden, vi skriver funktionelle komponenter på, ved at tilbyde en kortfattet og intuitiv metode til at håndtere tilstand og udføre sideeffekter. Omvendt gør Context det muligt at dele data gennem komponenttræet uden prop drilling. Kombinationen af hooks og Context muliggør effektiv tilstandshåndtering og forenklet datadeling i React-applikationer.

Trinvis vejledning i, hvordan man starter et virkeligt React-projekt. Fra opsætning af udviklingsmiljø til forståelse af projektorganisering og vigtige værktøjer opnås viden og selvtillid til at påbegynde arbejdet med React.

Starte og Køre et React-Projekt med Vite

Trin 6: Initialiser projektet

Trin 7: Begynd tilpasning

Awesome!

Starte og Køre et React-Projekt med Vite

Trin 6: Initialiser projektet

Trin 7: Begynd tilpasning