Comprendre le développement informatique

• S’initier à la programmation
• Analyser un problème à l’aide de la table de décision
• Analyser un problème à l’aide de l’organigramme
• Connaître les bases pour bien comprendre la programmation
• Découvrir les constantes, variables et opérateurs
• Effectuer les traitements conditionnels
• Réaliser des traitements itératifs
• Insérer des tableaux en programmation
• Manipuler des chaînes de caractères en programmation
• Utiliser les fonctions en programmation
• Gérer le code en programmation
• S’initier à la programmation orientée objet
• Gérer les interactions avec l’utilisateur
• Gérer les entrées et sorties en programmation
• Gérer les erreurs de programmation

Le concept orientée objet

• Découvrir la conception orientée objet
• S’initier aux concepts de base de la conception orientée objet
• Analyser un problème en programmation
• Voir des cas d’utilisation de la conception orientée objet
• S’initier à la modélisation
• Créer des classes orientées objet
• Découvrir l’héritage, l’interface, l’agrégation et la composition
• Connaître les concepts avancés de la programmation orientée objet
• Utiliser les patrons de conception

Cas pratique 

• Calculer le prix TTC
• Calculer le périmètre d’un cercle

Introduction

Définir HTML 5

• Balisage HTML5
• Une visite des principaux éléments HTML5
• Les éléments <vidéo>,<Audio> et <Canvas>
• Les formulaires web
• Beaucoup plus de nouveaux éléments avec HTML5
• Une vue d’ensemble des API HTML5 et les technologies de soutien
• Géolocalisation en action
• Web workers
• Le Web Storage
• Les animations CSS
• Les transitions CSS
• Les transformations CSS 2D et 3D
• CSS3, les arrières plans, les frontières, les couleurs RGBA, les dégradés, les ombres portées, et des coins arrondis
• Polices Web @font-face
• HTML5 est dans un état de transition
• Qui est en utilisant HTML5 aujourd’hui ?
• Identifier les sites HTML5

Principes de base de HTML, XHTML et CSS

• Langages du Web
• Page structure basée sur HTML
• Les détails de la syntaxe XHTML
• Doctype permet au navigateur web savoir à quoi vous attendre
• Le W3C et la page de validation
• La structure HTML
• Mise en place des images en HTML
• Le rôle du CSS
• Du style d’une rubrique
• Comprendre les styles de classe et l’élément <span>
• Trois façons d’utiliser le style
• Feuilles interne vs. Feuilles externe
• Création d’une feuille de style externe
• Ce qui rend les styles en cascade

Atelier et cas pratique

Mise en forme avec CSS

• L’importance de la typographie sur le Web
• Les défis de la police sur le Web
• Définition d’une famille de polices
• Dimensionner le texte avec CSS
• Les pixels et les points ne sont pas les meilleurs choix
• Utiliser une combinaison de pour cent et la mesure em
• L’utilisation des marges pour modifier l’espace entre votre texte
• Paragraphe pour réglage de la hauteur de ligne
• Transformation de texte avec CSS
• Utilisation des listes HTML
• Listes HTML avec Styles

Introduction à la mise en page CSS

• Travailler avec un fichier de réinitialisation CSS
• Une brève histoire des techniques de mise en page sur le web
• Un aperçu de la page des options de mise en page
• La compréhension de l’élément <div>: la création d’une disposition de deux colonnes à largeur fixe
• Comprendre la propriété CSS float
• Création de colonnes avec la propriété float
• Travailler avec la propriété claire
• Création d’une navigation basée sur une liste en utilisant des flotteurs
• Ajout de styles de texte
• L’effet des marges et le remplissage de votre mise en page à largeur fixe
• Un examen de l’utilisation de marges et le remplissage des mises en page
• Styling de votre pied de page avec une image d’arrière-plan

Atelier et cas pratique

Création de formulaires HTML 5

