AYJI is an educational Single Page Application offering a complete student space (dashboard, course catalog, interactive quizzes) and an admin back office. Built with Angular 19 and NgRx for robust state management, it integrates Socket.io for real-time notifications.
Objective
Build a modern and accessible LMS alternative to expensive foreign platforms
02
Frontend architecture
AYJI · Frontend responsibility map
01 · Learning interface
Angular 19
Courses
Quizzes
Progress
02 · State management responsibilities
NgRx
Store
Centralized application state
Effects
Side effects and async work
Entity
Helpers for record collections
03 · Reactive asynchronous flows
RxJS
Reactive streams and event composition
04 · Real-time notifications
Socket.io-client
Real-time WebSocket event transport
Frontend responsibilities based on the documented stack. Four layers distinguish feature interfaces, state management, asynchronous streams and real-time delivery without implying runtime wiring or backend architecture.
03
Features
Student dashboard with progress and learning statistics
Course catalog with intuitive navigation and advanced filtering
Embedded PDF reader and optimized course interface
Interactive quizzes (MCQ) with automatic correction and instant feedback
Centralized state management with NgRx (Store, Effects, Entity)
Real-time notifications with Socket.io-client
Full back office for managing users and content
Responsive interface (Desktop, Tablet, Mobile) with SCSS
Reactive programming: extensive use of RxJS for async flows
WebSockets & real-time: integrating Socket.io for notifications
Angular best practices: lazy loading, guards, interceptors, modular design
Your privacy choice
The site works without audience measurement. You may allow optional Vercel visit and performance measurement, or refuse it. No measurement script is enabled before you agree.
