Formation Ionic avec Capacitor et Angular

Programme de notre formation Ionic avec Capacitor et Angular

[Jour 1 – Matin]

Introduction à Ionic et Capacitor avec Angular

• Présentation du framework Ionic et de Capacitor
• Architecture d’une app Angular + Ionic
• Différences avec Cordova et autres solutions hybrides
• Avantages d’un stack Angular pour le mobile
• Démonstration d’une application type
• Atelier pratique : Création d’un projet Ionic + Angular avec Capacitor.

[Jour 1 – Après-midi]

Bases d’Angular appliquées à Ionic

• Rappels : composants, modules, services
• Cycle de vie Angular et adaptation aux applis mobiles
• Gestion des templates et du data binding
• Utilisation de RxJS et des observables
• Organisation du code pour un projet hybride
• Atelier pratique : Construire un premier écran Angular/Ionic.

Composants UI et navigation Ionic

• Découverte des UI Components Ionic
• Navigation avec Angular Router (stack, tabs)
• Thématisation et CSS variables
• Gestion du dark mode
• Optimisation pour l’UX mobile
• Atelier pratique : Mise en place d’une app multi-pages.

[Jour 2 – Matin]

Capacitor : intégration native et plugins

• Architecture de Capacitor
• Plugins officiels : Camera, Filesystem, Geolocation
• Création de plugins personnalisés
• Configuration Android Studio & Xcode
• Différences Capacitor vs Cordova
• Atelier pratique : Intégration de la caméra et gestion des images.

[Jour 2 – Après-midi]

Stockage et gestion des données

• Stockage local avec Storage API et SQLite
• Synchronisation offline-first
• Consommation d’APIs REST et GraphQL
• Sécurité des données locales
• Stratégies de persistance et cache
• Atelier pratique : Sauvegarde et lecture de données locales.

Accès aux fonctionnalités natives avancées

• Gestion des notifications push
• Accès aux capteurs (géolocalisation, biométrie, gyroscope)
• Intégration avec contacts et fichiers système
• Communication avec services natifs Android/iOS
• Dépannage et debugging natif
• Atelier pratique : Ajout de notifications push.

[Jour 3 – Matin]

Tests et débogage

• Tests unitaires Angular dans un contexte Ionic
• Debugging avec Chrome DevTools et simulateurs
• Tests end-to-end avec Cypress ou Protractor
• Bonnes pratiques pour déboguer Capacitor
• Stratégies CI/CD pour apps hybrides
• Atelier pratique : Écrire et exécuter des tests E2E.

[Jour 3 – Après-midi]

Déploiement multi-plateformes

• Compilation pour Android et iOS
• Configuration et signature des apps
• Publication sur Google Play et App Store
• Optimisation des performances (lazy loading, tree-shaking)
• Gestion des environnements DEV/PROD
• Atelier pratique : Compiler l’application Android et la tester dans un émulateur.

Bonnes pratiques et industrialisation

• Architecture projet scalable avec Angular/Ionic
• Utilisation d’un monorepo
• Gestion des dépendances Capacitor
• Mises à jour OTA (over-the-air)
• Roadmap Capacitor + Angular
• Atelier pratique : Structurer une app complète prête prod.