Contact

Développeur web full stack : TypeScript, React, Next.js, Express.

ma stack

Développement

  • TypeScript / JavaScript
  • React.js / Next.js
  • Node.js / Express.js
  • API REST
  • PostgreSQL
  • Neon
  • Prisma / Drizzle
  • Zod
  • Tailwind / CSS

Outils et méthodes

  • Git & GitHub
  • Notion
  • Agile / Scrum
  • Jest / Vitest

Déploiement

  • Vercel
  • Netlify

mon parcours

Je suis arrivé au code de façon assez curieuse. En France, je rencontrais sans cesse des personnes qui travaillaient dans la tech, sans jamais comprendre ce qu’elles faisaient. Elles m’expliquaient, je hochais la tête, et je n’avais aucune idée de ce qu’elles voulaient dire quand elles parlaient de « HTML ». Quand j’ai décidé de me reconvertir, j’ai découvert à quel point le code est fascinant, et combien il est proche du travail créatif que j’aime : on construit quelque chose, on le teste, on le retravaille jusqu’à ce que ça tienne, comme en répétition. C’est de la création, de la technique et un défi intellectuel constant, et je suis quelqu’un qui adore apprendre quelque chose de nouveau chaque jour.

Photo en noir et blanc de Gabriel souriant, la tête appuyée sur une main, à côté d’un ordinateur portable.

mes projets

Logo de MaPiscine avec le slogan « Les piscines de Paris, pour tous.tes » au-dessus de deux vagues bleues peintes à la main.

MaPiscine

Une application web qui rassemble les informations des 42 piscines municipales de Paris. Carte interactive et liste, avec des filtres d’accessibilité PMR, un label Queer Friendly, les moyens de paiement et le statut d’ouverture en temps réel. Avec un compte, on peut enregistrer ses favoris et laisser des avis.

Rôle
Projet en solo : conception et développement, de la recherche utilisateur au déploiement
Stack
Next.js, TypeScript, PostgreSQL (Neon), Prisma, Better Auth, Zod, Leaflet, Tailwind CSS, Vitest, GitHub Actions, Vercel
  • Voir le site (s’ouvre dans un nouvel onglet)
  • Voir le dépôt (s’ouvre dans un nouvel onglet)

  • MaPiscine

    • Logo de MaPiscine avec le slogan « Les piscines de Paris, pour tous.tes » au-dessus de deux vagues bleues peintes à la main.
    • Vue mobile de la fiche d’une piscine : Piscine Château Landon, avec son adresse et les labels Ouverte, Accessible PMR et Queer Friendly.
    • Vue carte sur mobile : les piscines de Paris en pins, avec recherche, filtres et bascule liste / carte.
    • Guide de style : palette principale bleue, couleurs secondaires, échelle typographique Montserrat et icônes de l’application.

    Pourquoi. Les informations sur les piscines parisiennes sont dispersées sur des dizaines de pages et difficiles à comparer. En tant que personne queer, je voulais aussi savoir à l’avance si une piscine serait accueillante.

    Démarche. Projet mené seul de bout en bout : personas, wireframes sur Excalidraw, maquettes Figma, modèle de données relationnel, puis développement, 23 tests unitaires et déploiement continu.

    Un défi technique. Next.js exécute le proxy dans l’Edge Runtime, où Prisma ne fonctionne pas. J’ai déplacé la vérification de session vers une route API interne exécutée sous Node : le proxy l’appelle, puis transmet l’identifiant et le rôle de l’utilisateur·ice aux route handlers.

    Et après. Le backend Admin est développé et testé ; son interface est la prochaine étape, avec les horaires de vacances. J’aimerais travailler avec les piscines et des associations queer parisiennes, pour que les données et le label Queer Friendly soient tenus à jour par celles et ceux qui les connaissent le mieux.

CitySon sur ordinateur : une carte de Paris avec un pin sélectionné, Caminamos mirando al cielo, et son lecteur audio.

CitySon

Prototype

Une carte sonore de Paris : chaque pin contient une pièce audio liée à un lieu précis, pensée pour être écoutée sur place. Conçue pour la création sonore et la performance in situ, elle pourrait aussi fonctionner comme un réseau social de sons géolocalisés. Prototype : la carte et les pièces sont en ligne ; la publication est en cours de développement.

Rôle
Projet en solo : concept, design et développement
Stack
React, React Router, Leaflet, Node.js, Express, PostgreSQL (Neon), Vercel
  • Voir le site (s’ouvre dans un nouvel onglet)
  • Voir le dépôt (s’ouvre dans un nouvel onglet)

  • CitySon

    • CitySon sur ordinateur : une carte de Paris avec un pin sélectionné, Caminamos mirando al cielo, et son lecteur audio.
    • Logo de CitySon en jaune sur fond noir, avec un pin de carte après le nom.

    D’où ça vient. Entre 2020 et 2022, au Chili, j’ai créé Caminamos mirando al cielo, une déambulation sonore in situ : le public devait rejoindre un lieu précis, puis l’audio le guidait. Le plus difficile était d’expliquer comment y participer. CitySon, c’est l’outil que j’aurais aimé avoir.

    Ce que ça fait. Chacun·e, à commencer par les artistes, peut épingler un son à un lieu sur la carte. Pour l’écouter comme prévu, il faut s’y rendre : l’écoute devient située.

    Comment c’est construit. Un front en React et une API REST en Express sur PostgreSQL, déployés séparément. Un prototype réalisé en deux semaines : aujourd’hui, on peut explorer la carte et ouvrir chaque pièce.

    Et après. La publication de sons, l’authentification et les favoris, puis une version React Native : c’est une application faite pour être utilisée en marchant dans la ville.