Comment j’ai réalisé mon portfolio
En reprenant mon ancien portfolio, je voulais montrer le lien entre mon parcours en développement et ma spécialisation en cybersécurité. J’ai construit cette nouvelle version autour de cas concrets, avec l’aide de Codex pour l’implémentation et les vérifications.
Partir de mes projets
J’ai choisi de raconter ce que j’avais appris à partir de deux expériences. Avec F0rge, j’ai suivi une application jusqu’à son hébergement privé et à la vérification de ses sauvegardes. Dans mon laboratoire réseau, j’ai utilisé Kali, VMware et Nmap pour comprendre pourquoi des machines virtuelles ne se voyaient pas comme prévu. Chaque projet explique le point de départ, la démarche et ce que j’en ai retenu.
J’ai aussi précisé mon parcours. Le BTS SIO SLAM explique mes bases en développement. Pour SUPINFO, j’ai séparé les enseignements de tronc commun de la spécialisation cybersécurité. Les programmes publics m’ont servi de référence pour présenter les cours par année.
Améliorer la lecture au fil des essais
Les premières versions avaient des textes trop petits et des liens de profil dispersés. J’ai demandé d’agrandir les textes, de revoir les espacements sur téléphone et de regrouper GitHub et TryHackMe sous « Mes profils ».
La section Formation posait un autre problème de lisibilité. Les onglets passent sur deux lignes pour garder des libellés lisibles. Une fois l’année choisie, des titres distincts séparent la spécialisation du tronc commun.
Le fond sombre et l’accent vert donnent une identité visuelle au site. Le thème clair offre un autre réglage de lecture et le navigateur mémorise ce choix.
Garder un site simple à maintenir
Les pages sont écrites en HTML et CSS. Le JavaScript s’occupe des filtres, du thème et des onglets du cursus. Les études de cas sont stockées dans un fichier JSON, ce qui permet de modifier leur contenu sans toucher au code qui les affiche.
Un petit serveur Python sert le site et gère le contact. Par défaut, le formulaire prépare un message dans la messagerie du visiteur. L’envoi direct peut être activé avec un serveur SMTP. Dans ce mode, le serveur valide les champs, limite les envois répétés et affiche une confirmation uniquement si le serveur mail accepte le message.
Préparer la mise en ligne
J’ai préparé un déploiement avec Docker Compose et Caddy pour isoler le portfolio des autres services du VPS et servir le site en HTTPS. La configuration prévoit un aperçu privé pour vérifier le rendu avant de basculer le domaine. Le code et les instructions sont versionnés dans Git. J’ai structuré l’historique GitHub par étapes, de l’initialisation du dépôt à la documentation du déploiement.
Ce projet m’a appris à relier des décisions qui se voient, comme la taille du texte, à celles qui se voient moins, comme le traitement d’un message ou la séparation des services. Les retours sur le rendu ont guidé les ajustements, et les tests automatisés m’ont permis de vérifier le comportement du serveur et du formulaire.