Skip to content
ulamsulamsulams docs

Legacy React learner app

front/src (workspace front) is the learner app that came with Wellms: a React 18 single-page app built with Vite, styled with CSS Modules and the --ulams-* theme variables. It is still in the repository and still works, but it is no longer the default learner site.

Status

Section titled “Status”

ADR 0008 replaced it with the server-rendered reference frontend (front/web) for the demo academies: the React app downloaded several hundred KB of JavaScript and waited for the API before painting anything. The ADR keeps both frontends “until the reference app reaches parity with front/src (cart and checkout, account area, webinars, consultations); the old front stays for those.”

In practice:

  • Caddy sends *.app.localhost to the reference frontend; the React app is reachable directly on port 3000: http://localhost:3000 for the platform and http://<slug>.app.localhost:3000 for a tenant. Start it with corepack yarn dev or corepack yarn dev:front.
  • It is still built and published as the ghcr.io/ulams-dev/front image.
  • New learner features go into the reference frontend.

What it still does that the reference frontend does not

Section titled “What it still does that the reference frontend does not”
Area Routes in the React app
Course catalogue and tutors /courses, /tutors, /tutors/:id
Registration, e-mail verification, password reset, onboarding /register, /email-verify, /reset-password, /onboarding
Cart and checkout (Stripe), packages and subscriptions /cart, /packages, /package/:id, /subscriptions
Webinars, in-person events, and consultations with slot booking /webinars, /webinar/:id, /events, /event/:id, /consultations, /consultations/:id
Profile and learner area /user/my-profile, /user/my-data, /user/my-certificates, /user/my-orders, /user/my-subscriptions, /user/my-notifications, /user/my-tasks, /user/my-bookmarks, /user/my-webinars, /user/my-stationary-events, /user/my-consultations
Certificate PDFs Downloaded from “My certificates” and the course finish page (GET /api/pdfs/generate/{id})
Notes and bookmarks in the player See notes and bookmarks
Project uploads Learners upload their solution file in project topics
Static pages, contact, privacy policy /:slug, /contact, /privacy-policy

It also contains the Capacitor (iOS and Android), Firebase push notification, RevenueCat, Jitsi and Sentry integrations inherited from Wellms.

Shared with the reference frontend

Section titled “Shared with the reference frontend”
  • The course page (/courses/:id), the course player (/course/:id/:lessonID?/:topicID?) and a preview player (/courses/preview/:id/...).
  • Per-tenant landing pages for the first three demo academies (src/pages/landing/{coffee,oncall,nightsky}); gravity, poland and ulam are reference-frontend only and fall back to the coffee design.
  • Tenant detection from the browser host with the same host rule (VITE_APP_TENANT_API_HOST_PATTERN, default {slug}.app.localhost=>http://{slug}.localhost).
  • Demo mode: on a demo tenant it reads ulams_demo from GET /api/config and logs in as the demo student by itself.
  • LTI tool launches: its own /lti/launch page exchanges the one-time code like the reference frontend does (see arriving from another LMS).

Topic types

Section titled “Topic types”

The React player renders H5P, embeds, rich text, video, image, audio, PDF, SCORM, LTI external tools, GIFT quizzes and projects. It has no player for cmi5 and LiaScript topics; for those it shows the topic’s raw type name. Use the reference frontend for courses with those types.