Formation Javascript

Créer des applications et intégrer de l'interactivité dans vos pages web

  • Utilisez votre CPF
  • Eligible OPCO
  • Eligible Pôle Emploi
  • Objectifs Maîtriser Javascript et créer des designs d'interaction, des effets d'animations et de transitions, développer des fonctionnalités en Ajax pour interagir avec les langages serveur et les bases de données.
  • Public Graphiste, ou toute personne désirant connaître les bases nécessaires à la réalisation de sites web en HTML5 et CSS3.
  • Niveaux requis Être familier avec HTML et CSS. Des notions minimales dans un langage de programmation (idéalement JavaScript) sont un plus.
  • Durée 5 jours

Programme

La langage javascript : introduction

  • Les technologies et le marché du développeur front-end
  • Javascript, environnements techniques et usage
  • Histoire

Les variables

  • Les variables, définition et usage
  • Les mots-clé let, var et const
  • Assigner une valeur à une variable
  • Les types primitifs (string, number, boolean)
  • Les fonctions de conversion de type
  • Exercice : calculatrice du commerçant
  • Pourquoi dit-on que javascript est un langage objet
  • Les arrays (tableaux)
  • Les objets
  • L'objet Date
  • Exercice : afficher la date et l'heure

Les conditions : exécuter du code ou non

  • Les conditions : définition et cas d'usage
  • Les opérateurs de comparaison
  • Les 3 structures conditionnelles
  • Exercice : calculatrice numérique
  • La syntaxe Switch Case
  • Exercice : Calculatrice numérique avec plusieurs choix
  • TP Final : Création d'un jeu web utilisant les variables et les conditions

Les boucles : répéter du code

  • Les boucles : définition et cas d'usage
  • La boucle for : répéter du code un nombre de fois connu
  • Exercice : afficher une liste de followers twitter
  • La boucle while : répéter du code tant qu'une valeur vaut true
  • La boucle do while
  • Exercice : demander à l'utilisateur de saisir un nombre obligatoirement
  • La boucle for of (JS ES6/7)
  • Algorithmie : notions et application
  • TP Final : Créer un algorithme de recherche dans un texte

Les fonctions : organiser mieux votre code

  • Les fonction natives JS et la documentation
  • Les fonctions utilisateur, utilité
  • Créer une fonction et l'exécuter
  • Les paramètres
  • Exercice : créer une fonction simple sans paramètre
  • Exercice: créer une fonction qui accepte des paramètres
  • Le mot-clé return
  • Exercice : créer une fonction qui calcule la distance entre 2 points et retourne un résultat

Travaux pratiques programmation : Créer le système d'un panier e-commerce

  • Créer une donnée de type Array qui contient des noms de produits
  • Créer une function qui ajoute un produit au panier
  • Créer une function qui vide le panier
  • Créer une function qui retire un produit du panier
  • Créer une fonction qui retourne le nombre de produit
  • Rappels et QCM sur la programmation avec Javascript

Javscript et les pages web : créer de l'interaction

  • Le Document Object Model (DOM)
  • Savoir sélectionner des éléments HTML
  • Savoir modifier la page web
  • Savoir gérer les évènements utilisateur (souris, clavier)
  • L'objet event
  • La variable this
  • Mettre en place des animations
  • Exercice : mettre en place des interactions définies sur une page web
  • TP : ajouter de l'interaction sur un système de panier E-commerce
  • Rappels et QCM sur l'interaction

Requêter une API

  • introduction : le monde des APIs
  • Asynchrone : principe et usage d'AJAX
  • Les formats de données et les fonctions de conversion en objet Javascript exploitable
  • Requêter un serveur avec l'objet XMLHttpRequest
  • Les promesses et async await
  • Utiliser l'interface fetch pour réaliser des requêtes AJAX
  • exercice : réaliser des requêtes AJAX simples / parralèles / ou en cascade

Aller plus loin

  • Gérer les dépendances avec NPM
  • Coder en ES6/7 : mettre en place un transpileur
Et obtenez votre certification !

Ils me font confiance