Venez en toute sécurité dans nos centres ! Voir notre dispositif sanitaire

> Formations > Technologies numériques > Technologies Web > Développement Front-End > Formation Ionic, développement de Web Components > Formations > Technologies numériques > Formation Ionic, développement de Web Components

Ionic, développement de Web Components

Ionic, développement de Web Components

Télécharger au format pdf Partager cette formation par e-mail


Cette formation vous permettra de maîtriser la dernière version du framework/SDK Ionic basé sur Cordova ou Capacitor. Vous développerez des applications mobile et multi-plateformes en utilisant et concevant des Web Components portables pour les frameworks leaders du marché (Angular, React, Vue...).


Inter
Intra
Sur mesure

Cours pratique en présentiel ou en classe à distance

Réf : NVK
Prix : 2490 € HT
  4j - 28h
Pauses-café et
déjeuners offerts




Cette formation vous permettra de maîtriser la dernière version du framework/SDK Ionic basé sur Cordova ou Capacitor. Vous développerez des applications mobile et multi-plateformes en utilisant et concevant des Web Components portables pour les frameworks leaders du marché (Angular, React, Vue...).

Objectifs pédagogiques

À l’issue de la formation, le participant sera en mesure de :
  • Maîtriser l'environnement de développement hybride
  • Comprendre les Web Components
  • Mettre en œuvre les applications multi-plateforme
  • Développer une application mobile basée sur Ionic
  • Exploiter les outils de productivité proposés par Node.js

Objectifs pédagogiques

Public concerné

Architectes, développeurs et chefs de projets Web.

Public concerné

Prérequis

Bonnes connaissances des technologies du Web et des outils modernes de développement Front-End. Connaissances de base de JavaScript.

Prérequis

Pédagogie

Travaux pratiques
Réalisation d'une application mobile/desktop multiplateforme.
Méthodes pédagogiques
Développement d'applications mobiles. 50% de théorie illustrée par 50% de pratique.

Pédagogie

Programme de la formation

Configurer un environnement de développement moderne.
  • Choix de l'éditeur et socle des bonnes pratiques.
  • Node.js et l'API REST/JSON. Paramétrer un "workflow" mobile.
  • Développement avec TypesScript. Le "scaffoldeur"de projet Ionic/CLI.
  • Choix de l'éditeur et socle des bonnes pratiques.
  • Node.js et l'API REST/JSON. Paramétrer un "workflow" mobile.
  • Développement avec TypesScript. Le "scaffoldeur"de projet Ionic/CLI.
Travaux pratiques
Configurer un environnement de développement.

Ionic SDK : présentation et mise en œuvre
  • L'offre de services Ionic.
  • Les frameworks de développement "hybride".
  • Les composants. Compatibilité cross-framework et technologie.
  • Configurer une application.
  • L'offre de services Ionic.
  • Les frameworks de développement "hybride".
  • Les composants. Compatibilité cross-framework et technologie.
  • Configurer une application.
Travaux pratiques
Mise en œuvre d'un projet d'application.

APIs HTML 5, les applications hybrides
  • Le "Data Life Cycle et la stratégie "offline first".
  • Solution de stockage embarqué.
  • Optimiser les Progressive Web App.
  • Manifeste applicatif. Gestion du temps réel.
  • BaaS : Backend As A Service. Les services d'authentification.
  • Le "Data Life Cycle et la stratégie "offline first".
  • Solution de stockage embarqué.
  • Optimiser les Progressive Web App.
  • Manifeste applicatif. Gestion du temps réel.
  • BaaS : Backend As A Service. Les services d'authentification.
Travaux pratiques
Création d'une architecture de service de données.

Web Component : créer des composants Web autonomes et réutilisables
  • La norme des Web Components.
  • Rappels DOM & AJAX. Template HTML à chargement différé.
  • Shadow DOM, et CSS, les fragments de documents.
  • CSS : le besoin d'encapsulation.Custom Elements.
  • StencilJS le compilateur de Web Component proposé par Ionic.
  • La norme des Web Components.
  • Rappels DOM & AJAX. Template HTML à chargement différé.
  • Shadow DOM, et CSS, les fragments de documents.
  • CSS : le besoin d'encapsulation.Custom Elements.
  • StencilJS le compilateur de Web Component proposé par Ionic.
