Développer une application mobile native multiplateforme Mixte : présentiel / à distance
Dernière mise à jour : 09/04/2024
Objectifs de la formation
À l'issue de la formation, vous serez capable de :
- Développer une application mobile native multiplateforme
- Utiliser Cordova d'abord sans framework afin de porter un code web existant vers une application mobile puis Cordova avec le framework Ionic
- Maîtriser React Native.
Public visé
Vous êtes professionnels de l'informatique et vous cherchez à acquérir les compétences nécessaires pour développer des applications mobiles natives multiplateformes.
Cette formation est destinée aux ingénieurs logiciels, aux développeurs et aux chefs de projet qui souhaitent se perfectionner dans ce domaine.
Prérequis
Modalités pédagogiques
Moyens et supports pédagogiques
Présentations et supports visuels : Utilisation de diapositives PowerPoint, de fichiers PDF ou d'autres supports visuels pour présenter les concepts clés, les méthodologies et les bonnes pratiques
Démos et exemples concrets : Réalisation de démonstrations, d'exemples concrets peuvent également être utilisés pour illustrer les différents concepts. Des exercices pratiques sont également régulièrement réalisés.
Modalités d'évaluation et de suivi
Les apprenants ainsi que le formateur signeront une feuille d'émargement à chaque demi-journée de formation.
Avant la formation, un questionnaire de positionnement sera envoyé aux apprenants. Ce questionnaire permettra au formateur de préparer cette session en adaptant son approche au groupe.
Tout au long de la formation, les stagiaires seront évalués en continu grâce aux exercices pratiques.
Pour clôturer la formation, une évaluation finale sera réalisée à travers une mise en pratique professionnelle.
À l'issue de la formation, un questionnaire de satisfaction et une attestation de réussite sera délivrée aux apprenants, attestant de leur engagement et des compétences acquises tout au long de cette formation.
Profil du / des Formateur(s)
Description
Concepts et architecture d'une application pour mobile
- Bien comprendre le rôle de chaque technologie (HTML, CSS, JavaScript…)
- Définition de « Application Ajax » ?
- Quelles différences avec un développement en Java (Android) ou Swift (IOS) ?
- Comparaison avec les applications Web traditionnelles
Comment faire du cross-platform ?
- Application non autonome (accessible d'un navigateur web) :
- Le Site Web Responsive
- La WebApp
- Le Site Mobile
- Application autonome :
- Application native générée (React Native, Xamarin…)
- Application hybride (Cordova, Ionic…)
Rappel des fondamentaux
- Quelques rappels sur les fondamentaux des langages du Web :
- HTML
- CSS3
- JavaScript
- Ajax et jQuery
Configurer votre espace de travail
- Les outils de développement (IDE) à utiliser pour développer des applications :
- Hybride (HTML5 / CSS3 / JavaScript…)
- Native généré (JavaScript, C# …)
- Qu'est-ce qu'un gestionnaire de dépendances ? Présentation de npm
- Qu'est-ce que l'intégration continue ?
Zoom sur le HTML5 : les nouveautés qui vont nous être utiles. La sémantique, structures et sections du document
- Les améliorations apportées au contrôle des formulaires et aux iframes
- Nouveaux éléments graphiques (SVG, Canvas)
- Manipuler des contenus multimédia (audio et vidéo)
- Les APIs (Application Programming Interfaces) :
- Géolocalisation
- Drag and Drop
- Local Storage
- Application Cache
- Web Workers (traitement arrière-plan)
Allons plus loin avec les feuilles CSS
- Le CSS RWD (Responsive Web Design) : ViewPort, GridView, Media…
- Dynamisez votre CSS avec des variables paramétrables : présentation de Sass
- Les frameworks CSS Bootstrap, Foundation…
ES2015 : les nouvelles normes JavaScript
- Babel
- ES6 ( let et cont, Fat Arrow functions, Destructuring, imports et exports, Classes, Dynamic Object Keys, Array spread )
- ES7 et au-delà (object spread, async await, static class properties, bound instance methods)
- npm et yarn : installer des packages
Travaux Pratiques :
Utilisation de nouvelles fonctionnalités ES6 / ES201X
Transformer son application web en application mobile avec Apache Cordova
- Présentation de Cordova
- Faire en sorte que son application ne soit plus « web dépendante »
- Que gagne-t-on à utiliser une application native ?
- L'exemple du SDK pour le développement Android
- Téléchargement, installation, et prérequis pour utiliser Cordova
- Utilisation des simulateurs Android et iPhone
- Architecture Cordova & Plugins :
- WebView
- Interface JavaScript
- API Natives (Camera, Accéléromètre…)
- Plugins
- Interface de ligne de commande Cordova
- Gestion des images de l'appareil photo
Travaux Pratique :
À partir d'une application web existante d'offres d'emplois, nous la porterons pour différents types de téléphones (Android, iPhone…) à l'aide du framework Cordova. Déploiement de l'application vers Android, iOS.
Ionic : Quand Angular rencontre Cordova
- Présentation de Ionic, de ses outils (Ionic Lab, Ionic Creator, Ionic View & Ionic Backend…)
- Installer, configurer et exécuter une application Ionic
- Découverte d'Angular :
- Routage & Single Page Application
- Les Directives : Architecture MVC (Contrôleurs, Cycle de vie des vues, Services…)
- Les composants Ionic (Composant graphique, Navigation, Gestion des données…)
- Gestion des thèmes avec Sass
- Ajout des plugins : Ng-Cordova le terminal (batterie, GPS, Bluetooth, appareil photo)
- Automatisation des compilations avec Gulp
- Interface de ligne de commande Ionic CLI
Travaux Pratiques :
Création d'une application mobile à l'aide du framework Ionic : Nous prendrons le même sujet que lors du précédent TP : plateforme de gestion d'offres de travail, comprenant un menu, une liste des offres et un détail sur chacune des offres. Déploiement de l'application vers Android et iOS.
React Native : le meilleur des deux mondes ?
- Qu'est ce que React Native ?
- Les bases de React Native/React
- Les composants de base de React Native
- Créer son premier composant
- Utilisation de create-react-native-app
- La navigation
- Comment construire une application
- Récupérer des données distantes
- Construire des listes et comparaison avec Cordova
- Utiliser des APIs natives
- Mise à jour à distance
Travaux Pratiques :
Création d'une application mobile à l'aide du framework React Native : Nous prendrons le même sujet que lors du précédent TP : plateforme de gestion d'offres de travail, comprenant un menu, une liste des offres et un détail sur chacune des offres. Déploiement de l'application vers Android et iOS.
Déployer votre application
- Définition d'un store ?
- Quels sont les stores existant sur Internet (Apple, Google, Windows) ?
- Soumettre son application au grand public (AppStore & Google Store)
Étude de Cas – Application d'offre d'emploi :
Ce cours est volontairement axé sur l'aspect pratique. De très nombreux travaux pratiques seront réalisés par les participants.
Nous avons volontairement choisi de faire la même application dans des technologies différentes afin que le participant puisse faire une comparaison des outils pour faire le bon choix dans son entreprise.
La maquette avec le site web est fournie aux participants au début de la formation, de même pour les templates HTML / CSS3 / JavaScript fournis, pour un résultat professionnel
- Portage de l'application web Offre d'emploi avec Cordova
À partir d'une application web existante d'offres d'emplois, nous la porterons pour différents types de téléphones (Android, iPhone…) à l'aide du framework Cordova.puis déploiement de l'application vers Android, iOS
- Création d'une application mobile à l'aide du framework Ionic
Nous prendrons le même sujet que lors du précédent TP : plateforme de gestion d'offres de travail, comprenant un menu, une liste des offres et un détail sur chacune des offres. Déploiement de l'application vers Android et iOS.
- Création d'une application mobile à l'aide du framework React Native
Nous prendrons le même sujet que lors du précédent TP : plateforme de gestion d'offres de travail, comprenant un menu, une liste des offres et un détail sur chacune des offres. Déploiement de l'application vers Android et iOS.
Informations sur l'admission
Les demandes d'inscription se font :
- par mail à l'adresse suivante : formation@omneo-solutions.com. Merci de joindre au mail votre CV à jour.
- par téléphone au 03 66 72 86 17
- sur notre formulaire d'inscription en ligne
Les inscriptions se font en fonction des places disponibles. Le délai de rétractation est de 10 jours avant le début de la formation.
Informations sur l'accessibilité
Nous attachons une importance particulière à l'accessibilité de nos formations pour les personnes en situation de handicap.
En cas de besoin, notre référente handicap est disponible pour chaque stagiaire concerné afin de mettre en place un protocole adapté pour garantir qu'il puisse suivre la formation de son choix.
Nous avons développé un processus dédié à la prise en compte de ce public, ainsi qu'un réseau de structures partenaires qui peuvent intervenir si l'adaptation de la formation s'avère compliquée.
Notre objectif est d'assurer que chaque individu, quelle que soit sa situation, puisse bénéficier pleinement de nos formations et développer ses compétences dans les meilleures conditions.