• Les formulaires mis à jour
• Le fonctionnement des formulaires
• Les composants d’un formulaire
• L’ajout de nouveaux types d’entrée HTML5 et les attributs
• Création d’un formulaire de commande
• Fournir une solution de repli pour les navigateurs qui ne prennent pas en charge HTML5

Principes de base de HTML, XHTML et CSS

• Langages du Web
• Page structure basée sur HTML
• Les détails de la syntaxe XHTML
• Doctype permet au navigateur web savoir à quoi vous attendre
• Le W3C et la page de validation
• La structure HTML
• Mise en place des images en HTML
• Le rôle du CSS
• Du style d’une rubrique
• Comprendre les styles de classe et l’élément <span>
• Trois façons d’utiliser le style
• Feuilles interne vs. Feuilles externe
• Création d’une feuille de style externe
• Ce qui rend les styles en cascade

Introduction à JavaScript et jQuery

• Interactivité sur le web
• Adobe Flash
• JavaScript
• Bases JavaScript
• Placer votre JavaScript dans un document externe
• Le modèle objet de document
• Framework JavaScript
• Cacher un élément avec JQuery
• Ajout d’un événement pour déclencher l’événement show

Introduction à JavaScript et jQuery

• Ajout d’une vidéo
• Ajout du support pour d’autres navigateurs
• Contrôle d’une vidéo avec JavaScript
• Ajout d’audio

Atelier et cas pratique

Travailler avec les dessins

• Comprendre l’élément canvas
• Les avantages de l’élément canvas
• Dessin de rectangles
• Tracer des lignes et des cercles
• Dessin avec des courbes
• Ajout d’un texte
• L’utilisation de couleurs, des styles et des dégradés
• Ajout d’images
• L’utilisation des transformations
• Création d’une boucle de dessin

CSS 3

• Comprendre le rôle de CSS3
• Ajout de plusieurs images d’arrière-plan
• Travailler avec la transparence et l’opacité CSS3
• En utilisant des gradients CSS3
• CSS3 gradients de potentiel pour l’avenir
• Transformation CSS3, des transitions et des animations
• Utilisation des polices web
• En utilisant @ font-face pour spécifier une police web
• L’utilisation d’un service Web pour générer plusieurs polices

CSS 3 médias Queries et avenir de CSS 3

• Le rôle des médias queries CSS3
• Utilisation de médias queries CSS3 pour fournir une mise en page mobile optimisé
• Développements à venir dans CSS3
• La mise en page multi-colonnes CSS3
• Le module de mise en boîte souple CSS3
• Le module de mise en page du modèle CSS3
• Ajout position sur la base du modèle CSS

Atelier et cas pratique

Stockage hors connexion dans HTML5

• Types de stockage HTML5
• Méthodes localStorage
• Exemple localStorage
• Mettre tout ensemble
• Stockage de données avancées
• La mise en cache des applications
• Le cache, le fichier manifeste
• Mise à jour du cache
• L’objet applicationCache
• Amener tout ensemble

HTML 5 Géolocalisation

• Comprendre Géolocalisation
• Obtenir l’emplacement de l’utilisateur
• Affichage de l’emplacement de l’utilisateur avec Google Maps
• Navigateurs manquant HTML5 Géolocalisation
• Création d’un HTML5 Géolocalisation et mashup Google Maps
• Ajout de marqueurs de carte Google à votre page Géolocalisation

HTML 5 Drag & Drop

• Glissez et déposez sur le Web
• Glisser-déposer Cross-navigateur
• Transfert de données avec une opération de glisser-déposer

Atelier et cas pratique

Présentation de cette formation

• Bienvenue dans « L’essentiel de JavaScript »
• Appréhender le rôle de JavaScript
• Connaître les prérequis
• Distinguer Java et JavaScript
• Comprendre la notion de langage interprété
• Passer en revue les différentes versions de JavaScript
• Installer les outils

Découvrir les bases de JavaScript

• Premier pas avec JavaScript
• Insertion du code JavaScript
• Ajouter du JavaScript dans un document HTML
• Ajouter du JavaScript dans un fichier externe
• Envoyer des messages dans la console
• Savoir où placer son code JavaScript
• Charger JavaScript de manière asynchrone et différée
• Expérimenter avec ASYNC et DEFER
• Commenter son code JavaScript
• Quiz

