Aller au contenu principal
Mohamed Amine MIDENI
Tous les projets

Shoofli

Marketplace de services reliant les clients à des techniciens locaux

ReactTypeScriptTailwind CSSSingle-page app (SPA)Client
Shoofli

À propos

Contexte, problème & solution

Shoofli est une marketplace de services qui met en relation ceux qui ont besoin d'un travail avec les techniciens capables de le réaliser — construite comme une single-page application consciente des rôles, où chaque type d'utilisateur bénéficie d'une expérience adaptée à ce qu'il vient faire.

Contexte et problème. Une marketplace ne fonctionne que si ses deux faces sont bien servies. Un client veut décrire un besoin et joindre rapidement le bon technicien ; un technicien veut mettre en avant ses services et répondre aux demandes ; et quelqu'un doit garder la plateforme saine. Regrouper tout cela dans une interface générique ne sert personne. Le défi était de modéliser trois rôles réellement différents — client, technicien et admin — au sein d'une seule application cohérente.

Solution. Shoofli est une SPA React + TypeScript avec Tailwind CSS, structurée autour de vues basées sur les rôles : la même application affiche une navigation, des permissions et des actions différentes selon l'utilisateur connecté. Les clients créent et parcourent des publications et joignent les techniciens via le contact in-app ; les techniciens gèrent leurs offres et répondent ; les propriétaires de publications reçoivent des notifications lorsqu'un utilisateur interagit avec leur annonce ; et un panneau admin donne aux modérateurs une supervision du contenu de la plateforme.

Focus ingénierie. Le travail intéressant se situe côté frontend : séparer proprement ce que chaque rôle peut voir et faire tout en conservant une base de code et une bibliothèque de composants partagées. TypeScript garde explicites les modèles de rôles et de données, ce qui rend les frontières de permissions plus faciles à raisonner et moins sujettes aux erreurs à mesure que l'application grandit.

Architecture

Comment le système est construit

architecture.diagram
Utilisateurs
Client
Publie des besoinsContacte les techniciens
Technicien
Propose des servicesRépond aux clients
Admin
Modère le contenuPanneau admin
Application
SPA React
Routing & étatVues par rôle
Interactions
Publications
Créer & parcourir
Contact & alertes
Contact in-appNotifications au propriétaire
Trois rôles distincts : client, technicien, adminSingle-page app React + TypeScriptPublications / annonces de servicesContact in-app entre clients et techniciensNotifications pour les propriétaires de publicationsPanneau admin pour la modération

Stack technique

Technologies utilisées

Frontend

ReactTypeScriptTailwind CSSSingle-page app (SPA)

Rôles & accès

ClientTechnicienAdminVues basées sur les rôles

Fonctionnalités

Publications / annoncesContact in-appNotificationsPanneau admin

Envie d'en savoir plus sur Shoofli ?

Le code source complet est disponible sur GitHub, avec l'historique et la configuration de déploiement.