Bachelor's final project · USTHB · defended June 2025 Projet de fin de Licence · USTHB · soutenu en juin 2025مشروع نهاية الليسانس · USTHB · نوقش في جوان 2025

ShopO

A marketplace dedicated to electronics where verified sellers open their own store, customers pay online or on delivery, and a recommender suggests similar products. Une marketplace dédiée à l'électronique où des vendeurs vérifiés ouvrent leur boutique, où les clients paient en ligne ou à la livraison, et où un système de recommandation propose des produits similaires.متجر إلكتروني متخصص في الأجهزة الإلكترونية، يفتح فيه بائعون موثَّقون متاجرهم، ويدفع فيه الزبائن عبر الإنترنت أو عند الاستلام، ويقترح فيه نظام توصيات منتجات مشابهة.

RoleRôleالدور: Full-stack developer in a team project: Laravel API, React front end and database designDéveloppeur full-stack dans un projet d'équipe : API Laravel, front React et conception de la base de donnéesمطوّر Full-Stack في مشروع جماعي: API بـ Laravel، وواجهة React، وتصميم قاعدة البيانات
SupervisorEncadrantالمؤطِّر: Mr. Abdelnour HIMRANE, USTHB
StackStackالتقنيات: Laravel 11 · React 19 · TypeScript · MySQL · Python · Flask · scikit-learn · PayPal · Firebase
CodeCodeالشيفرة: multi-seller-marketplace ↗

01The problemLe problèmeالمشكلة

Online shopping is growing fast in Algeria, but the main platforms leave real gaps: no integrated online payment, prices not always shown, sellers not verified, or interfaces overloaded with ads. ShopO answers with a clean marketplace for electronics: verified sellers, visible prices, ratings and secure payment. Le e-commerce grandit vite en Algérie, mais les grandes plateformes laissent de vrais manques : pas de paiement en ligne intégré, des prix pas toujours affichés, des vendeurs non vérifiés, ou des interfaces chargées de publicités. ShopO y répond avec une marketplace claire pour l'électronique : vendeurs vérifiés, prix visibles, avis et paiement sécurisé.تنمو التجارة الإلكترونية بسرعة في الجزائر، لكن المنصات الكبرى تترك نقائص حقيقية: لا دفع إلكتروني مدمج، وأسعار غير معروضة دائماً، وبائعون غير موثَّقين، أو واجهات مكتظة بالإعلانات. يجيب ShopO عن ذلك بمتجر واضح للإلكترونيات: بائعون موثَّقون، وأسعار ظاهرة، وتقييمات، ودفع آمن.

02Three spacesTrois espacesثلاثة فضاءات

CustomersClientsالزبائن

Search and filters, product pages with reviews and recommendations, wishlist, cart, checkout with PayPal or cash on delivery. Sign-up is verified by an email code (OTP).Recherche et filtres, fiches produits avec avis et recommandations, liste d'envies, panier, paiement par PayPal ou à la livraison. L'inscription est vérifiée par un code envoyé par e-mail (OTP).بحث وتصفية، وصفحات منتجات مع تقييمات وتوصيات، وقائمة الأمنيات، وسلة، ودفع عبر PayPal أو عند الاستلام. ويُتحقَّق من التسجيل برمز يُرسل عبر البريد الإلكتروني (OTP).

SellersVendeursالبائعون

Apply to open a store, add products (each one waits for an admin's approval), and follow orders, revenue, a sales chart and payouts.Demander à ouvrir une boutique, ajouter des produits (chacun attend la validation d'un admin), et suivre les commandes, le chiffre d'affaires, un graphique des ventes et les versements.طلب فتح متجر، وإضافة منتجات (كل منتج ينتظر موافقة المشرف)، ومتابعة الطلبات ورقم الأعمال ومنحنى المبيعات والمدفوعات.

AdministratorsAdministrateursالمشرفون

Approve sellers and products, manage users, categories, orders and reviews, pay sellers their earnings, and get a push notification when a new product is submitted.Valider vendeurs et produits, gérer utilisateurs, catégories, commandes et avis, verser leurs gains aux vendeurs, et recevoir une notification quand un nouveau produit est proposé.قبول البائعين والمنتجات، وتسيير المستخدمين والأصناف والطلبات والتقييمات، ودفع أرباح البائعين، وتلقّي إشعار عند اقتراح منتج جديد.

Product page with recommended productsFiche produit avec les produits recommandésصفحة منتج مع المنتجات المقترحة

Seller dashboardTableau de bord vendeurلوحة تحكم البائع

Admin dashboardTableau de bord adminلوحة تحكم المشرف

Shopping cart — Cart with stock-aware quantitiesPanier qui tient compte du stockسلة تراعي المخزون

03The recommenderLe système de recommandationنظام التوصيات

