David
Questa

En 2026, j'ai réalisé une refonte intégrale pour répondre aux besoins de montée en gamme de la cliente. L’architecture technique a été simplifiée par l'unification de deux instances Next.js, réduisant ainsi la dette technique et optimisant les temps de chargement.

Visuellement, j'ai conçu une interface 'Premium' et épurée qui valorise le portfolio photographique. Pensée avec une approche Mobile-First, l'application garantit une expérience fluide et intuitive sur tous les supports, tout en maximisant le taux de conversion des visiteurs.

Cette application permet à l’utilisateur de comparer une liste d’éléments par paires afin de déterminer un gagnant final. L’utilisateur saisit d’abord les éléments à comparer dans une zone de texte, séparés par des virgules ou des retours à la ligne. L’application mélange les éléments puis les présente par deux ou trois à la fois et invite l’utilisateur à choisir son favori. Les éléments sélectionnés passent au tour suivant, et le processus se répète jusqu’à ce qu’il ne reste plus qu’un seul gagnant, qui est alors affiché. L’utilisateur peut ensuite recommencer une nouvelle comparaison sans recharger la page. Ce système est utile pour organiser des classements ou faire des choix de manière interactive et ludique.

Petite application web réalisée avec Vue 3, TypeScript et TailwindCSS. Il s’agit d’un site vitrine pour un centre dentaire fictif, permettant de présenter l’équipe et de proposer un formulaire de contact. Ce projet m’a permis d’améliorer ma pratique de la création d’interfaces modernes et responsives avec Vue, ainsi que ma rapidité d’exécution.

J'ai conçu et développé un outil en ligne de commande (CLI) robuste pour automatiser la création et la personnalisation des fichiers Readme. Ce projet, construit en TypeScript, extrait intelligemment les informations clés depuis le package.json d'un projet et guide l'utilisateur via des invites interactives pour enrichir le contenu (fonctionnalités, technologies, etc.). J'ai mis un accent particulier sur la qualité du code et la testabilité, en atteignant une couverture de code supérieure à 90% grâce à des tests unitaires exhaustifs avec Jest. Le CLI est désormais publié sur NPM, rendant son installation et son utilisation accessibles via une simple commande globale.

Angular Movie Explorer est mon tout premier projet développé avec le framework Angular. Cette application web front-end dynamique a été conçue pour permettre aux utilisateurs d'explorer et de découvrir des films et des séries télévisées, en intégrant des données complètes via l'API The Movie Database (TMDB).

Ce projet a été une expérience d'apprentissage fondamentale, me permettant de maîtriser les concepts clés d'Angular, tels que :

1. La création et l'organisation de composants réutilisables et de services.
2. La gestion de la navigation (routing) et des états de l'application.
3. L'intégration et la manipulation de données asynchrones via des requêtes HTTP (HttpClient) et la gestion des Observables (RxJS).
4. L'implémentation d'une interface utilisateur réactive et intuitive, incluant des fonctionnalités de recherche, de pagination et d'indicateurs de chargement.

Ce projet démontre ma capacité à développer des interfaces utilisateur modernes et performantes, et marque le début de mon parcours avec Angular.

Ce projet est une déclinaison sur mesure de mon projet Next-Portfolio , adaptée spécifiquement aux besoins d'une photographe professionnelle. Il reprend l'architecture robuste à double application Next.js (administration et vitrine) avec MongoDB sur Atlas, tout en y intégrant des fonctionnalités et personnalisations clés pour ce nouveau cas d'usage.

Les principales évolutions et ajouts pour cette version incluent :

1. Notifications par e-mail automatiques : Lors de la réception d'un nouveau message via le formulaire de contact de la vitrine, la propriétaire du site est désormais notifiée instantanément par e-mail (via Nodemailer), lui permettant une réactivité accrue.
2. Personnalisations spécifiques au domaine de la photographie : Le design et l'organisation du contenu de la vitrine ont été affinés pour mettre en valeur les galeries et les portfolios de la photographe, offrant une expérience utilisateur optimisée pour la présentation visuelle.
3. Héritage des fonctionnalités clés : L'application bénéficie toujours de la gestion de contenu dynamique complète (albums, projets, pages), du système d'authentification sécurisé (NextAuth.js, Argon2) avec gestion des autorisations, de l'optimisation des images via Cloudinary et de la sécurisation du formulaire de contact (Google reCAPTCHA v3, limitation des requêtes).

