Grundlæggende React Tutorial
Introduktion
Installation af React
Tilslutning af react-devtools plugin
Komponenttilgang
Webstedslayout
Komponentens resultat
JSX Sproget
Introduktion til JSX
Returnering af indlejrede tags
Flytning af tag nedad
Returnering af flere tags
Returnering af ikke-lukket tag
Returnering af tomt tag ved funktion
Indsættelse af variable værdier
Nuancer ved indsættelse af variable
Indsættelse af arrays
Indsættelse af objekter
Indsættelse i attributter
Lagring af tags i JSX
Lagring af flere tags
Tags på forskellige linjer
Returnering af tags
Lukkethed af JSX-tags
Korrekthed af layout
Udførelse af JavaScript-kode
Betingelser
Betingelser i JSX
Visning efter betingelse
Betingelser for at returnere et tag
Ternær operator i JSX
Brug af && operatoren i JSX
Invertering for kortere betingelser
Funktioner
Brug af funktioner
Kald af funktioner inde i tags
Tilknytnings af håndterere
Håndtererparametre
Event-objektet
Event-objektet ved parameteroverførsel
Oprettelse af tags
Tag array
Tag array i loop
Tags fra datamatrise
Nøgler i array
Objektarray
Nøgler via id
Tabel fra objektarray
Unikke id'er
Diskussion
Problemer med nye id'er
Tilfældige strenge til id
Generering af id
Funktion til at generere id
Brug af id-funktion
Forkert brug af funktionen
Stater
Formular
Arbejde med inputfelter
Ændring af inputdata ved deres udskrivning
Ændring af data ved hjælp af en funktion
Arbejde med flere inputfelter
Behandling af formulardata
Arbejde med textarea
Arbejde med checkbokse
Checkbokse og betinget gengivelse
Arbejde med select
Select-punkter fra en array
Value-attributter i select
Selects value-attributter fra en array
Arbejde med radio
Standardværdier
Tilknytning af inputfelter til en array
Tilknytning af inputfelter til et objekt
Data
Introduktion
Reaktiv tilføjelse til array
Reaktive operationer på arrays
Reaktiv tilføjelse til array af objekter
Reaktive operationer på arrays af objekter
Reaktiv datavisning
Komponenter
Introduktion til komponenter
Brug af komponenter
Flere instanser af en komponent
Komponent props
Børnekomponenter
Array til oprettelse af børnekomponenter
Børnekomponenter i loop
Videregivelse af states til børnekomponenter
Videregivelse af id til komponent
Ændring af forælder-state
Redigering af forælder-state
Redigering af bedsteforælder-state
Arbejdsmodus via states
Koncepter
Introduktion
Komponentdata
Komponenttyper
Unidirektional datastrøm
Løft af tilstand
Én sandhedskilde
Styling
Metoder til styling i React
Global CSS
Indsæt data i style-attribut fra objekt
Indsæt data i style-attribut fra separat fil
Arbejde med CSS-stile i style-attribut
Indsæt data i style-attribut fra variabler
Styled Components
Props i Styled Components
Props og betinget rendering i Styled Components
Komponenter med udvidet styling
Kom i gang med CSS-moduler
Fortsat arbejde med CSS-moduler
Kommandoen composes for klasser
Kommandoen composes for filer