A hybrid recommender written in Python and served as a Flask microservice. The Laravel API calls it and returns the results to the front end. The approaches were first explored in Jupyter notebooks on public Kaggle datasets. Un système de recommandation hybride écrit en Python et servi comme microservice Flask. L'API Laravel l'appelle et renvoie les résultats au front. Les approches ont d'abord été explorées dans des notebooks Jupyter sur des jeux de données publics Kaggle.نظام توصيات هجين مكتوب بـ Python ومُقدَّم كخدمة مصغّرة بـ Flask. تستدعيه الـ API المكتوبة بـ Laravel وتعيد النتائج إلى الواجهة. وقد جُرّبت المقاربات أولاً في دفاتر Jupyter على بيانات عامة من Kaggle.

PopularityPopularitéالشعبية

For new users with no history: the best-rated products that have enough ratings.Pour les nouveaux utilisateurs sans historique : les produits les mieux notés qui ont assez d'avis.للمستخدمين الجدد دون سجل: المنتجات الأعلى تقييماً التي تملك عدداً كافياً من التقييمات.

Content-basedBasé sur le contenuقائم على المحتوى

Descriptions and categories turned into word vectors and compared with cosine similarity, to show similar products.Descriptions et catégories transformées en vecteurs de mots et comparées par similarité cosinus, pour afficher des produits similaires.تُحوَّل الأوصاف والأصناف إلى متجهات كلمات وتُقارن بتشابه جيب التمام، لعرض منتجات مشابهة.

CollaborativeCollaboratifتعاوني

Users grouped with K-Means on their ratings; the number of groups is chosen with the elbow method and updated automatically.Utilisateurs regroupés avec K-Means selon leurs notes ; le nombre de groupes est choisi par la méthode du coude et mis à jour automatiquement.يُجمَّع المستخدمون بـ K-Means حسب تقييماتهم؛ ويُختار عدد المجموعات بطريقة الكوع ويُحدَّث تلقائياً.

04Architecture and designArchitecture et conceptionالبنية والتصميم

React + TypeScript
Single-page app with Tailwind CSS and shadcn/ui.Application monopage avec Tailwind CSS et shadcn/ui.تطبيق أحادي الصفحة مع Tailwind CSS و shadcn/ui.
Laravel APIAPI LaravelAPI بـ Laravel
Sanctum tokens, role middleware (client, seller, admin) and policies, over a MySQL database of 15+ tables.Jetons Sanctum, middleware de rôles (client, vendeur, admin) et policies, sur une base MySQL de plus de 15 tables.رموز Sanctum، و middleware للأدوار (زبون، بائع، مشرف) و policies، على قاعدة MySQL تضم أكثر من 15 جدولاً.
ServicesServicesالخدمات
Flask recommender, PayPal, Firebase Cloud Messaging for push notifications, and SMTP for verification and reset emails.Recommandation Flask, PayPal, Firebase Cloud Messaging pour les notifications, et SMTP pour les e-mails de vérification et de réinitialisation.التوصيات بـ Flask، و PayPal، و Firebase Cloud Messaging للإشعارات، و SMTP لرسائل التحقق وإعادة تعيين كلمة المرور.

UML class diagramDiagramme de classes UMLمخطط الأصناف UML

05What I learnedCe que j'ai apprisما تعلّمته

Designing a multi-role application: who can see and do what, enforced on the server, not only hidden in the interface.Concevoir une application à plusieurs rôles : qui voit et fait quoi, vérifié côté serveur et pas seulement caché dans l'interface.تصميم تطبيق متعدد الأدوار: من يرى ماذا ومن يفعل ماذا، مع التحقق في جهة الخادم وليس مجرد الإخفاء في الواجهة.
Connecting a web app to a Python machine-learning service, and to real third parties like PayPal and Firebase.Relier une appli web à un service de machine learning en Python, et à de vrais services tiers comme PayPal et Firebase.ربط تطبيق ويب بخدمة تعلّم آلي بـ Python، وبخدمات خارجية حقيقية مثل PayPal و Firebase.
Running a full project as a team, from UML design to the defense in front of a jury.Mener un projet complet en équipe, de la conception UML à la soutenance devant un jury.قيادة مشروع كامل ضمن فريق، من تصميم UML إلى المناقشة أمام لجنة.

Future work: delivery tracking with Algerian carriers, deep-learning recommendations, and a mobile app.Pistes : suivi des livraisons avec les transporteurs algériens, recommandations par deep learning, et une application mobile.آفاق: تتبّع التوصيل مع شركات النقل الجزائرية، وتوصيات بالتعلّم العميق، وتطبيق للهاتف.

Code on GitHubCode sur GitHubالشيفرة على GitHub ↗ ← All projects← Tous les projets→ كل المشاريع