Traitement des données

• Typologie et utilisation des constantes
• Typologie des variables
• Règles de nommage et mots réservés
• Typologie des opérateurs
• Créer des variables
• Nommer des variables
• Découvrir les types de données avec l’opérateur TYPEOF
• Travailler avec des chaînes de caractères
• Aborder les opérateurs mathématiques
• Additionner et concaténer
• Utiliser des template strings
• Incrémenter et décrémenter des nombres
• Mettre en œuvre des opérateurs booléens
• Découvrir l’objet ARRAY
• Travailler avec des objets
• Quiz

Travailler avec les boucles et les conditions

• Les instructions conditionnelles
• Les instructions de répétitions (boucles)
• Interrompre et quitter les boucles
• La gestion des exceptions
• Utiliser la syntaxe conditionnelle
• Tirer parti de l’opérateur ternaire
• Appréhender les opérateurs de comparaison
• Découvrir les boucles WHILE et DO WHILE
• Utiliser la boucle FOR
• Mettre en œuvre les mots-clés CONTINUE et BREAK
• Découvrir la boucle FOR EACH
• Quiz

Aborder des fonctions

• Les fonctions
• Engendrer des fonctions simples
• Envoyer des données dans une fonction
• Retourner les données d’une fonction
• Exécuter immédiatement des fonctions
• Appréhender les fonctions à flèche
• Comprendre la portée des variables
• Utiliser LET pour déclarer des variables
• Utiliser CONST pour déclarer des variables
• Travail à faire : Aborder les fonctions
• Quiz

Exploiter les objets JavaScript

• Découvrir l’objet MATH
• Travailler avec l’objet DATE
• Revisiter les chaînes de caractères
• Employer l’objet NUMBER
• Redécouvrir l’objet ARRAY
• S’initier au BOM
• Expérimenter avec les objets WINDOW et NAVIGATOR
• Quiz

Le modèle DOM

• Définir ce qu’est le DOM
• Travailler avec les nœuds et les éléments
• Accéder aux éléments du DOM
• Utiliser querySelector et querySelectorAll
• Modifier les éléments du DOM
• Créer de nouveaux éléments dans le DOM
• Modifier les styles CSS en JavaScript
• Quiz

Afficher une image aléatoire

• Préparer le script
• Comprendre JSON
• Choisir un élément aléatoire dans un objet ARRAY
• Afficher l’image choisie
• Vider un élément de son contenu
• Afficher du contenu à l’écran
• Propager le script aux autres pages
• Quiz

Travailler avec les évènements JavaScript

• Comprendre le rôle des évènements
• Réagir à des évènements
• Utiliser addEventListener
• Inspecter les propriétés des évènements
• Utiliser l’évènement CLICK
• Animer des éléments avec CSS et JavaScript
• Employer ONLOAD
• Récupérer les données de l’URL
• Afficher les galeries de photos
• Utiliser ONSUBMIT et preventDefault()
• Se servir des timers
• Travail à faire : Les événements JavaScript
• Quiz

Valider les formulaires côté client

• Appréhender la validation des formulaires
• Valider automatiquement les navigateurs
• Désactiver la validation automatique du formulaire
• Valider côté client en JavaScript
• Générer des messages d’erreur
• Permettre plusieurs validations
• Utiliser ONFOCUS et ONBLUR
• Travail à faire : Valider les formulaires
• Quiz

Aborder jQuery et les bibliothèques JavaScript

• Parcourir les bibliothèques JavaScript
• Intégrer jQuery à son site
• Créer un menu déroulant avec jQuery
• Comprendre le rôle de jQuery
• Quiz

Adopter les meilleures pratiques en JavaScript

• Découvrir le style JavaScript
• Connaître le JavaScript à éviter
• Découvrir le mode Strict
• Minifier et empaqueter JavaScript
• Quiz

