## Oppgave
Vi skal nå lage `Alert`-komponenten, som skal gjengi alle elementene som sendes inn som children og bruke spesifikke stiler på den. Oppgaven er:
1. Lag komponenten `Alert` som inneholder et `div`-element.
2. `div`-elementet skal ha klassenavnet `alert`.
3. `div`-elementet skal ha `children`-propen som innhold.
4. `div`-elementet skal ha følgende CSS.
```css
padding: 20px;
border-radius: 10px;
background-color: lightgreen;
color: darkmagenta;
```

1. For å lage et `div`-element i komponenten, bruk `<div>...</div>`.
2. For å sende `props.children` som tekstinnhold, omslutt det med `{...}` og bruk `props.children`. Resultat: `<div>{props.children}</div>`.
3. For å legge til et klassenavn på `div`-elementet, bruk attributtet `className` og sett det til `alert`. Resultat: `className="alert"`.
4. For å importere filen med stiler i `index.js`-filen, bruk `import`-setningen og angi riktig filsti. Resultat: `import './index.css'`.
5. For å bruke stiler på `div`-elementet, bruk klassenavnvelgeren `.alert` og sett inn stilene fra oppgaven.

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.

Utfordring: Bruk Ekstern CSS i en React-App

Oppgave

Awesome!

Utfordring: Bruk Ekstern CSS i en React-App

Oppgave