• éligibleCPF

Formation Développement d’applications web front-end avec JavaScript et les Frameworks Open Source Angular et React

(6 avis)

4.7 sur 5 étoiles

5 étoiles
66%
4 étoiles
33%
3 étoiles
0%
2 étoiles
0%
1 étoile
0%
Voir les 6 avis
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 Code 236953
Certification Microsoft Programmation en HTML5 avec JavaScript et CSS3 (70-480)

Cette formation 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 de la formation met en avant les différents Framework et librairies essentielles du développeur JS comme React, Vue ou encore Angular. Enfin, nous nous attarderons sur le Framework de Facebook : React.

À la fin de cette formation vous aurez appris :

  • 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 librairies et Framework incontournables
  • Développer 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 :

Le participant devra avoir les bases en HTML et CSS et une bonne compréhension des navigateurs Internet et 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 Web
Positionnement 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 JavaScript
Pré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

Nouveautés EcmaScript  (présentation)

JavaScript et EcmaScript (vocabulaire : ECMA, EcmaScript, ES?, ES201?)
Le changement net depuis ES6
Compatibilité avec les navigateurs et les frameworks
Arrow function, promise, etc.
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 String
Les 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éolocalisation
Glisser / 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 natif
Comprendre 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'Angular 2 et 4
Templates, nouvelles syntaxes
Cycle de vie des composants
Principe de l’injection de dépendances
Les formulaires Angular 2 et 4 (template driven, model-driven, etc.)
Le routage
Les tests

Introduction à React

Écosystème des frameworks JavaScript
Différentes approches du data-binding
Philosophie de React
Environnement de développement
Outils de debug

Développer avec React

Création d’un composant
La 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.

Cette formation prépare en partie à l'examen Certification Microsoft programmation en HTML5 avec JavaScript et CSS3 (70-480).

Le passage de l'examen de certification n'est pas obligatoire et n'est pas inclus dans le prix de la formation.

La préparation à cette certification peut être prise en charge dans le cadre du CPF sur MonCompteFormation.

Votre formation Open Source prise en charge à 100% ! *

Depuis mai 2018, Atlas (ex Fafiec) a sélectionné PLB Consultant pour vous proposer les meilleures formations autour de l'Open Source.

Sessions inter-entreprise sur Paris, Lyon et Lille.
Sessions intra-entreprise sur toute la France.

* 100% des coûts pédagogiques, offre valable dans la limite des fonds mutualisés dédiés aux actions collectives, en application des critères de prise en charge en vigueur (voir conditions détaillées sur le site d'Atlas)

Avis des participants à la formation Développement d’applications web front-end avec JavaScript et les Frameworks Open Source

Note moyenne de 4.7/5(6)

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.

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."

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 ."

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"

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"

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"


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