Travaux pratiques
Création de Web Component et distribution avec StencilJS.

Le framework Ionic en profondeur
  • Présentation des composants selon leur API et leur usage ergonomique.
  • Personnalisation ciblée de la plateforme (IOS/Android).
  • Gestion du contenu. Gestion de la navigation.
  • Composants interactifs. Création des formulaires efficaces.
  • Gestuelle utilisateur : "swipe, slide, tap...".
  • Présentation des composants selon leur API et leur usage ergonomique.
  • Personnalisation ciblée de la plateforme (IOS/Android).
  • Gestion du contenu. Gestion de la navigation.
  • Composants interactifs. Création des formulaires efficaces.
  • Gestuelle utilisateur : "swipe, slide, tap...".
Travaux pratiques
Réalisation d'une application basée sur Ionic.

Réutilisation des composants cross-frameworks
  • Développement de composants "cross-plateformes/cross-projet".
  • Les solutions du marché. Angular, le choix par défaut.
  • Intégration avec React et VueJS.
  • Développement de composants "cross-plateformes/cross-projet".
  • Les solutions du marché. Angular, le choix par défaut.
  • Intégration avec React et VueJS.
Travaux pratiques
Développement applicatif avec React Angular Vue.

Préparer le "build" et le déploiement
  • L'environnement selon la plateforme.
  • Le choix de Capacitor.
  • La création des icônes et écrans de démarrage.
  • "Ionic Platform".
  • "Build" service de compilation. Le déploiement continu.
  • L'environnement selon la plateforme.
  • Le choix de Capacitor.
  • La création des icônes et écrans de démarrage.
  • "Ionic Platform".
  • "Build" service de compilation. Le déploiement continu.
Travaux pratiques
Préparation multiplateforme et déploiement de l'application.


Programme de la formation

Solutions de financement

Selon votre situation, votre formation peut être financée par :
  • Le plan de développement des compétences de votre entreprise : rapprochez-vous de votre service RH.
  • Le dispositif FNE-Formation.
  • L’OPCO (opérateurs de compétences) de votre entreprise.
  • Pôle Emploi sous réserve de l’acceptation de votre dossier par votre conseiller Pôle Emploi.
  • Le plan de développement des compétences de votre entreprise : rapprochez-vous de votre service RH.
  • Le dispositif FNE-Formation.
  • L’OPCO (opérateurs de compétences) de votre entreprise.
  • Pôle Emploi sous réserve de l’acceptation de votre dossier par votre conseiller Pôle Emploi.
Contactez nos équipes pour en savoir plus sur les financements à activer.

Solutions de financement

Horaires

En présentiel, les cours ont lieu de 9h à 12h30 et de 14h à 17h30.
Les participants sont accueillis à partir de 8h45. Les pauses et déjeuners sont offerts.
En classe à distance, la formation démarre à partir de 9h.
Pour les stages pratiques de 4 ou 5 jours, quelle que soit la modalité, les sessions se terminent à 15h30 le dernier jour.

Infos pratiques

Dates et lieux

Pour vous inscrire, sélectionnez la ville et la date de votre choix.
Du 22 au 25 février 2022
Classe à distance
S’inscrire
Du 22 au 25 février 2022
Paris La Défense
S’inscrire
Du 12 au 15 avril 2022
Paris La Défense
S’inscrire
Du 12 au 15 avril 2022
Classe à distance
S’inscrire
Du 20 au 23 septembre 2022
Classe à distance
S’inscrire
Du 20 au 23 septembre 2022
Paris La Défense
S’inscrire
Du 22 au 25 novembre 2022
Paris La Défense
S’inscrire
Du 22 au 25 novembre 2022
Classe à distance
S’inscrire

Dates et lieux