Contactez-nous

Industrialisation Front-End

Formation Industrialisation Front-End

L'industrialisation concerne l'ensemble des outils et des bibliothèques améliorant la productivité et la qualité des projets de développement. Lors de cette formation nous allons étudier le cas du développement front-end, des éditeurs de code jusqu'à l'automatisation des tests.

Objectifs pédagogiques / Compétences visées

  • Trouver et installer des bibliothèques avec un gestionnaire de dépendances
  • Utiliser les sur-ensembles CSS et de JavaScript
  • Vérifier statiquement les conventions de code
  • Ecrire son code JavaScript en module et le builder avec webpack
  • Automatiser les tests de son application

Pré-requis

  • HTML / CSS
  • JavaScript

Public

  • Développeurs
  • Chefs de projets

Programme

Jour 1

  • Les IDEs Front-End
    • Visual Studio Code
    • WebStorm
    • EditorConfig
  • Gestionnaires de dépendance
    • Les modernes : npm / Yarn / pnpm
    • Les anciens : Bower / jspm
    • Processus de mise à jour et de migration
    • Publier un paquet
    • Paquets privés : npmjs.com, Verdaccio, Nexus
  • Frameworks HTML/CSS
    • Bootstrap 3 et 4
    • Semantic UI
    • Bulma
    • Materialize
  • Frameworks JavaScript
    • AngularJS
    • Angular
    • React
    • Vue.js
    • Stencil

Jour 2

  • Préprocesseurs CSS
    • Less
    • SASS et SCSS
    • Stylus
    • PostCSS, PostCSS Preset Env, Autoprefixer
  • Méthodologies CSS
    • BEM
    • SMACSS
    • OOCSS
    • ITCSS
  • Modules / Loaders / Bundlers JavaScript
    • Modules : IIFE, CommonJS, AMD, ECMAScript (ESM), Dynamic Imports
    • Loaders : Require.js / SystemJS
    • Bundlers : webpack / browserify / Rollup

Jour 3

  • Documentation et conventions de codes
    • Générer une documentation d’API : JSDoc
    • Les guides : Google / Airbnb / Standard
    • Les linters JavaScript : JSLint, JSHint, ESLint
    • Les linters HTML / CSS : htmllint, CSSLint, stylelint
    • Les formateurs automatiques : Prettier, XO
  • Task Runners
    • Configurer l'automatisation : Grunt
    • Des builds plus rapides : gulp
    • Les scripts npm
  • Les compilateurs JavaScript
    • Compatibilité des moteurs JS : Babel, @babel/preset-env
    • Typage Statique : TypeScript et Flow
    • Performance : WebAssembly / ASM.js
  • Automatiser les tests
    • Les différents types de tests : Unitaire, Intégration, Fonctionnel, End-to-End
    • Tests unitaires / d’intégration : QUnit, Jasmine, Mocha / chai, Ava, Jest
    • Tests runners : Karma
    • Test Doubles : Sinon.js
    • Code Coverage : Istanbul, nyc
    • Tests End-to-End (E2E) : Selenium, Webdriver, Cucumber, CodeceptJS

Moyens pédagogiques et techniques

  • Formateur validé par nos équipes techniques et pédagogiques
  • Salle de formation informatisée
  • Support de cours numérique

Suivi et appréciation des résultats

  • Questions orales ou écrites (QCM)
  • Exercices pratiques
  • Formulaires d'évaluation