Ce projet démontre ma capacité à adapter et à étendre des solutions existantes pour répondre à des besoins clients spécifiques, en enrichissant les fonctionnalités et en affinant l'expérience utilisateur, tout en maintenant les standards de sécurité et de performance.

En 2026, j'ai entrepris une refonte graphique complète de l'application vers une esthétique plus moderne et épurée. Au cœur de ce projet : une restructuration technique majeure. Je suis passé de deux applications Next.js distinctes (admin et vitrine) à une architecture unique et centralisée. Objectif : gagner en efficacité de déploiement et en rapidité de réponse. Cette version optimise également le SEO interne et l'expérience utilisateur (UX). Voir le projet histoire capturée V2 pour en savoir plus.

Lors de l'intégration de tests Jest dans un projet Next.js avec une architecture frontend/backend distincte (composants serveur et client), l'action GitHub Actions standard ne permettait pas de différencier clairement les résultats des tests. Pour résoudre ce manque de granularité dans les rapports de pull requests, j'ai modifié l'action willcaul/jest-github-action. Cette amélioration introduit la possibilité de spécifier et d'exécuter plusieurs configurations Jest au sein d'un seul workflow, fournissant ainsi des rapports de tests séparés et clairs pour les composants serveur et client.

Absolument ! Voici une version plus concise de la description de votre projet, en tenant compte des informations déjà affichées sur votre page de portfolio. L'objectif est de mettre en avant les spécificités et la valeur ajoutée du projet sans redondance.

Description du Projet : Plateforme de Gestion de Contenu Modulaire et Vitrine Digitale

Ce projet est une plateforme web full-stack modulaire, architecturée autour de deux applications Next.js distinctes (une administration et une vitrine) partageant une base de données MongoDB sur Atlas. Cette conception permet une gestion de contenu (CMS) complète et une présentation dynamique.

L'application d'administration offre une interface robuste pour créer, éditer et organiser tout le contenu affiché sur la vitrine (articles de blog, albums photo, projets). Elle intègre un système d'authentification et d'autorisations multi-niveaux (Admin, SuperAdmin, UltraAdmin) via NextAuth.js, assurant une gestion fine des accès et des rôles, y compris la modération des comptes et la personnalisation des pages statiques. La gestion des médias (images) est optimisée avec Cloudinary, incluant la conversion des fichiers pour la performance. Les messages de contact de la vitrine sont également centralisés et consultables ici.

L'application vitrine est dédiée à l'affichage fluide et réactif de ce contenu dynamique. Elle propose un formulaire de contact sécurisé par Google reCAPTCHA v3 et un système de limitation des envois par IP, démontrant une approche rigoureuse de la sécurité.

Ce projet met en lumière mes compétences en développement full-stack, la conception d'une architecture dédoublée performante, la gestion avancée des utilisateurs et des contenus, ainsi que l'implémentation de solutions de sécurité essentielles (NextAuth, Argon2 pour le hachage des mots de passe, reCAPTCHA).

Lien pour visiter l'application Admin: https://aps-back-git-main-aps-back.vercel.app

Lien pour visiter l'application Vitrine: https://aps-front-git-main-aps-back.vercel.app

Plateforme d'Inspiration CodePen avec Backend Node.js et Frontend Next.js. Ce projet ambitieux est une application inspirée de CodePen, divisée en deux parties distinctes : un backend en Node.js et un frontend en Next.js. L'utilisation de GraphQL et Apollo pour la communication entre les deux parties, TypeScript pour la robustesse, TypeORM et PostgreSQL pour la gestion des données, Jest et Cypress pour les tests, ShadCn UI pour les composants et Tailwind CSS pour le style a permis de créer une plateforme de partage de code performante et bien structurée.

Application de Livraison de Repas Façon Uber Eats Développée avec Vue.js. Ce projet est une application inspirée d'Uber Eats, permettant la commande et la livraison de repas. J'ai utilisé Vue.js pour construire l'interface utilisateur dynamique, TypeScript pour la sécurité du code, Docker pour la conteneurisation et Tailwind CSS pour un styling rapide et moderne.

Application Inspirée d'Airbnb Développée avec Symfony. Ce projet est la création d'une application similaire à Airbnb, axée sur la location. J'ai utilisé le framework Symfony pour gérer les fonctionnalités de réservation, de gestion des annonces et de recherche. L'intégration de PHP, JavaScript, Sass, MySQL et Tailwind CSS a permis de construire une plateforme fonctionnelle et esthétique.

