Scénario et mission
Sophie Bluel souhaitait créer son portfolio numérique afin d'y exposer son travail. Ma mission principale était d'intégrer une page d'accueil dynamique et une page de connexion pour l'administrateur du site en utilisant HTML, CSS et JavaScript; à partir d'une maquette réalisée sur Figma.
Langages
- - HTML
- - CSS
- - JAVASCRIPT
Outils
- - Figma
- - Github
- - VS Code
Compétences développées
- - Manipuler les éléments du DOM avec JavaScript
- - Gérer les événements utilisateurs
- - Récupérer les données utilisateurs via des formulaires
Réalisation du livrable
Le projet était composé d'un backend et d'un frontend, j'était chargé de développer le frontend.
Le backend permettait d'héberger les images du projet et à l'administrateur du site de s'identifier pour ajouter ou supprimer des projets ainsi que leur image.
Le frontend était composé d'un fichier index.html et d'un dossier assets/ avec des images et un fichier style.css.
Version de départ
Pour réaliser le livrable, j'ai commencé par modifier la page d'accueil pour récupérer les images des projets de façon dynamique sur le backend. J'ai ensuite intégré un composant qui permettait de filtrer les projets affichés.
Intégration des filtres
J'ai ensuite intégré la page de login pour permettre à l'administrateur de s'identifier en communiquant avec le backend.
Intégration de la page de login
Pour finir, j'ai intégré une fenêtre modale dans la page d'accueil pour permettre à l'administrateur de supprimer ou d'ajouter un projet en téléchargeant une image sur le backend.
Intégration de la fenêtre modale
Perspective d'amélioration
- - Implémenter une interface responsive
- - Intégrer un bouton permettant aux visiteurs de 'Like' les projets