ReactJS Avanzato

Giorno 1: Hooks e Custom Hooks
• Hooks nativi:
o useContext e Context API (gestione stato globale)
o useReducer per logica complessa
o useRef e manipolazione DOM
o useMemo e useCallback
o useLayoutEffect vs useEffect
• Custom Hooks:
o Creazione di hook personalizzati
o Pattern comuni (useLocalStorage, useFetch, useDebounce)
o Riutilizzo logica tra componenti
o Best practices
Giorno 2: State Management e Performance Optimization
• State Management avanzato:
o Introduzione a Redux Toolkit (setup moderno)
o Slices, actions, reducers
o Redux DevTools
o Alternative leggere: Zustand, Jotai
• Ottimizzazione delle performance:
o React.memo e memorizzazione componenti
o Lazy loading e code splitting (React.lazy, Suspense)
o Virtualizzazione liste (react-window o react-virtualized)
o Profilazione performance con React DevTools
o Bundle optimization
Giorno 3: Testing e Pattern avanzati / Data Fetching
• Testing:
o Jest e React Testing Library
o Unit test di componenti
o Test di hook personalizzati
o Mock di API e dipendenze
o Integration testing
• Pattern avanzati e Data Fetching:
o Compound Components pattern
o Render Props e HOC (Higher Order Components)
o React Query / TanStack Query per gestione chiamate API
o Server State vs Client State
o Gestione cache e sincronizzazione

• Sviluppatori front-end con esperienza base/intermedia in React.
• Professionisti che già conoscono JSX, componenti funzionali, props e stato locale.
• Team lead e ingegneri che vogliono ottimizzare applicazioni React complesse

• Conoscenza base di JavaScript ES6+ (funzioni freccia, destructuring, spread/rest, moduli).
• Esperienza pratica con React: componenti funzionali, props, state e ciclo di vita base (useEffect).
• Familiarità con strumenti di sviluppo come npm/yarn e console del browser.

Obiettivi
• Gestire lo stato complesso e globale in applicazioni React usando Context API, useReducer e Redux Toolkit.
• Creare Custom Hooks per riutilizzare logica tra componenti e migliorare la manutenibilità del codice.
• Ottimizzare le performance dei componenti e delle applicazioni tramite memoization, lazy loading, code splitting e virtualizzazione di liste.
• Effettuare testing avanzato di componenti, hook e integrazione con API.
• Applicare pattern avanzati come Compound Components, Render Props e HOC.
• Gestire in modo efficace Server State e Client State con strumenti moderni come React Query / TanStack Query.