In Progress2025 – Present

Orionto – Moroccan School Orientation & Education Platform

A comprehensive multilingual education platform connecting students with schools, counselors, and learning resources through real-time communication, gamification, and AI-powered recommendations.

Role: Full-Stack Developer

Client: Personal / Independent SaaS Project

Orionto – Moroccan School Orientation & Education Platform

Problem

Moroccan students face significant challenges navigating educational pathways — choosing the right secondary school specialization, finding suitable universities, preparing for exams, and connecting with qualified counselors. Existing solutions are fragmented across websites, WhatsApp groups, and offline consultations, making it difficult to access reliable orientation guidance, track applications, and make informed decisions about their academic future.

Solution

Orionto is a comprehensive education platform that centralizes the entire school orientation journey for Moroccan students. Students discover schools through interactive maps, browse scholarships, prepare for exams with timed simulators, learn through structured paths, and connect with certified counselors via real-time chat and booked sessions. A gamification system keeps students engaged with XP, levels, streaks, and achievements. Workers (counselors) manage their student load with KPI dashboards, while admins oversee the entire platform with comprehensive moderation, reporting, and configuration tools — all available in French, Arabic, and English.

Tech Stack

PHP 8.3Laravel 13Laravel SanctumSpatie Laravel PermissionGoogle2FANext.js 16.2React 19.2TypeScriptTailwind CSS v4shadcn/uiFramer MotionGSAPLottie ReactCanvas ConfettiZustandTanStack React QueryAxiosReact Hook FormZodnext-intlSocket.IO ClientLeafletRechartsTipTap@dnd-kitDriver.jsnext-themesPostgreSQL 16Redis 7RabbitMQ 3.13MinIO (S3-compatible)Socket.IO ServerStripe SDKDocker Compose

Architecture

Laravel 13 REST API Backend with 200+ Endpoints
Next.js 16 App Router Frontend with Locale-Based Routing
Real-Time WebSocket Server (Socket.IO + RabbitMQ)
Role-Based Access Control (Student, Worker, Admin)
Pack-Based Feature Gating Middleware
Multi-Database Architecture (PostgreSQL + Redis)
RabbitMQ Event Bridge to WebSocket
MinIO S3-Compatible Object Storage
Laravel Sanctum Token Authentication
Zustand Client State + React Query Server State
15-Theme System with Premium Gating
Trilingual i18n (French, Arabic RTL, English)
Recommendation Engine with 4-Factor Scoring
Gamification Engine (XP, Levels, Streaks, Achievements)
Smart View Tracking with Deduplication
Docker Compose Deployment (8 Services)
Role-Based Layout System with Sidebar Navigation
Real-Time Notifications and Presence Tracking
Document Management with Type Bundles
Multi-Gateway Payment Processing

Features

• Multilingual support (French, Arabic RTL, English)

• Three-role system (Student, Worker/Counselor, Admin)

• JWT authentication with Laravel Sanctum

• Two-factor authentication via Google2FA

• Google OAuth social login

• Password strength validation via HIBP API

• Student onboarding wizard (branch, interests, cities)

• School directory with interactive Leaflet maps

• School filtering, comparison, and branch matching

• Scholarship listings and discovery

• City guides for Moroccan cities

• Structured learning paths with lessons and quizzes

• Learning certificates on completion

• PrepHub exam preparation materials

• Exam archive with timed simulator

• Book library with reading lists and reviews

• Application tracking system

• Counseling session booking, confirmation, and rating

• Real-time chat with Socket.IO (typing indicators, reactions, file upload, pinning)

• Community Q&A platform with voting and best answers

• Task management system

• Document management with type bundles

• Calendar with event scheduling and iCal export

• Orientation roadmap generator

• Gamification engine (XP, levels, streaks, achievements, leaderboards)

• Animated streak flame with GSAP effects

• Canvas confetti celebration effects

• 15 customizable UI themes (3 free, 12 premium)

• Dark/Light/System mode toggle

• Driver.js onboarding tours

• Command palette (⌘K)

• Real-time notifications via WebSocket

• Online presence tracking

• Bookmark system with playlists

• Support request submission

• Pack-based feature gating

• Stripe payment integration

• Multi-method payments (transfer, stripe, cash, cashplus)

