Tous les projets
2026 · Projet Personnel (Remote Monkey - YouTube) · Architecture Data & Back-end

Coders Monkeys

Création d'une application web complète destinée aux développeurs front-end pour partager leurs projets et s'entraider. Ce projet m'a permis de concevoir une architecture moderne avec Next.js et d'intégrer un écosystème Serverless complet avec Firebase pour la base de données, l'authentification et le stockage.

Coders Monkeys

Rôle

Développeur Front-End

Angle Visé

Architecture Data & Back-end

Architecture

Serverless, App Router, Real-time Database

Stack

Next.js Firebase Tailwind CSS TypeScript

Problématique

L'enjeu majeur était de créer un système complet comprenant une base de données en temps réel (pour publier et filtrer des projets), un système d'authentification robuste (inscription, connexion, récupération de mot de passe) et un "onboarding" interactif pour les nouveaux utilisateurs, le tout avec un design professionnel basé sur une maquette Figma.

Approche

Développement structuré avec Next.js selon l'architecture "module-container-views" :

  • Design System : Création de composants réutilisables typés avec TypeScript et stylisés via Tailwind CSS.
  • Onboarding & UX : Mise en place d'un tunnel d'inscription interactif avec formulaires asynchrones (via react-hook-form).
  • Back-end Serverless : Intégration avancée de Firebase (Authentication, Firestore, Storage) pour gérer les sessions utilisateurs, les opérations CRUD en temps réel, et l'upload d'images de profil.
  • Cloud Functions : Déploiement de fonctions back-end isolées pour les mises à jour utilisateur complexes.

Résultat

Une plateforme SaaS performante, sécurisée et hébergée sur Firebase Hosting. Elle propose une gestion de compte fluide, une sécurité stricte des données et un design system cohérent et évolutif.

Compétences cibles & Apports

  • Maîtrise des concepts d'architecture Next.js (App Router, Server Components)
  • Intégration complète de Firebase (Auth, Firestore, Storage) en temps réel
  • Conception d'un design system typé TypeScript et configuré avec Tailwind CSS
  • Implémentation d'un tunnel d'inscription interactif avec react-hook-form
  • Création de Serverless Cloud Functions isolées pour les logiques complexes