Ionic - Développer des applications mobiles multiplateformes avec Cordova et Angular

Référence : 18782-180622-6-ION

Infos pratiques

  • Durée : 4 jours soit 28 heures
  • Population visée : Ouvrier – Employé – Employé qualifié – Cadre – Cadre supérieur
  • Public concerné : Toute personne souhaitant développer par la pratique des applications mobiles multiplateforme avec Ionic réalisées à l’aide des technologies Cordova et Angular

Programme

Objectifs pédagogiques

A l’issue de cette formation, l’apprenant sera capable de :

  • Développer rapidement et efficacement des applications mobiles multiplateformes sur la base de Cordova et Angular, avec Ionic ;
  • Mettre en œuvre la gestion de la navigation dans l'application ;
  • Ajouter des traitements dynamiques asynchrones et interagir avec des services Web REST ;
  • Tirer les bénéfices de l'utilisation de plugins ;
  • Appliquer des bonnes pratiques dans la conception des applications Ionic pour optimiser les performances.

Pré-requis

  • Maîtriser les langages HTML et CSS, ou idéalement avoir suivi la formation " Maîtriser HTML5 et CSS3 pour créer des pages Web Responsives " ;
  • Maîtriser le langage JavaScript, ou idéalement avoir suivi la formation " JavaScript - Exploiter sa puissance pour dynamiser les applications Web "

Objectifs opérationnels et contenu de la formation

Applications mobiles multiplateformes

  • Ecosystème mobile d'aujourd'hui
  • Les avantages et inconvénients du multiplateforme
  • Zoom sur les webviews
  • Installation de NODE.JS
  • Gestion des dépendances Node npm
  • Utilisation de NodeJS

Angular

  • Langage TypeScript
  • Outils pour TypeScript
  • Modules et dépendances
  • Composants et Templates
  • Application et composant
  • Data Binding
  • Gestion d'événements
  • Directives de structure
  • Pipes et formatage
  • Formulaires
  • Lier le formulaire au modèle
  • Valider les champs
  • Gérer les erreurs
  • Navigation dans l'application
  • Principe des routes
  • Module Router
  • Configuration des routes
  • Navigation dans l'application

Ionic

  • Présentation de Ionic
  • Apports de Ionic à Cordova
  • Installation de Ionic
  • Analyse du projet par défaut
  • Génération d'un Ionic Application
  • Structure d'un projet Ionic
  • Commandes CLI
  • Decorators, Classes
  • Templates
  • La mise en page (Layout)
  • Styles et thèmes
  • Navigation
  • Saisies utilisateurs : User Input

Cordova

  • Manipulation du HardWare du device
  • Points essentiels sur Cordova
  • Installation de l'environnement de développement
  • Commandes usuelles
  • Découverte et installation des plugins
  • Les plugins de Cordova
  • Batterie, GPS, appareil photo, contacts, gyroscope
  • Prendre des photos avec l'appareil photo
  • Sauvegarde et Chargement des Photos
  • Custom Pipe & Diaporama (Slideshow)
  • Géolocalisation
  • La mise en page avec onglets (Tabs)
  • Les formulaires utilisateur
  • Mise en œuvre de Google Maps et Géolocalisation
  • Sauvegarde et récupération des données
  • Réutilisation des composants (Components)

Communication HTTP

  • Gestion des Services par Angular
  • Injections de dépendances
  • Créer des services injectables
  • Structurer ses services
  • Visibilité des fonctions
  • Communication avec le serveur
  • Requêtes Ajax avec le module http
  • Rappels sur HTTP et REST
  • Projet fil rouge : Connexion à une API REST pour récupérer et stocker les photos

Build et déploiement sur Mobiles

  • Automatiser la création des icônes et écrans de démarrage.
  • Présentation des services de la "Ionic Platform".
  • "Build" service de compilation.
  • Cycle de déploiement continu.
  • Déploiement sur Android, IOS et Windows Phone.
  • Plugins
  • Architecture du système de plugins
  • Plugin de prise de photo
  • Plugin de géolocalisation
  • Plugin de partage social
  • Projet fil rouge : Prise de photos depuis l'appareil du téléphone, géolocalisation des photos avant envoi et partage de l'album par l'intermédiaire des réseaux sociaux

Notions avancées

  • Bonnes pratiques
  • Optimisations et performances

Travaux pratiques

  • Création du projet d'application mobile de base
  • Développement des écrans de création d'un album et de liste de photos
  • Intégration d'un carrousel pour l'affichage des photos, adaptation de l'affichage en fonction de l'orientation de l'écran, prise en compte des gestes utilisateurs
  • Développement d'un écran de visualisation en plein écran des photos
  • Connexion à un service Web REST pour récupérer et stocker les photos
  • Prise de photos depuis le téléphone, géolocalisation des photos avant envoi et partage de l'album par l'intermédiaire des réseaux sociaux

Méthodes et moyens

  • Explications théoriques suivies de pratiques guidées puis mises en autonomie
  • 1 vidéoprojecteur par salle
  • 1 ordinateur par stagiaire

Méthodes d’évaluation des acquis

  • Exercices de synthèse et d’évaluation
  • Evaluation de fin de stage

Profil formateur

Nos formateurs sont certifiés à l’issue d’un parcours organisé par nos soins. Ils bénéficient d’un suivi de compétences aussi bien au niveau technique que pédagogique.

Support stagiaire

  • Support papier ou électronique (dématérialisé)
  • Les exercices d’accompagnement peuvent être récupérés sur clef USB