- Référence : IJSO1
- Durée : 5 jours (35h)
- Lieu : Au choix. À distance ou en présentiel, à Paris ou en Régions
2695€ HT
Choisir une date et RéserverFormation Développement d’applications web front-end avec JavaScript - Présentation des frameworks Open Source
Angular et React4.6 sur 5 étoiles
5 étoiles
4 étoiles
3 étoiles
2 étoiles
1 étoile
Durée
5 jours
Niveau
Intermédiaire
Classe à distance
Possible
Vous pouvez suivre cette formation en direct depuis votre domicile ou votre lieu de travail. Plus d'informations sur notre solution de classe à distance...
Référence
IJSO1
Éligible CPF
Non
Cette formation Développement d'applications web front-end JavaScript vous propose de vous apprendre le langage JavaScript en profondeur pour la création de vos sites Internet, applications web et mobiles.
Gestion d’événements, manipulation du DOM, programmation orientée objet, nouveautés du langage et histoire du JS sont au programme.
Nous verrons également les outils permettant de maintenir plus facilement son code et les librairies dépendantes afin d’augmenter la productivité et diminuer la dette technique.
La deuxième partie présente les différents Framework et librairies essentielles du développeur JS comme React, Vue ou encore Angular en s’attardant sur le Framework de Facebook : React.
Objectif opérationnel :
Savoir maîtriser les langage JavaScript relatif à la création de vos sites Internet, vos applications web et mobiles.
Objectifs pédagogiques :
À l'issue de cette formation Développement d'applications web front-end JavaScript vous aurez acquis les connaissances et les compétences nécessaires pour :
- Le fonctionnement de JavaScript et son utilité dans le navigateur
- Créer des scripts permettant de rendre interactives vos pages et applications
- Manipuler le contenu et le rendu de la page au travers de gestionnaires d’événements
- Faire de la Programmation Objet en JavaScript
- Coder avec les bonnes pratiques et les bons outils pour un code plus facile à maintenir
- Connaître les principes généraux de VueJS et Angular
- Connaitre l'architecture d'une application web basée sur ReactJS
- Intégrer les nouveautés du langage dans vos programmes avec EcmaScript 6/7
Public :
Cette formation s'adresse aux développeurs et chefs de projets.
Prérequis :
Il est indispensable de connaître les bases du développement (variables, boucles, fonctions, ...). Le participant devra également avoir des bases en HTML et CSS et une bonne compréhension des navigateurs Internet ainsi que du fonctionnement d’Internet (HTTP) même si un bref rappel sera fait sur ces technologies.
Architecture et protocoles Web
Le modèle client/serveur dans le contexte du WebPositionnement et complémentarité des différentes briques (HTML, CSS, JavaScript, Java, PHP, etc.)
Protocoles et formats d’échange entre ces briques (HTTP, XML, JSON, WebServices, Ajax, etc.)
Mode d'appel des scripts depuis les pages HTML
Comment créer une zone de saisie?
Les différents modes de saisie HTML
Introduction aux navigateurs, au JavaScript et au DOM
Les principes d'utilisation des DOM
Les différences principales entre les navigateurs
L'interpréteur JavaScript : entrées/sorties des programmes
Le langage JavaScript
Introduction au langage JavaScriptPrésentation d'exemples simples
Les versions de JavaScript
JavaScript embarqué dans les pages HTML
La grammaire du langage
Les variables
Les types de données
Les opérateurs
Les instructions
Les structures de programmation
La définition et l'utilisation de fonctions
Les objets et leurs utilisations en JavaScript (méthodes, propriétés)
Les dialogues avec l'utilisateur
Les tableaux
Les pièges classiques en JavaScript
Présentation de EcmaScript
Liens entre Ecmascript et JavascriptClarification du vocabulaire (ES6, ES2015, ES7, ES2017, ES20, etc.)
Exemples de nouveautés apportées par les évolutions de Ecmascript (Arrow function, Promise, etc.)
Compatibilité avec les navigateurs et les frameworks
Module import
Gérer les évènements et les données en JavaScript
Les évènements gérés par JavaScript (survol, clic, clavier, etc.)Propagation des évènements
L’objet Event
Les pop-ups
Le fonctionnement de l'objet document. Interactivité, contrôle et transformation des pages HTML
Manipulation de la page (DOM)
Manipulation des URL et des redirections
Sélection d'éléments
Modification du contenu HTML
Modification du graphisme CSS
Développer au quotidien avec JavaScript
Gestion des chaînes de caractères à travers l'objet StringLes principales fonctions mathématiques dans l'objet Math
Manipulation des dates via l'objet Date
Manipulation des tableaux via l'objet Array
Les expressions régulières dans le JavaScript
Règles de transtypage et comparaisons
Paramètres obligatoires / facultatifs / indéfinis des fonctions
Quelques outils pour tester, debugger et mesurer les performances de vos programmes JavaScript
Gestion des formulaires
Composants d’un formulaire (checkbox, textbox, list, button, etc.)Manipulation de l'objet form
Contrôle des données saisies dans un formulaire
Le formulaire dynamique
Liens entre évènements et formulaire (chargement, modification, validation, etc.)
AJAX : dialoguer avec le serveur
Pourquoi AJAX (Asynchronous JavaScript And Xml) ?Mise en œuvre avec l’objet XMLHttpRequest
Méthodes de requête http (GET, POST, etc.)
Récupération de contenus HTML, XML ou JSON
Présentation de JavaScript avec HTML5
GéolocalisationGlisser / Déposer
Multi upload
Historique (pushstate)
Local Storage
Web GL
Web RTC
Fullscreen
API branchées mobile
Détecteur de proximité
Vibration API
Utilisation du gyroscope du smartphone
Accès à la webcam, au micro
Shadow DOM
Évolutions attendues …
Initiation à jQuery
Qu’est-ce que jQuery ?Chargement de jQuery dans la page ou via un CDN
Bases syntaxiques de jQuery
Effets
Évènements
Manipulation DOM
AJAX
Vue générale des frameworks JavaScript
Limites du JavaScript natifComprendre le rôle des principaux frameworks et les technologies associées : Angular, Vue, React, Node
Exemples de bases avec Angular
React, philosophie et principes de fonctionnement
Les tendances du marché et des projets
Présentation de Angular
Principes généraux d'AngularTemplates, nouvelles syntaxes
Cycle de vie des composants
Principe de l’injection de dépendances
Les formulaires Angular (template driven, model-driven, etc.)
Le routage
Les tests
Introduction à React
Écosystème des frameworks JavaScriptDifférentes approches du data-binding
Philosophie de React
Environnement de développement
Outils de debug
Développer avec React
Création d’un composantLa syntaxe JSX
JSX vs JavaScript
Comprendre JSX en détails
Gestion du « state » du composant
Les méthodes du cycle de vie
Tout au long de la formation des ateliers pratiques seront mis en place, suivant un scénario global permettant la création d’une application web de gestion de tâche (Todo List)
Atelier 1 :
Création de l’interface de l’application en HTML et CSS. Modification des éléments à la volée via JS
Atelier 2 :
Gestion d’événements : création et suppression d’éléments grâce à des boutons ajouter / modifier / supprimer
Atelier 3 :
Réécriture du code en jQuery, simplification
Atelier 4 :
Refactorisation : création de fonctions destinées au traitement des données et au comptage des tâches faites / restantes
Atelier 5 :
Stockage des données grâce au Local Storage HTML5. Géolocalisation des tâches. Enregistrement de préférences en Cookies.
Atelier 6 :
Point sur les éléments bloquants de JS natif et jQuery : répétitions de codes, nécessité de penser à appeler dynamiquement des fonctions
Atelier 7 :
Réécriture de l’application en React
Atelier 8 :
Ajout d’une gestion temps réel de l’application et collaboration à plusieurs.
Dates et lieux
1
2
1
2
Avis des participants à la formation Développement d’applications web front-end avec JavaScript - Présentation des frameworks Open Source
Les avis figurant ci-dessous sont issus des fiches d’évaluation que remplissent les participants à la fin de la formation. Ils sont ensuite publiés automatiquement si les personnes ont explicitement accepté que nous les diffusions.
BA
5/5
Mon avis sur le contenu du stage :
"Même si le temps de formation ne permet pas de rentrer dans le détail des différentes notions abordées, le contenu présente les principales fonctionnalités / possibilités offertes par la technologie. Contenu dense sur une période de 5 jours."
Mon avis sur le formateur :
"Formateur très à l'écoute, s'adapte au niveau des stagiaires, et n'hésite pas à passer du temps pour résoudre les problèmes individuels, ou a répondre à des questions sortant du périmètre de la formation. Merci"
Ce que j'ai le plus apprécié :
"Pas de problème particulier rencontré au niveau logiciel."
Ce que j'ai le moins apprécié :
"La qualité du son qui par moment se dégrade."
LIETART Sébastien
5/5
Mon avis sur le contenu du stage :
"+ : chaque participant trouve selon son niveau technique ce qu'il est venu chercher. + : De très bons TP qu'on a envie de faire et qui nous démontrent la puissance du javascript + : un support de cours au format web, des vidéos a venir => c'est génial !! "
Mon avis sur le formateur :
"Michael maîtrise son sujet et le déroulé du stage, il s'adapte aisément au niveau de chacun et sait nous mettre à l'aise face à nos difficultés auxquelles il réponds avec toute son aisance pédagogique."
Ce que j'ai le plus apprécié :
"Bonne ambiance de travail dans le groupe. On s'en sort pas si mal avec Teams finalement :)"
Ce que j'ai le moins apprécié :
"ras"
HK
5/5
Mon avis sur le contenu du stage :
"Super grace au formateur !"
Mon avis sur le formateur :
"Meilleur formation et formateur que j'ai eu. Superbe pédagogie. Enfin une formation qui réponds aux besoins. Le formateur est très pro et connais parfaitement le sujet, prends bien en considération les besoins des stagiaires, pendant la formation et au delà ! Le cours est très très bien structuré et les supports pendant et après le cours sont incroyable ( que de travail de la part du formateur , c'est incroyable)"
Ce que j'ai le plus apprécié :
"Bonne coopération du groupe aidé en grande partie par le formateur."
RJ
5/5
Mon avis sur le contenu du stage :
"Stage exhaustif, très intéressant et instructif avec une bonne montée en niveau progressive."
Mon avis sur le formateur :
"Très bon communiquant. Bonne pédagogie et les points sont revus. Il est sympathique, quelques digressions parfois mais pas méchant =)."
Ce que j'ai le plus apprécié :
"Teams fonctionne bien pour ce genre de stage (une premiere personnellement) avec la possibilité de travailler tous ensemble sur le meme écran , ce qui favorise l'avancée."
OGER Christelle
5/5
Mon avis sur le formateur :
"Très bon formateur, disponible, sympa et pédagogue, "
Mon avis sur la salle de formation :
"rien à redire tout est parfait !"
Ce que j'ai le plus apprécié :
"accueil, bon matériel et chaise, panier gâteaux et collations, formateur excellent"
ADENIS Laureline
4/5
Mon avis sur le contenu du stage :
"Tout était parfait, excepté le fait que nous n'ayons finalement que survolé la partie frameworks."
Ce que j'ai le plus apprécié :
"La disponibilité et l'écoute du formateur."
Ce que j'ai le moins apprécié :
"R.A.S."
GOSSELIN Yveline
5/5
Mon avis sur le contenu du stage :
"Un peu avancé pour moi, mais j'ai quand mëme réussi à faire les exercices grâce au support de cours"
Mon avis sur le formateur :
"Xavier m'a décoincé plusieurs fois et ça m'a permis de continuer les exercices. Il est à l'écoute ."
DA
4/5
Mon avis sur le contenu du stage :
"Très bien mais très dense quand on débute."
Mon avis sur la salle de formation :
"Sur place à l'entreprise"
RT
5/5
Mon avis sur la salle de formation :
"La salle manquait de climatisation"
Ce que j'ai le plus apprécié :
"Le petit déjeuner est appréciable"
DD
4/5
Mon avis sur le contenu du stage :
"les objectifs pédagogiques ont atteints"
Mon avis sur le formateur :
"le formateur est pédagogique"
SA
5/5
Ce que j'ai le plus apprécié :
"Interactivité des sondages, tests de connaissances en ligne, contact facile et agréable avec le formateur, très bon pédagogue"
BONFILS Franck
5/5
Mon avis sur le contenu du stage :
"Excellente formation encadrée par un formateur très compétent. Merci encore à lui pour sa patience et son investissement. Franck."
RDBP
4/5
Mon avis sur le formateur :
"Formateur très à l'écoute, pédagogue, disponible."
TPA
5/5
Mon avis sur le formateur :
"Parfait."
HA
5/5
RJ
4/5
SM
5/5
MC
4/5
VC
5/5
RTP
5/5
EFTHER Sébastien
5/5
KI
4/5
GJ
4/5
DF
4/5
LE LEU Pierrick
5/5
LM
4/5
LM
4/5
LM
4/5
TMM
4/5
TT
5/5
AA
5/5
AA
4/5
BASSAN Tayba
5/5
LM
4/5
Ces formations peuvent aussi vous intéresser :
Formations Informatique
et Management
en ligne à ce jour
+
Stagiaires dans nos salles
de cours sur
l'année
%
De participants satisfaits
ou très satisfaits de nos
formations
Formateurs experts
validés par
PLB
