ReactPro er en omfattende læringsapp i Google Play Butik designet til React.js-entusiaster, fra begyndere til avancerede brugere. Det tilbyder trin-for-trin tutorials, der dækker kernekoncepter som komponenter, tilstand, rekvisitter og kroge, og går videre til emner som kontekst-API, ydeevneoptimering. ReactPros brugervenlige grænseflade og strukturerede kurser gør det til en ideel ressource til at mestre React.js på farten.
Her er en liste over emner i denne React.js tutorial:
1. Introduktion til React
- Hvad er React?
- Nøglefunktioner i React (Components, JSX, Virtual DOM)
- Installation af React (Create React App)
2. JSX: JavaScript XML
- JSX syntaks og brug
- Indlejring af udtryk i JSX
- Gengivelse af JSX
3. Komponenter i React
- Funktionelle vs klasse komponenter
- Oprettelse og gengivelse af komponenter
- Komponentstruktur og genanvendelighed
4. Rekvisitter
- Videregivelse af data til komponenter ved hjælp af rekvisitter
- Prop validering
- Standard rekvisitter
5. Tilstand og livscyklus
- Håndtering af komponenttilstand med 'useState'
- Opdaterer tilstand
- Forståelse af livscyklusmetoder (for klassekomponenter) og kroge (som "useEffect")
6. Håndtering af begivenheder
- Tilføjelse af begivenhedslyttere
- Håndtering af brugerinput og begivenheder
- Bindende hændelseshandlere
7. Betinget gengivelse
- Gengivelse af elementer betinget
- Brug af if/else-sætninger og ternære operatorer i JSX
8. Lister og nøgler
- Gengivelse af lister i React
- Brug af `map()`-funktionen til at vise dynamisk indhold
- Vigtigheden af nøgler i React-lister
9. Formularer i React
- Kontrollerede vs ukontrollerede komponenter
- Håndtering af formular input
- Formularindsendelse og validering
10. Løftetilstand op
- Delingstilstand mellem komponenter
- Løfte tilstand op til en fælles forfader
11. Reager Router
- Opsætning af React Router til navigation
- Definition af ruter og links
- Indlejrede ruter og ruteparametre
12. Kroge Oversigt
- Introduktion til React hooks
- Almindelige kroge: `useState`, `useEffect`, `useContext`
- Brugerdefinerede kroge (valgfrit)
13. Styling in React
- Inline styling
- CSS stylesheets og moduler
- CSS-i-JS-biblioteker (f.eks. stylede-komponenter)
14. Grundlæggende fejlfindings- og udviklerværktøjer
- Brug af React Developer Tools
- Fejlretning af almindelige fejl
15. Implementering af en React-app
- Opbygning af appen til produktion
- Implementeringsmuligheder (Netlify, Vercel, GitHub Pages)
Dette ville dække de grundlæggende koncepter og få nogen i gang med React!
Avancerede emner:
16. Context API og State Management
- Forståelse af React Context API
- Brug af Context for at undgå propboring
- Kontekst vs. statsforvaltningsbiblioteker (Redux, MobX)
- Hvornår og hvorfor skal man bruge statsforvaltningsbiblioteker
17. Avancerede kroge
- Detaljeret kig på 'useReducer' til kompleks tilstandsstyring
- Brug af 'useMemo' og 'useCallback' til ydeevneoptimering
- Forståelse og brug af 'useRef' til DOM-manipulation og persistens
- Oprettelse af tilpassede kroge til at indkapsle genanvendelig logik
18. Higher-Order Components (HOC)
- Forståelse af komponenter af højere orden
- Oprettelse af HOC'er for at forbedre funktionaliteten
- Use cases og bedste praksis
- Sammenligning med Render Props
19. Render Rekvisitter Mønster
- Hvad er Render Props?
- Oprettelse og brug af komponenter med render-rekvisitter
- Hvornår skal du bruge gengivelsesrekvisitter vs HOC'er
20. Fejlgrænser
- Forstå fejlgrænser i React
- Implementering af fejlgrænser ved hjælp af `componentDidCatch`
- Fejl ved håndtering af bedste praksis i React