Corso di formazione Sviluppo di App Mobile Cross-Platform con Ionic 8

Introduzione a Ionic e al panorama cross-platform

• Cos'è Ionic e quando scegliere questa soluzione rispetto alle app native o Flutter
• L'architettura delle Web Components alla base dell'UI di Ionic
• Supporto ai framework negli ecosistemi Angular, React e Vue
• Casi d'uso reali per PWA e applicazioni mobili

Configurazione dell'Ambiente di Sviluppo

• Installazione e configurazione di Node.js e npm
• Installazione della CLI di Ionic
• Creazione e setup di un nuovo progetto Ionic
• Esecuzione delle applicazioni nel browser e in modalità dispositivo connesso

Struttura del Progetto e Architettura Approfondita

• Pagine, moduli e componenti riutilizzabili
• Comprensione e configurazione del sistema di routing
• Servizi e pattern di dependency injection
• Cartelle degli assets e configurazione dell'ambiente

Componenti UI Core e Layout

• Utilizzo di ion-header, ion-toolbar e ion-content per la struttura delle pagine
• Controlli di input: ion-input, ion-select, ion-checkbox
• Pulsanti, FAB, card, liste e sistema a griglia
• Convenzioni moderne per i controlli dei form in Ionic
• Hands-on: creazione di una pagina di login e del layout della dashboard

Strategie di Navigazione e Routing

• Integrazione con Angular Router e React Router
• Pattern di navigazione tra pagine e deep linking
• Caricamento differito (lazy loading) per le performance
• Pattern di navigazione a tab e menu laterale

Styling e Theming

• Variabili CSS e sistema dei colori di Ionic
• Implementazione del supporto alla dark mode
• Personalizzazione dinamica di font e palette in Ionic 8
• Styling responsive attraverso i breakpoint dei dispositivi

Form e Validazione

• Framwork per reactive forms per Angular
• Custom hooks e pattern di validazione per React
• Gestione degli errori e feedback UI della validazione
• Creazione e validazione di form complessi a più passaggi

Servizi e Integrazione API

• Configurazione del client HTTP e interceptors
• Esecuzione di chiamate API RESTful e gestione delle risposte
• Migliori pratiche per la gestione dello stato (state management)
• Error boundaries e recupero in caso di failure di rete

Capacitor e Funzionalità Native del Dispositivo

• Comprensione del bridge di Capacitor e dell'ecosistema dei plugin
• Installazione e configurazione di Capacitor in un progetto esistente
• Accesso alla fotocamera e selezione delle immagini
• Geolocalizzazione e integrazione di mappe
• Archiviazione nativa e preferenze (preferences)
• Hands-on: cattura di immagini e archiviazione dati sul dispositivo

Componenti UI Avanzati

• Modali, popover e alert nelle versioni moderne di Ionic
• Notifiche toast e overlay di caricamento
• Miglioramenti in Ionic 8 per gli eventi e l'architettura degli overlay
• Considerazioni sulle performance per overlay UI complessi

Tecniche di Ottimizzazione delle Performance

• Migliori pratiche per code splitting e lazy loading
• Riduzione della dimensione del bundle e evitare errori comuni
• Ottimizzazione del rendering per liste e grandi set di dati

Progressive Web App e Pipeline di Build

• Conversione dell'applicazione in una Progressive Web App
• Configurazione dei service worker e delle funzionalità offline
• App manifest e prompt di installazione PWA

Processi di Build e Deploy

• Build e bundling per Android e iOS in produzione
• Configurazione dei requisiti e dei metadati per la sottomissione agli store
• Gestione della configurazione degli ambienti tra staging e produzione

Capstone: Sviluppo di un Mini-App Completa

• Progettazione dell'architettura dell'app e del flusso di navigazione
• Sviluppo di una pagina di login con autenticazione
• Realizzazione di una dashboard con integrazione dati live
• Aggiunta della funzionalità fotocamera nativa tramite Capacitor
• Code review, testing e preparazione per il deployment