- Cours pratique
- Informatique
Formation Magento 2 Front End
Concepts et bonnes pratiques de développement Front Office avec Magento 2
- Durée
- 2 jours
- Niveau
- Intermédiaire
- Modalités
- Présentiel / Distanciel
Description de la formation Magento 2 Front End
Magento est l'un des cinq premiers CMS d'e-commerce utilisés en France et le premier reposant sur une technologie open source.
Objectifs pédagogiques
Objectifs pédagogiques :
À l'issue de cette formation, les participants auront acquis les connaissances et les compétences nécessaires pour :
- Comprendre comment fonctionne un thème Magento 2
- Savoir quels paramètres activer pour modifier le rendu dans Magento 2
- Modifier un thème, agrémenter un thème
- Créer un nouveau composant front
- Utiliser les bonnes pratiques de développement front dans Magento 2
Objectifs opérationnels
Objectif opérationnel :
Connaître l’ensemble des aspects de la customisation du theming Magento 2.
Programme
Contenu du cours, module par module
13 modules
- Les prérequis techniques
- Les différents modes
- Les lignes de commandes utiles
- Introduction
- Création d’un thème
- Déclarer un logo
- Configurer les tailles d’images du thème
- L’arborescence d’un thème
- Introduction
- Containers & blocks
- Les types de layout
- Page layout
- Déclaration de page layout
- Page configuration
- Generic layout
- Étendre un fichier de layout
- Surcharger un fichier de layout
- Introduction
- Initialisation des templates via le layout
- Les widgets
- Les blocs CMS
- Les principaux paramètres de configuration impactant le front
- Préprocesseur CSS
- Installation de Grunt
- Configuration de grunt
- Les principales lignes de commande
- Introduction
- Inclure des fichiers CSS
- Surcharger ou étendre le CSS
- Créer un fichier less
- @magento_import
- Les typographies
- Les pictogrammes
- Introduction
- Où se trouvent les mixins ?
- Les variables prédéfinies
- Utiliser des mixins
- Les UI components
- Mobile first
- Présentation du mixin CSS .media-width()
- Utilisation du mixin CSS .media-width()
- Javascript RWD
- Présentation de RequireJS :
- Créer un fichier JS
- Surcharger un fichier JS
- Les mixins
- Les widgets jQuery
- Initialiser un widget jQuery
- Étendre un widget jQuery
- Présentation de KnockoutJS :
- Qu’est-ce que le data-binding ?
- Le view-model
- Les bindings
- Les observables
- Les components
- Le templating
- Les scopes dans Magento 2
- Introduction
- L’ordre de lecture
- Les dictionnaires de traduction
- Les clés de traduction et leur syntaxe
- Les packages de traduction
- Introduction
- Customisation d’email via le thème
- Customisation d’email via l’interface d’administration
- Le statut des caches
- Trouver le bon fichier
- Les problèmes de compilation
- Les problèmes de permissions
- La maintenance
- La confirmation de commande
- Les fonctionnalités EE
- Quelques modules tiers utiles
Travaux pratiques
À la fin de chaque module théorique, les participants mettront en œuvre les différents concepts abordés en réalisant un TP qui sera le fil rouge durant les deux jours de formation. Ce TP repose sur l’intégration de maquettes graphiques et cible les interfaces majeures d’un site e-commerce, à savoir la catégorie (grille de produits), la fiche produit et le panier.
Programme mis à jour le 20/02/2026
Public concerné
Cette formation s'adresse aux développeurs Front End, aux intégrateurs CSS et aux développeurs FullStack voulant maîtriser le design et le rendu d’un site en Magento 2.
Prérequis
Pour suivre cette formation Magento 2, il est demandé d'avoir de l'expérience en programmation avec JavaScript et dans l'intégration CSS. Il est préférable de connaître Magento 1.
J’évalue mes connaissances pour vérifier que je dispose des prérequis nécessaires pour profiter pleinement de cette formation en faisant le test de prérequis.
Faire le testFinancement
Cette formation peut être prise en charge par votre entreprise, seule ou avec l’appui de son opérateur de compétences. Nous fournissons le devis et les pièces attendues par l’OPCO.
Formations liées
- Web services REST en PHPRéf. WSPHP3 joursIntermédiaireProchaine session : 16 déc.2 090 €
- WordPress pour développeurRéf. IWOD3 joursIntermédiaire
- Drupal Développement Front-EndRéf. DTI82 joursIntermédiaireProchaine session : 11 déc.1 190 €
- Maîtriser JavaScriptRéf. IJSO4 joursIntermédiaireProchaine session : 12 oct.2 490 €