3 dages kursus 

React Advanced

DKK 13.999
ekskl. moms
Nr. 90319 A
Available in English

Er du en erfaren React-udvikler og nysgerrig på at dykke dybt ned i avancerede emner og de nyeste ændringer? React 19 introducerer betydelig ny funktionalitet for at adressere udfordringer inden for: Genbrug af kode; Valg af de rigtige API’er til dit problem; Performance; Korrekthed og Refactoring. Undervisningen foregår på engelsk.

Du bliver klogere på, hvordan du kan bygge løsninger i dit React-program, der er nemmere at vedligeholde, performer bedre og er mere robuste i praksis. På kurset tager du dine React-kompetencer skridtet videre ved at arbejde hands-on med avancerede teknikker og nye muligheder.

Deltagerprofil

Kurset er for dig med mindst et års praktisk erfaring med React. Du behøver ikke være ekspert, men du skal kende grundlæggende begreber som grundprincipper som klasse og funktionskomponenter, egenskaber, begivenheder, tilstand, livscyklusmetoder og Redux.

Udbytte

  • Du lærer at strukturere React-løsninger, så de er nemmere at vedligeholde og videreudvikle
  • Du arbejder med patterns, der gør din kode mere fleksibel og genanvendelig
  • Du optimerer performance og undgår unødvendige renderinger
  • Du får indsigt i nye muligheder i React 19 – og hvordan du bruger dem i praksis
  • Du får styr på avanceret brug af hooks, state og datahåndtering
  • Du lærer at teste og kvalitetssikre dine komponenter effektivt

Det får du på kurset

Vi sørger for, at rammerne er i orden, så du kan fokusere på at lære.

Efter du har fuldendt kurset, vil du modtage et kursusbevis.

Kursusbevis

Hos Teknologisk Institut bruger vi kun erfarne undervisere.

Erfaren underviser

På dette kursus vil der højest være MAKS DELTAGERE pr. hold.

Maks. 10 deltagere

På kurset får du morgenmad, frokost, snacks og drikkevarer.

Fuld forplejning

Materiale på engelsk

Materiale på engelsk

Undervisning på engelsk

Undervisning på engelsk

Tæt på kursusstedet er der gratis parkering.

Gratis parkering

Indhold

Do you know React / JSX?
  • Lesser known React functions
  • Peek under the hood
  • React 19 API changes at a glance: ref as a prop (no more forwardRef), as provider, cleanup functions from ref callbacks, Document metadata in components, improved hydration error messages
Patterns
  • Render-props
  • Compound Components (Flexible Compound Components)
  • Slots / Transclusion
  • Implicit State pattern (see: Context)
  • Headless components
  • Optional: Higher-Order Components
Context API (Implicit State pattern)
  • Provider ( syntax in React 19, no more )
  • Consumer
  • When to use (and when not)
  • Composition over context
Using Hooks
  • Rules of hooks
  • useState() vs useReducer() vs useRef()
  • useEffect() vs useLayoutEffect()
  • useTransition() — now supports async functions (React 19)
  • useDeferredValue()
  • useOptimistic() — optimistic UI updates (React 19)
  • use() — reading resources and context conditionally (React 19)
  • useActionState() — managing form action state (React 19)
  • useFormStatus() — reading parent form status (React 19)
  • useSyncExternalStore() — subscribing to external stores
Actions and Forms (React 19)
  • What are Actions?
  • Form action prop with async functions
  • startTransition with async actions
  • Pending states, optimistic updates and error handling
  • Server Actions vs Client Actions
Errors and Boundaries
  • Writing Error Boundaries
  • React 19: onCaughtError, onUncaughtError, onRecoverableError on createRoot
  • Error recovery patterns
Writing Hooks
  • Writing Custom Hooks
  • Extracting action logic into custom hooks
Profiler (DevTools)
  • How to use
  • Identifying unnecessary renders
Performance
  • memo()
  • useCallback() Hook
  • useMemo() Hook
  • React Compiler — automatic memoization, when it works and when it doesn't
  • Virtualization (TanStack Virtual)
  • Asset loading APIs: preload, preinit, prefetchDNS (React 19)
Suspense
  • Strict Mode as preparation
  • component
  • Code splitting with lazy()
  • Data fetching with Suspense
  • use() with promises and Suspense (React 19)
Server Components and Server Functions (React 19)
  • What are React Server Components (RSC)?
  • Server vs Client component boundaries
  • "use server" and "use client" directives
  • Server Functions (formerly Server Actions)
  • Data fetching patterns with RSC
  • When to use RSC vs client-side state
State Management beyond useState
  • When local state is not enough
  • Zustand
  • Jotai
  • Choosing the right tool
Considerations for maintainable projects
  • Naming
  • Code & folder organisation
  • Structuring large React applications
  • Effects and async: avoiding common pitfalls
Vitest & Testing Library
  • Unit tests
  • Testing asynchronous code
  • Setup & Teardown
  • Mocks
  • Snapshot testing
  • Integration tests
  • Testing components that use React 19 Actions and hooks

Form

Kurset er en kombination af mange demoer, præsentationer og hands-on. Du får 3 dages intensiv virtuel workshop med fokus på øvelser og konkrete praktiske eksempler, du kan bruge direkte i dit arbejde.

 

Form ved virtuel afholdelse

  • Du tilgår kurset via internettet fra din egen computer, stabil forbindelse er vigtig.
  • Du logger på via det tilsendte link, hvor vores underviser sidder klar til et virtuelt live kursus.

Søgte du andre kurser?

Se vores øvrige kurser i webudvikling her.

Billede af Rick Beerendonk
Underviser

Rick Beerendonk

4.8/5 (88 evalueringer) 
Baseret på alle evalueringer af underviseren fra de seneste 5 år.

Rick er seniorkonsulent og underviser fra Holland. Han har over 25 års professionel erfaring med at arbejde i små og store organisationer. Hans passion er enkelhed, velskrevet kode og teamdynamik. Han er specialiseret i front-end-teknologier, og han taler ofte om disse emner ved internationale begivenheder. Rick har holdt foredrag om React og undervist i det siden 2014.

Få ny inspiration til din kompetence­udvikling

Unikke tilbud, relevante artikler og nyt om vores kurser og uddannelser.

Indtast venligst dit fornavn
Email-adressen er ikke korrekt udfyldt
Tilmelder nyhedsbrev
Tak for din tilmelding
Teknisk fejl

Der er desværre en systemfejl på nuværende tidspunkt. Du kan alternativt skrive en mail til data@teknologisk.dk

Billede der illustrerer kurset

Firmakurser - få et tilbud

Er i flere, der har samme behov for kompetenceudvikling, så er et firmakursus ofte den rette løsning, der kan skabe fælles fundament og økonomisk besparelse.

Vil du vide mere?

 

TI-POD - EP #53: Webudvikling for begyndere

Webudvikling kan virke uoverskueligt for nogle. Lyt med i episode 53 og få forklaret webudvikling på en let og forståelig måde af Michell Cronberg.

Læs mere
 

Derfor skal du lære Python

Python er et af de hurtigst voksende programmeringssprog og er populært blandt mange programmører. Læs her, hvorfor det er klogt at lære Python.

Læs mere
 

Hvad er Javaprogrammering?

Bliv klogere på Java programmering og hvilke forskellige versioner, der findes på markedet. Du får også viden om, hvornår du kan bruge programmeringssproget i dit ar...

Læs mere