Projet — Création de la page d’accueil d’une agence de voyage
Ce projet faisait partie de ma formation OpenClassrooms.
Il consistait à développer un moteur de recherche avancé en JavaScript pur, capable de filtrer des recettes en temps réel selon plusieurs critères (texte, ingrédients, ustensiles, appareils).
Objectifs
- Intégrer une maquette Figma en HTML & CSS sans utiliser l’outil de code automatique.
- Concevoir une interface responsive adaptée aux différents écrans (mobile, tablette, desktop).
- Structurer un code propre, lisible et maintenable.
- Comprendre et appliquer les principes de mise en page modernes (Flexbox, Grid, responsive design).
- Mettre en place un environnement de développement efficace.
Mon rôle
- Analyse des maquettes et définition de la structure HTML.
- Intégration complète de la page d’accueil : header, sections, images, CTA, footer.
- Mise en place du responsive design avec media queries.
- Optimisation des images et du chargement de la page.
- Tests d’affichage sur différents appareils et navigateurs.
Ce que j’ai appris
- Approfondissement de la structuration HTML sémantique.
- Maîtrise renforcée du CSS moderne (Flexbox, Grid, responsive).
- Compréhension du fonctionnement d’une intégration à partir de maquettes professionnelles.
- Importance de l’adaptation mobile‑first et de l’expérience utilisateur.
- Gestion d’un projet front‑end du début à la fin, en autonomie.
Résultat
Une page d’accueil moderne, fluide et responsive, fidèle aux maquettes Figma et optimisée pour tous les types d’écrans.
Le rendu final offre une navigation agréable, une mise en page claire et un design professionnel, conforme aux attentes d’une agence de voyage souhaitant valoriser ses destinations et services.