Clône de Quora Réalisé avec la Puissance de Symfony. Ce projet consistait à développer une application inspirée de Quora en utilisant le framework Symfony pour le backend. J'ai exploité les fonctionnalités de Symfony pour la gestion des utilisateurs, des questions, des réponses et des votes. L'utilisation de PHP, TypeScript pour le frontend, Sass pour le style, MySQL pour la base de données et Sass pour le design a permis de créer une application robuste et structurée.

Réplique de Twitter/X Développée avec Node.js. Ce projet est une tentative de recréer les fonctionnalités essentielles de l'application Twitter/X en utilisant Node.js pour le backend. J'ai utilisé Pug pour le templating HTML, JavaScript pour la logique côté client, Sass pour le styling, MongoDB pour la base de données et Express pour la gestion des routes et de l'API. Ce projet m'a permis de comprendre l'architecture d'une application sociale complexe.

Application de Chat Innovante Intégrée à ChatGPT. Ce projet ambitieux déploie une expérience conversationnelle intelligente en exploitant la puissance de l'IA. J'ai conçu une architecture robuste utilisant Node.js pour le backend et React avec Redux pour une gestion d'état fluide côté frontend. L'utilisation de Vite a optimisé les performances de développement, tandis que l'intégration de l'API OpenAI a constitué un défi technique stimulant en termes de gestion de flux de données asynchrones.

Application One-Page pour une Salle de Sport avec TypeScript. Ce projet est la création d'une application web monopage pour une salle de sport ou un service de coaching. L'accent a été mis sur la création d'une expérience utilisateur fluide et informative. L'utilisation de TypeScript a permis d'apporter une robustesse et une maintenabilité accrue au code. J'ai également intégré Node.js pour le backend, React et Vite pour le frontend, ainsi que Tailwind CSS pour un styling rapide et efficace.

Première Incursion dans React : Application de Listing de Recettes. Ce projet marque mon initiation au framework React. J'ai développé une application permettant de lister des recettes de cuisine. L'objectif était de comprendre les concepts fondamentaux de React, tels que les composants, la gestion des états et le rendu conditionnel. L'utilisation de JavaScript et Sass a complété le développement de cette interface utilisateur dynamique.

Réinterprétation du Classique Mastermind en Version Web. Inspiré du célèbre jeu de société, ce projet est une implémentation web du Mastermind. Le défi consistait à permettre aux joueurs de deviner une combinaison de couleurs secrète. J'ai utilisé JavaScript pour gérer la logique du jeu, le suivi des tentatives et la validation des propositions. L'utilisation de HTML et Sass a permis de créer une interface utilisateur claire et agréable. Webpack a été utilisé pour organiser et optimiser les ressources du projet.

Jeu de Mémoire Interactif : Un Défi Visuel. Ce projet ludique consistait à développer un jeu de Memory. L'objectif était de créer une expérience utilisateur engageante où les joueurs doivent retrouver les paires de cartes identiques. Ce projet m'a permis de mettre en pratique la logique de programmation en JavaScript pour la gestion des états du jeu, l'interaction avec l'utilisateur et la manipulation dynamique du contenu HTML.

Création d'un Blog Dynamique avec Interaction API. Ce projet consistait à développer une application de blog offrant la possibilité de créer, modifier et supprimer des billets. L'aspect clé de ce projet résidait dans l'intégration d'une API REST (Dyma) pour la persistance des données, bien que celle-ci soit "momentanée". J'ai pu approfondir mes compétences en JavaScript et structurer l'interface utilisateur avec HTML et Sass pour une mise en page stylisée. La configuration de Webpack a également été réutilisée et consolidée pour la gestion des assets.

Premiers Pas en Code : Application de Liste de Tâches Interactive. Ce projet marque mes débuts dans le monde du développement web. J'ai conçu une application simple mais fonctionnelle permettant de créer, modifier et supprimer des éléments d'une liste de tâches. Cette expérience m'a permis de me familiariser avec les fondamentaux du développement front-end, notamment la manipulation du DOM avec JavaScript, la structuration HTML et la mise en page CSS. L'utilisation de Webpack pour la gestion des modules a également été une première introduction aux outils de build modernes.