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

## Steg 6: Initialiser prosjektet
For å sette opp prosjektet, bruk terminalen. Åpne terminalen i kodeeditoren din (hvis den ikke allerede er åpen), kjør følgende kommando, og trykk Enter:
```
npm create vite@latest .
```


Når du blir bedt om det, velg **React** som rammeverk ved å bruke piltastene:

Velg deretter enten **JavaScript** eller **TypeScript**, avhengig av hva du foretrekker:

Etter at oppsettet er fullført, vil Vite be deg om å installere avhengigheter. Kjør følgende kommando:
```
npm install
```

Når installasjonen er ferdig, start utviklingsserveren ved å kjøre:
```
npm run dev
```

Etter å ha kjørt disse kommandoene, vil du se en lokal utviklings-URL — vanligvis: `http://localhost:5173/`. Du kan åpne denne lenken i nettleseren for å se appen live.

## Steg 7: Begynn tilpasning
Prosjektet er satt opp, du kan begynne å tilpasse det:
- Hovedarbeidet ditt vil foregå i **src**-mappen;
- Du finner standardfiler som `App.jsx` og `main.jsx`, som du kan endre eller erstatte etter prosjektets behov;
- Hvis du tidligere har jobbet i CodeSandbox, gjenskap din kjente struktur: sørg for at du har en `main.jsx` (Vite sitt tilsvar til `index.js`) som inngangspunkt og bygg hovedapplikasjonen din i `App.jsx`;
- Opprett flere mapper etter behov for å organisere komponenter, stilark og ressurser.

Hvilken kommando brukes for å starte et nytt React-prosjekt med Vite?

Lær å bygge dynamiske, interaktive brukergrensesnitt med React. Forstå kjernebegreper som JSX, det virtuelle DOM-et og gjenbrukbar komponentbasert arkitektur. Bruk stilteknikker med inline-stiler, ekstern CSS og CSS-moduler for skalerbar design. Håndter tilstand og sideeffekter effektivt med React Hooks og del data på tvers av komponenter ved hjelp av Context.

Få en forståelse av de grunnleggende prinsippene i React. Du vil lære om JSX (JavaScript XML), bygging av gjenbrukbare UI-komponenter og rendering av elementer. I tillegg vil du utforske viktigheten av datainnsamling og betinget rendering i React-applikasjoner. Etter denne delen vil du ha et solid grunnlag i Reacts essensielle konsepter, noe som forbereder deg på mer avanserte emner i de følgende delene.

Utforsk ulike metoder for å legge til stil i React-applikasjoner. Du vil lære hvordan du anvender stil på individuelle komponenter, bruker dynamiske stiler og opprettholder en skalerbar og vedlikeholdbar tilnærming til styling i prosjektene dine.

Kraftige funksjoner i moderne React-utvikling. Hooks revolusjonerer måten vi skriver funksjonelle komponenter på, og gir en konsis og intuitiv måte å håndtere tilstand og utføre sideeffekter. Context gjør det mulig å dele data gjennom komponenttreet uten prop drilling. Ved å kombinere hooks og Context oppnås effektiv tilstandshåndtering og forenklet datadeling i React-applikasjoner.


Trinnvis veiledning for hvordan man starter et reelt React-prosjekt. Fra oppsett av utviklingsmiljø til forståelse av prosjektorganisering og sentrale verktøy, gir dette deg kunnskapen og selvtilliten til å starte din React-reise.

Starte og Kjøre et React-prosjekt med Vite

Steg 6: Initialiser prosjektet

Steg 7: Begynn tilpasning

Awesome!

Starte og Kjøre et React-prosjekt med Vite

Steg 6: Initialiser prosjektet

Steg 7: Begynn tilpasning