Examen final

• Fiche synthèse du cours
• Contrôle final
• Votre avis compte

[Optionnel] Tests unitaires

• Comprendre les bases des tests unitaires
• Découvrir Jasmine
• Découvrir Mocha
• Découvrir Jest

• Vue d’ensemble

  ES2015 et JSX

  • Caractéristiques du ES2019 qui ont un impact Réagir
  • Comment créer des composants avec ES2019
  • Utilisation de Babel pour ES2019 et JSX
  • Utilisation de WebPack avec le développement React
  • Programmation Immuable & Immutable.js

  Réagir – Création de composants

  • Utilisation de createClass
  • L’extension React.Component
  • Fonctions apatrides
  • Référencer les éléments du DOM

  Atelier et cas pratique.

  Réagir – Créer élément et JSX

  • Le rendu
  • Passer des propriétés

  Réagir – Travailler avec l’état

  • Etat Initialisation
  • État Mise à jour
  • Utilisation de formulaires

  Réagir – Composants

  • Composants Fratrie et clés
  • Composants pour parents et enfants
  • Propriétés et Etat dans le composant Élément et gestion du cycle de vie

  Atelier et cas pratique.

  Réagir – Evénements

  • Fonctions Serveur de rend

  Tests unitaires – Outils

  • Jest & Jasmine
  • Enzyme
  • TestUtils

  Tests unitaires – Tests avec React

  • Test DOM Manipulations
  • Test des propriétés et de l’Etat
  • Simuler des évènements

  Atelier et cas pratique

Section 1 : Environnement et fondamentaux

• S’initier aux prérequis Angular
• S’initier à Angular
• Découvrir JavaScript ES6
• Comprendre les classes ES6
• Utiliser les fonctions fléchées
• Prendre en main TypeScript
• Créer un projet
• Installer Node.js et npm
• Créer un projet avec la CLI
• Commencer avec Angular
• Afficher la page par défaut
• Définir la structure du projet
• Utiliser les outils de debug des navigateurs
• Travail à faire : Environnement et fondamentaux
• Quiz : Environnement et fondamentaux

Section 2 : Comprendre Angular et ses fonctionnalités

• Mettre en place les modules et les composants
• Créer un composant
• Lier la vue et le contrôleur d’un composant
• Styliser son composant
• Mettre en place les modules
• Les composants dans Angular
• Découvrir les directives et les pipes
• Aborder la notion de directive
• Définir les directives structurelles
• Utiliser les directives d’attribut
• Les directives dans Angular
• Comprendre les pipes
• Créer et configurer des routes
• Créer une navigation
• Ajouter des formulaires
• Découvrir la directive ngModel
• Découvrir les template driven forms et reactive forms
• Aller plus loin avec les reactive forms
• Découvrir les services
• Aborder la notion de service
• Créer un service
• Injecter un service
• Comprendre l’instanciation des services
• Les services
• Utiliser le HttpClientModule
• Découvrir l’API
• Intégrer le service HttpClient

Section 3 : Angular les services et les web services

• Découvrir les web services avec Angular
• Préparer l’environnement de travail
• Préparer le serveur
• Utiliser les fichiers d’exercice
• Comprendre les services
• Aborder RxJS et sa documentation
• Définir un service dans Angular
• Découvrir les web services
• Créer un service
• Comprendre les injections de dépendances et la globalisation
• Utiliser un service dans le projet
• Assimiler les bonnes pratiques des services
• Utiliser les services HTTP et RxJS
• Appréhender le service http
• Utiliser les observables
• Aborder la notion d’attente et le principe asynchrone
• Vérifier la réponse de retour
• Gérer les différences entre la base de données et l’application
• Comprendre les différents types d’appels
• Utiliser la méthode POST
• Utiliser la méthode PUT
• Programmation réactive
• Appréhender les API REST et SOAP
• Afficher les données avec Renderer
• Travail à faire : Angular les services et les web services
• Quiz : Angular les services et les web services

Section 4 : Gérer les états d’application avec Redux et NgRx

