Oppgave: Lage en leksikonkilde

I denne oppgaven skal du lage en leksikonkilde med to kort. Hvert kort skal vise et bilde og en beskrivelse. Målet er å øve på å lage funksjonelle komponenter og sende data til barnekomponenter ved hjelp av props.

Instruksjoner:

1. Lag en Card-komponent som en gjenbrukbar kortmal.
2. I Card-komponenten, ta imot følgende props:
   • link: URL-en til bildet for kortet;
   • alt: Alternativ tekst for bildet;
   • description: Beskrivelsestekst for kortet.
3. Bruk Card-komponenten to ganger i App-komponenten for å lage to kort med følgende innhold:

Kort 1 (Om solen):

• Bilde-URL: https://codefinity-content-media.s3.eu-west-1.amazonaws.com/code-1/react/introduction-to-react/sun.png
• Alternativ tekst: Gi en passende beskrivelse.
• Beskrivelse: "The sun shone brightly, casting a warm glow across the tranquil beach."

Kort 2 (Om fjellet):

• Bilde-URL: https://codefinity-content-media.s3.eu-west-1.amazonaws.com/code-1/react/introduction-to-react/mountain.png
• Alternativ tekst: Gi en passende beskrivelse.
• Beskrivelse: "The hiker gazed in awe at the majestic mountain towering before them."

Sørg for at både Card- og App-komponentene er tilpasset slik at kortene vises korrekt.

Her er en startkode med plassholdere som du kan fullføre:

1. Du kan bruke den samme Card-komponenten for begge kortene og styre innholdet deres ved hjelp av props.
2. For å sende URL-en som en prop, opprett en prop kalt link og angi URL-en som verdi. Verdien skal være i doble anførselstegn siden det er en streng.
3. Opprett på samme måte props for alt og description og angi de riktige verdiene.
4. For å bruke disse propsene i barnekomponenten Card, får du tilgang til dem med dot-notasjon siden props er et objekt.