Cycle Développeur d’Applications Front-End
Objectifs pédagogiques
- Concevoir et créer des applications Web modernes et dynamiques en HTML 5 et CSS 3
- Mettre en pratique les concepts objets en JavaScript et les concepts fonctionnels
- Manipuler les API JavaScript HTML5
- Comprendre les principes de AngularJS
- Etre capable de concevoir et de développer des interfaces Web pour tous types de terminaux
Public cible
- Développeurs
- Chefs de projet Web
Prochaines Sessions
Inscrivez-vous dès maintenant
20 Juil. au 04 Août 2026
Inscription avant le 29 Juin 2026
Besoin urgent ? Demandez une session personnalisée (délai min. 15-20 jours ouvrés)
Devis personnaliséProgramme Détaillé
- La structure composite d'un document HTML : images, CSS, JavaScript...
- Le modèle de document (DOM)
- Le protocole HTTP
- Interaction client/serveur HTTP
- Interprétation du HTML par le navigateur
- Les éléments traditionnels structurant un document HTML (doctype, html, head, body, meta...)
- Les éléments de structure <nav>, <section>, <article>, <aside>, <header> et <footer>
- Simplification avec HTML 5
- Les éléments et leur placement
- Vue d’ensemble des balises HTML
- Les catégories de contenus : Metadata, Flow, Sectioning, Heading, Phrasing, Embedded et Interactive content
- Intérêt des balises structurantes pour le référencement
- Imbrication et type de contenu
- Blocs div et span
- Listes
- Tableaux
- iFrames
- Les balises et attributs obsolètes
- Les balises : <mark>, <meter>, <time>, <figure>, <picture>...
- Les extensions de balises HTML existantes
- Les attributs : a, fieldset, iframe, area, button...
- Les microformats. Présentation et avantages sur le référencement
- Les nouveaux champs et attributs de formulaires : range, autofocus, placeholder, menu...
- Les dessins : Canvas versus SVG
- Les formats multimédias. Codecs et API Multimédia
- Gestion vidéo et audio avec les nouvelles balises <audio> et <video> HTML5
- Vue d’ensemble des formulaires nouvelle génération
- Les nouveaux éléments (progress, meter, datalist, keygen, output)
- Nouveaux types de champs (tel, url, email, search, number, etc.)
- Nouveaux attributs (autofocus, placeholder, form, required, etc.)
- Validation par le navigateur (required, pattern, formnovalidate)
- Suggestions automatiques
- Exemple récapitulatif
- Les pseudo-classes et pseudo-éléments
- Les sélecteurs d’attributs (^, $, *)
- Exemple d’application de style « intelligente » combinant les nouveautés
- Les positionnements (absolu, fixe, naturel)
- Mise en page avec float
- Mise en page avec Flex (box-sizing, border box, etc.)
- Système de grid
- Disposition en colonnes
- Régions et exclusions
- Limites et apports des frameworks (bootstrap, etc.)
- Polices de caractères personnalisées
- Couleurs avancées et dégradés
- Ombres et opacité
- Bordures et arrière-plans avancés
- Transformations de base (rotation, translation, etc.)
- Transformations 3D (perspective)
- Transitions : changement progressif d'un style
- Animations autonomes
- Limites des tableaux apports des CSS Grid
- Positionnement explicite et implicite des objets sur une grille CSS
- Alignement des boîtes avec les grilles CSS
- Utiliser les lignes ou les zones de la grille ?
- Complémentarité Flexbox et Grid
- Compatibilité avec les anciens navigateurs
- Problèmes techniques posés par l’hétérogénéité (PC, téléphone, tablette)
- Solutions apportées par le Responsive Design
- Pré-requis pour faire du responsive Design
- Media-queries : s'adapter à la résolution d'écran et à l'orientation
- Viewport
- Déterminer la valeur d’une propriété CSS (calc)
- Positionnement colonnes, tailles fluides et media queries
- La portée des données
- Les différents types de fonction (anonymes, immédiates, internes)
- Les fonctions anonymes
- Les fonctions callback
- Les fonctions immédiates
- Les fonctions internes
- Rappel sur les scopes
- Les closures
- Le débogage avec les meilleurs outils actuels
- Les nouveautés principales d'ES6/2015
- Les superset JavaScript : TypeScript, Babel, Traceur
- Fonctionnement et intégration du Framework jQuery
- jQuery pour des échanges Ajax et la gestion des formulaires
- Orienté Objet
- Méthodes. Héritage. Portée des données privées et publiques. Mapping et sérialisation
- Structure et syntaxe d'une expression régulière
- Maîtrise de l'environnement de débogage
- Solution de stockage embarquée de données : SQLite, LocalStorage, Cookies
- Appréhender la notion de JavaScript côté serveur avec Node.js
- Programmation JavaScript sous HTML5
- Les grands principes d'AngularJS
- Directives AngularsJS, compilateur HTML
- Expressions. Data-Binding bidirectionnel. Filtres
- Modèle, vues et contrôleurs
- Propagation des événements. API. Dirty Checking
- Module et injection de dépendance
- Le routage
- L'accès au serveur
- Tester une application Angular : Karma, Jasmine. Protractor
- Les écrans : Taille, Résolution
- Démarche de conception : concept de Marcotte, Mobile First
- Les tailles des devices mobiles
- Les Media Queries
- Principe de grille flexible, fluide
- Contenu Responsive : rupture texte, multicolonnes. Césure et découpe
- Framework et librairies responsive
- Composants d'une application Web, le "SuperSet JavaScript"
- Choisir l'environnement de développement (SublimeText, Eclipse, Cloud 9...)
- "Versionner" avec GIT. Organiser les branches de développement
- Node.js comme utilitaire de développement. Le Node Package Manager et Bower
- Automatisation des tâches avec GRUNT
- Intégration des tests automatisés. Utilitaires de test : Jasmine, Mocha...
- Créer un template de projet. Quels utilitaires : Yeoman, Lineman ?
Approche pédagogique
Ressources & Actions
✨ Formations Recommandées
Perfectionnez vos compétences avec ces formations complémentaires
Vous trouverez ici les réponses aux questions les plus fréquentes que nous recevons de la part de nos clients. Notre objectif : vous éclairer et vous accompagner au mieux dans le développement des compétences de vos équipes.
Partie 1 : Nos Formations et Notre Approche Pédagogique
Les deux, mais notre véritable valeur ajoutée réside dans le sur-mesure. Nous partons du principe que chaque entreprise a un contexte, une culture et des défis uniques. Notre processus commence toujours par une phase d'écoute et de diagnostic pour co-construire avec vous le programme qui aura le plus d'impact.
Nos formateurs sont des experts seniors dotés d'une double compétence :
- Une expertise métier solide : Ils ont tous une expérience significative en entreprise au Maroc et comprennent les réalités du terrain.
- Une expertise pédagogique confirmée : Ils sont formés aux techniques d'animation pour adultes, favorisant l'interactivité et la pratique.
Nous nous adaptons à vos contraintes et objectifs avec plusieurs formats :
- Présentiel Intra-entreprise : Chez vous, pour une immersion totale.
- Présentiel Inter-entreprises : Pour favoriser le partage d'expériences.
- Distanciel : Des sessions live, interactives et dynamiques.
Partie 2 : Financement et Aspects Administratifs (Spécificités Marocaines)
Oui, absolument. En tant qu'organisme de formation agréé, nos actions sont éligibles au remboursement via les Contrats Spéciaux de Formation (CSF) gérés par l'OFPPT et les GIAC. C'est un levier essentiel pour optimiser votre budget formation.
Oui, c'est un service clé que nous proposons. Nous vous accompagnons de A à Z dans le montage de votre dossier d'ingénierie financière. Notre expertise du système marocain vous garantit la constitution d'un dossier conforme et le suivi jusqu'au remboursement, transformant cette contrainte administrative en une simple formalité pour vous.
Nos tarifs sont transparents et dépendent de la durée, du niveau de personnalisation, du nombre de participants et du format. Le meilleur moyen d'avoir une idée précise est de nous demander un devis personnalisé et gratuit, qui sera accompagné d'une proposition pédagogique détaillée.
Partie 3 : Processus, Logistique et Suivi
Notre processus est simple et centré sur vos besoins :
- Prise de Contact & Analyse : Échange pour comprendre vos enjeux.
- Proposition sur-mesure : Envoi d'une proposition pédagogique et financière.
- Validation & Planification : Ajustements et fixation du calendrier.
- Réalisation de la Formation.
- Évaluation & Suivi : Mesure de la satisfaction et bilan complet.
Oui. Notre réseau de formateurs nous permet d'intervenir sur l'ensemble du territoire marocain, que vos locaux soient à Casablanca, Rabat, Tanger, Marrakech, Agadir ou dans toute autre ville du Royaume.
Oui, la formation ne s'arrête pas à la fin de la session. Nous assurons un suivi rigoureux : remise des attestations, envoi d'un rapport de synthèse, et mise en place d'une évaluation à froid (quelques semaines après) pour mesurer le transfert des compétences. Des sessions de coaching de suivi sont également possibles.
Partie 4 : Impact et Retour sur Investissement (ROI)
Nous utilisons une approche à plusieurs niveaux (inspirée du modèle de Kirkpatrick) :
- Niveau 1 (Satisfaction) : Évaluation à chaud.
- Niveau 2 (Apprentissage) : Quizz et mises en situation.
- Niveau 3 (Comportement) : Évaluation à froid et entretiens avec les managers.
- Niveau 4 (Résultats) : Analyse de l'impact sur vos indicateurs de performance (KPIs).
Pour trois raisons principales :
- Notre Expertise Locale : Nous sommes des spécialistes du marché marocain et africain, de sa culture et de ses mécanismes administratifs (CSF).
- Notre Approche Sur-Mesure : Nous ne vendons pas de formations, nous construisons des solutions adaptées à votre besoin.
- Notre Engagement sur l'Impact : Nous sommes focalisés sur le retour sur investissement tangible de votre budget formation.
Des questions sur cette formation ?
Notre équipe pédagogique est à votre disposition pour répondre à toutes vos questions et vous accompagner dans votre projet de formation.
La dernière commande pour cette formation a été effectuée il y a 2 jours.
7 personnes regardent actuellement cette page.