• Aborder les états d’application
• Définir la notion d’état
• Connaître les limites des solutions sans pattern
• Découvrir Redux
• Découvrir NgRx
• Quiz I : Gérer les états d’application avec Redux et NgRx
• Mettre en place le store NgRx
• Importer et configurer le store
• Installer des outils de débogage
• Appréhender l’architecture du store
• Typer et initialiser l’état
• Aborder et configurer les actions
• Aborder et créer les reducers
• Dispatcher une action et abonner un composant au store
• Utiliser les dev tools
• Travail à faire : Gérer les états d’application avec Redux et NgRx

Quiz II : Gérer les états d’application avec Redux et NgRx

Section 5 : Mettre en oeuvre un store avancé

• Mettre en oeuvre le store avancé
• Ajouter une payload à l’action
• Modifier un état de type Objet
• Associer reducers et contrainte d’immutabilité
• Modifier l’état via des opérations immutables
• Aborder d’autres contraintes des reducers
• Copier des objets
• Connaître la différence entre shallow copy et deep copy
• Modifier de façon immutable un état avec une profondeur
• Quiz I : Mettre en oeuvre un store avancé
• Employer les effets et les sélecteurs
• Défi – Ajouter une section à l’état
• Solution – Ajouter une section à l’état
• Aborder les effets
• Implémenter l’effet et émettre une nouvelle action
• Ajouter un niveau de profondeur dans l’état
• Découvrir les sélecteurs
• Travail à faire : Mettre en oeuvre un store avancé
• Quiz II : Mettre en oeuvre un store avancé

Section 6 : Angular les tests et le débogage

• Démarrer votre projet Angular
• Utiliser les fichiers d’exercice
• Démarrer avec le projet de base
• Prendre en main les outils nécessaires
• Comprendre les outils et les pratiques du débogage
• Évaluer son code à l’aide d’une source map
• Travailler avec des breakpoints
• Corriger les erreurs d’injection
• Comprendre les décorateurs Angular
• Corriger les décorateurs Angular
• Découvrir d’autres outils pour les développeurs
• Défi – Corriger du code
• Solution – Corriger du code
• Tester les applications Angular
• S’initier aux tests dans Angular
• Découvrir Jasmine et Karma
• Tests unitaires Jasmine
• Tests unitaires Karma
• Préparer les fichiers pour les tests unitaires
• Pratiquer les tests unitaires de base
• Tester les services
• Tester les composants
• Tester un composant
• Effectuer un test end-to-end
• Travail à faire : Angular les tests et le débogage
• Quiz : Angular les tests et le débogage

Introduction au développement web avec PHP

• L’architecture d’une application web
• L’application Product Discount
• Comment modifier et tester une application PHP

Codage d’une application PHP

• Compétences PHP de base
• L’application Product Discount
• Comment coder les instructions de contrôle
• Comment utiliser la documentation PHP

Introduction aux bases de données relationnelles et MySQL

• Une introduction aux bases de données relationnelles
• Les instructions SQL pour la manipulation des données
• Une introduction à MySQL
• Comment utiliser phpMyAdmin

Utilisation de PHP avec une base de données MySQL

• PHP pour travailler avec MySQL
• Comment obtenir des données d’un jeu de résultats
• L’application Product Viewer
• L’application Product Manager

Atelier et cas pratique.

Utilisation du modèle MVC pour organiser le code

• Comment utiliser le modèle MVC
• L’application Product Manager
• L’application Catalogue de produits

Test et débogage d’une application PHP

• Une introduction aux tests et au débogage

Travailler avec les données de formulaire

• Comment obtenir des données d’un formulaire
• Comment afficher des données sur une page Web

Codage des instructions de contrôle

• Comment coder des expressions conditionnelles
• Comment coder les structures de sélection
• Comment coder les structures d’itération

Atelier et cas pratique.

Travailler avec des chaînes et des nombres

• Comment travailler avec des chaînes
• Comment travailler avec les nombres
• Autres compétences pour travailler avec des chaînes et des nombres

