Corso ReactJS
ReactJS è una libreria Javascript creata da Facebook ed utilizzata per lo sviluppo moderno di applicazioni web (Single Page Application).
ReactJS consente di creare interfacce utente complesse (UI) attraverso la loro suddivisione per componenti. La finalità è quella di lavorare a progetti complessi.
E’ utilizzato per la creazione, gestione, manutenzione e aggiornamento della User Interface (UI).
Tra i grandi nomi che utilizzano ReactJS in produzione vi sono Facebook, Istagram, WhatsApp, Netflix, Airbnb, eBay, PayPal e New York Time.
Obiettivo: formare il discente per lo sviluppo applicazioni web con la libreria React
Requisiti: corso rivolto a sviluppatori front-end. Necessarie basi di JavaScript (ES6), del DOM, di HTML5 e CSS3
Corso ReactJS erogato solo per aziende e su richiesta. Modalità virtual classroom online o frontale.
Vuoi essere ricontattato?
Lasciaci il tuo numero telefonico e la tua email, ti richiameremo nelle 24h:
Programma Didattico (32 ore):
1. Introduzione a React
• Che cos’è React: storia, filosofia, casi d’uso
• Perché usare React: vantaggi e limiti
• Panoramica delle versioni recenti – cenno alle novità per le ultime versioni
2. JSX, Virtual DOM e componenti
• Virtual DOM e aggiornamenti del DOM
• Sintassi JSX: differenze con JavaScript puro
• Componenti React: funzione vs (cenno a classi)
• Attributi, children, expressions in JSX
• Liste e chiavi (key)
3. Setup progetto e tool base
• Ambiente: Node.js, npm / yarn
• Creazione progetto base (usando un tool moderno: CRA, Vite o simile)
• Struttura cartelle, file package.json
• Configurazioni base: linting con ESLint, formattazione
4. Props e State
• Passare dati tramite props
• Definire lo state interno con `useState`
• Aggiornare lo state (funzionale vs valore diretto)
• Lifting state up: far comunicare componenti
5. Effetti collaterali e hook fondamentali
• `useEffect`: quando e come usarlo, cleanup
• Altri hook utili: `useRef`, `useMemo`, `useCallback` (introduzione leggera)
6. Rendering condizionale e liste
• Condizioni: if, operatore logico, ternario
• Render di liste con `.map()`
• Chiavi (key) e importanza nella gestione del DOM
7. Form e input controllati
• Form HTML in React
• Input controllati: `input`, `textarea`, `select`
• Checkbox e radio
• Validazione base (campo richiesto, pattern)
8. Stili e librerie UI
• Styling con CSS (file esterni), CSS Modules
• Inline styles e className
• Uso base di una libreria UI (es. React Bootstrap, MUI, Tailwind React)
9. Routing con React Router
• Introduzione a React Router (versione moderna)
• Definizione di rotte: `BrowserRouter`, `Route`, `Routes`
• Navigazione: `Link`, `NavLink`
• Parametri di route (path params e query params)
• Rotte nidificate
10. Gestione eventi e comunicazione tra componenti
• Eventi React: onClick, onChange, onSubmit
• Passaggio di callback da componente genitore a figlio
• Uso della Context API per stato semplice condiviso
11. Gestione del React Global State
• Perché un Global State?
• Introduzione a Redux Toolkit: store, slice, actions, reducers (solo concetti base)
• Uso di Redux con React (Provider, hook)
• Cenno a soluzioni alternative leggere (Context + useReducer, Zustand)
12. Testing di base
• Principi del testing in React
• Setup con Jest + React Testing Library
• Test di componenti: rendering, eventi
• Test di routing
Esercitazioni pratiche durante tutto il corso.
Docente sviluppatore ReactJS e full-stack con pluriennale esperienza.