Details and code are covered by an agreement: I describe the problems and solutions without exposing internals.
Two applications of one product: a public course storefront with server rendering and a catalogue, and an internal learning platform with user workspaces, analytics and an admin panel for teachers.
What I did
A public storefront on the Next.js App Router: server-rendered catalogue and course pages
Course metadata is assembled on the server from entity data instead of being injected on the client
Catalogue with filters, collections, experts and events
Workspaces for three roles: student, teacher, administrator
Analytics on users, courses and the platform in charts
Context
The product
The platform covers the whole path: a user finds a course in the public catalogue, buys it and continues learning in a personal workspace, while a teacher maintains the content and grades submissions.
The public and internal parts are deliberately separate: the storefront needs server rendering and indexing, the workspace needs a rich interface and fast section switching.
Solution
The solution
The course catalogue is served from the server, and the student, teacher and administrator workspaces share one structure. New sections follow the same pattern as the ones already there.
Outcome
The outcome
The storefront is indexable and loads fast, while the three role workspaces live in a shared architecture where a typical CRUD task follows one pattern.
This project became my reference for the FSD + MobX + DI combination, which I later carried into other team products.
FlagshipProductUnder NDA