Travailler avec les dates

• Comment utiliser les timestamps pour travailler avec les dates
• Comment utiliser des objets pour travailler avec des dates

Création et utilisation des tableaux

• Comment créer et utiliser un tableau
• Comment créer et utiliser un tableau associatif
• Comment utiliser des fonctions pour travailler avec des tableaux
• Comment travailler avec des tableaux de tableaux
• L’application Task List Manager

Travailler avec les cookies et les sessions

• Comment utiliser les cookies
• Comment travailler avec des sessions
• L’application Shopping Cart

Atelier et cas pratique.

Travailler avec des chaînes et des nombres

• Comment travailler avec des chaînes
• Comment travailler avec les nombres
• Autres compétences pour travailler avec des chaînes et des nombres

Création et utilisation des fonctions

• Compétences de base pour travailler avec des fonctions
• Comment créer et utiliser une bibliothèque de fonctions
• Compétences avancées pour travailler avec des fonctions
• L’application Shopping Cart

Utilisation des expressions régulières, gestion des exceptions et validation des données

• Comment utiliser des expressions régulières
• Comment gérer les exceptions
• La demande d’inscription

Atelier et cas pratique.

Tests unitaires simplifiés avec PHPUnit

• S’initier aux tests unitaires simplifiés avec PHPUnit
• Écrire des tests
• Découvrir la configuration et la console
• Découvrir les petits plus de PHPUnit
• Découvrir le débogage et l’analyse de code en PHP
• Optimiser son code PHP
• Découvrir les outils pour déboguer son code PHP
• Ajouter des tests unitaires et fonctionnels

Démarrer avec Flutter

• Bienvenue dans « L’essentiel de Flutter »
• État des lieux du développement mobile
• Introduction à Flutter
• Comprendre le rôle de Flutter
• Connaître les prérequis de la formation
• Aborder le langage Dart
• Développer des applications mobiles

Découvrir le langage Dart

• Dart,les fondamentaux
• Appréhender les variables et les types de données simples
• Utiliser l’interpolation de string
• Aborder les listes
• Mettre en œuvre les boucles et les conditions
• Fonctions
• Écrire des fonctions
• Programmation orientée objet (POO)
• Généricité
• Exception
• Comprendre les classes et les constructeurs
• Assimiler la notion d’héritage
• Employer les mots-clés Const et Final
• Traitement asynchrone
• Découvrir l’asynchronicité

Procéder à l’installation du SDK Flutter

• Installer le SDK sur Windows
• Installer Android Studio sur Windows
• Installer le SDK sur macOS
• Installer Android Studio et Xcode sur macOS
• Installer et configurer VS Code
• Créer un émulateur Android
• Installer un simulateur iOS

Exercice pratique

Utiliser Flutter

• Créer un nouveau projet
• Comprendre la structure d’un projet
• Démarrer une application Flutter
• Appréhender la notion de widget

Créer une interface utilisateur avec Flutter

• Les widgets de base
• Employer les widgets MaterialApp, CupertinoApp et Text
• Aborder Scaffold
• Tirer parti des stateless widgets et du hot reload
• Composer des layouts : Container et Stack
• Composer des layouts : Row et Column
• Composer des layouts : Expanded et la propriété Flex
• Récupérer les images et les icônes
• Afficher une liste de widgets grâce à une ListView
• Aborder les stateful widgets
• Créer des boutons et gérer les actions utilisateur

Réaliser une application complète en Flutter

• Découvrir le projet
• Créer les modèles JSON
• Consommer l’API
• Utiliser GridView dans Flutter
• Afficher une grille d’images grâce à une GridView
• Utiliser un FutureBuilder pour alimenter une GridView
• Créer un écran affichant les détails d’une vidéo
• Ajouter et utiliser une police d’écriture
• Naviguer entre les écrans
• Proposer un menu pour modifier l’affichage
• Assurer la lecture vidéo
• Utilisation de SQLite dans Flutter
• Conclure sur Flutter

Exercice pratique