• Transaction history and receipts

• Worker counselor dashboard with KPIs

• Round-robin student distribution to counselors

• Admin user management (CRUD, ban, suspend)

• Admin school management with logo upload

• Admin worker management with performance metrics

• Admin announcement management

• Admin community moderation (groups, posts, reports)

• Admin financial pack and payment management

• Admin reports (enrollment, payment, application stats)

• Admin platform settings (general, branding, integrations, security)

• Admin feature gate management

• Admin data export

• Interest category and preference management

• Rich text editor with TipTap and i18n tabs

• Drag-and-drop with @dnd-kit

• Responsive mobile-first design

• Role-based sidebar navigation with unread badges

• Notification dropdown with real-time updates

• Microservices Docker Compose deployment (8 services)

• RabbitMQ message broker for event bridging

• Redis caching layer

• MinIO S3-compatible object storage

• PostgreSQL 16 database

• Recommendation engine with 4-factor scoring

• Smart view tracking with deduplication

About this project

Orionto is a comprehensive Moroccan school orientation platform built with a Laravel 13 backend and Next.js 16 frontend. The platform serves three distinct user roles — Students seeking educational guidance, Workers (counselors) providing professional advice, and Admins managing the entire ecosystem.

Students register and complete an onboarding wizard selecting their branch, interests, and preferred cities. They discover schools through an interactive map powered by Leaflet, browse scholarships, explore city guides, and prepare for exams using a timed simulator with archived past papers. The platform offers structured learning paths with lessons, quizzes, and certificates, along with a book library for supplementary reading.

Real-time communication is central to the experience. Students connect with counselors through Socket.IO-powered chat with typing indicators, reactions, file uploads, and message pinning. They book counseling sessions, track applications, manage documents, and participate in a community Q&A platform where they can vote on answers and mark best responses.

The gamification engine keeps students engaged through XP accumulation, level progression, daily streaks with animated flame effects, and achievement badges. Leaderboards foster healthy competition, while a recommendation engine uses 4-factor scoring to suggest relevant schools and resources.

Workers (counselors) access a dedicated dashboard with KPIs, student lists, and performance metrics. They manage sessions, review documents, handle support requests, and moderate community content. Round-robin distribution ensures fair student allocation across counselors.

Admins oversee the platform through a comprehensive management console covering user administration, school management, worker oversight, announcement management, community moderation, financial pack and payment management, analytics reporting, platform settings, and feature gate configuration.

The platform is fully internationalized in French, Arabic (with RTL support), and English, with 15 customizable UI themes (3 free, 12 premium). The backend runs on Docker Compose with 8 services including PostgreSQL, Redis, RabbitMQ, MinIO, and a Socket.IO WebSocket server bridged through RabbitMQ events.

Challenges

Building a trilingual platform with full Arabic RTL support
Implementing real-time WebSocket communication with RabbitMQ event bridging
Designing a gamification engine with XP, levels, streaks, and leaderboards
Creating a recommendation engine with 4-factor scoring algorithm
Building role-based dashboards for 3 distinct user types
Implementing pack-based feature gating across the platform
Integrating multiple payment methods (Stripe, transfer, cash, cashplus)
Building an exam simulator with timed sessions and scoring
Managing 65+ database models across the backend
Implementing real-time chat with reactions, file uploads, and message pinning
Designing 15 customizable themes with premium gating
Coordinating Docker Compose deployment with 8 infrastructure services
Building a community Q&A platform with voting and moderation
Implementing smart view tracking with deduplication across the platform
Managing Socket.IO presence, notifications, and chat simultaneously
Creating an onboarding wizard with branch, interest, and city selection

Results

Comprehensive education platform with 200+ API endpoints
Real-time communication with Socket.IO and RabbitMQ
Trilingual support with Arabic RTL compliance
Engaging gamification system with XP and streaks
Three distinct role-based dashboards
15 customizable UI themes
Interactive school discovery with Leaflet maps
Exam preparation tools with timed simulator
Community Q&A platform with moderation
Multi-method payment processing
Scalable Docker Compose deployment with 8 services
Production-ready frontend with Next.js App Router

GitHub · Private Source code : Frontend GitHub · Private Source code : Backend