Cette page a été traduite à partir de l'anglais par la communauté. Vous pouvez contribuer en rejoignant la communauté francophone sur MDN Web Docs.

View in English Always switch to English

Modules d'apprentissage fondamentaux

Nos modules fondamentaux couvrent des sujets que nous estimons essentiels pour tout·e développeur·euse web. Cela inclut toutes les informations nécessaires pour concevoir et créer une application web basique et accessible, respectant les bonnes pratiques modernes, ainsi que pour gérer et déployer leur code à l'aide d'outils appropriés.

Prérequis

Il n'y a pas de connaissances préalables requises pour commencer cet ensemble de modules, mais nous vous recommandons de vous familiariser avec votre ordinateur, de vous assurer que vous disposez d'un ensemble d'applications de base installées (comme des navigateurs web et un éditeur de code), et de lire quelques ressources sur le web et les technologies web si ce n'est pas déjà fait. Tous ces sujets sont abordés dans nos modules pour bien débuter.

En particulier, si vous n'avez jamais codé auparavant, nous vous recommandons le module Votre premier site web, qui introduit les technologies web en douceur et vous guide dans la création d'un site web simple.

Modules

Structurer le contenu avec HTML

Pour créer un site web de qualité, utilisable et accessible, il est nécessaire de comprendre comment définir la structure de votre contenu à l'aide de HTML sémantique. Ce module couvre les bases du langage HTML, puis aborde des points clés comme la structure du document, les liens, les listes, les images, les formulaires, etc.

Bases de la mise en forme CSS

CSS (Cascading Style Sheets en anglais) est utilisé pour mettre en forme et organiser les pages web — par exemple, pour modifier la police, la couleur, la taille et l'espacement de votre contenu, le diviser en plusieurs colonnes, ou ajouter des animations et d'autres éléments décoratifs. Ce module fournit tous les fondamentaux CSS nécessaires pour commencer, y compris la syntaxe, les fonctionnalités et les techniques.

Mise en forme du texte avec CSS

Une fois les bases du langage CSS acquises, le prochain sujet à aborder est la mise en forme du texte — l'une des opérations les plus courantes avec CSS. Nous abordons ici les fondamentaux comme la définition de la police, la graisse, l'italique, l'espacement des lignes et des lettres, les ombres portées et d'autres fonctionnalités liées au texte. Nous terminons le module par l'application de polices personnalisées à votre page, et la mise en forme des listes et des liens.

Mise en page CSS

Dans les modules précédents, nous avons vu comment mettre en forme et manipuler les boîtes qui contiennent votre contenu. Il est maintenant temps de voir comment disposer correctement ces boîtes les unes par rapport aux autres et par rapport à la zone d'affichage (viewport en anglais) du navigateur. Ce module aborde les flottants, le positionnement, d'autres outils de mise en page modernes, et la création de designs adaptatifs qui s'ajustent à différents appareils, tailles et résolutions d'écran.

Scripts dynamiques avec JavaScript

JavaScript est un vaste sujet, avec de nombreuses fonctionnalités, styles et techniques à apprendre, ainsi que de nombreuses API et outils construits dessus. Ce module se concentre principalement sur l'essentiel du langage de base, ainsi que sur quelques sujets clés autour — apprendre ces notions vous donnera une base solide.

Frameworks et bibliothèques JavaScript

Les frameworks JavaScript sont une composante essentielle du développement web moderne côté client, fournissant aux développeur·euse·s des outils éprouvés pour créer des applications web interactives et évolutives. De nombreuses entreprises modernes utilisent les frameworks comme standard, et de nombreux emplois en développement exigent désormais une expérience avec ces outils. Cette série d'articles vise à vous donner un point de départ confortable pour débuter avec les frameworks.

Accessibilité

L'accès au contenu web, comme les services publics, l'éducation, le commerce en ligne et le divertissement, est un droit humain. Personne ne doit être exclu en raison d'un handicap, d'une origine, d'une localisation géographique ou d'autres caractéristiques humaines. Ce module présente les bonnes pratiques et techniques à connaître pour rendre vos sites aussi accessibles que possible.

Design pour les développeur·euse·s

L'objectif de ce module est de (re)présenter la pensée design aux développeur·euse·s. Même si vous ne souhaitez pas devenir designer, avoir quelques bases en expérience utilisateur et en théorie du design est bénéfique pour toute personne impliquée dans la création de sites web, quel que soit son rôle. Au minimum, même le·la développeur·euse le plus technique et « non-designer » devrait comprendre les briefs de design, pourquoi les choses sont conçues ainsi, et être capable d'adopter la perspective de l'utilisateur·rice. Et cela aidera à améliorer l'apparence de leur portfolio.

Gestion de versions

Les outils de gestion de versions sont essentiels dans les workflows modernes, pour sauvegarder et collaborer sur des bases de code. Ce module vous présente les bases de la gestion de versions avec Git et GitHub.

Voir aussi

Le parcours de développeur·euse front-end (angl.) Partenaire d'apprentissage MDN

Le Frontend Developer Career Path de Scrimba (angl.) vous enseigne tout ce qu'il faut savoir pour devenir un·e développeur·euse web front-end compétent·e, avec des leçons interactives ludiques, des défis, des enseignant·e·s expérimenté·e·s et une communauté bienveillante. Passez de débutant·e à votre premier emploi front-end ! De nombreux éléments du cours sont disponibles gratuitement en version autonome.