T voor Taal: Modular Language-Learning Platform

Bespoke Dutch-tutoring platform — composable programmes, batch cohorts, and a gated student portal with a built-in visual course editor.

Website

Overview

T voor Taal is a production language-learning platform built for a private Dutch trainer. The trainer authors a reusable content library once, composes it into programme templates, runs those programmes as batch cohorts, and controls exactly what each student can see — per cohort or per individual.

Students get a clean portal showing only their current learning path: released modules are open, upcoming ones are visibly locked.

Domain Model

Library (reusable)          Programme (template)      Batch (instance)      Student
Topic / Lesson              modules: [                releasedModuleKeys    Enrollment
VocabItem / Phrase            { key, order,     ─runs─→                      • extraModuleKeys
                                topicIds[],                                  • status
                                vocabIds[],
                                phraseIds[] } ]

The core visibility rule is a single set union, written once:

visibleModules(student, batch) = batch.releasedModuleKeys ∪ enrollment.extraModuleKeys

Content is composed by reference — the same vocab item can appear in any number of programmes; editing it once updates everywhere. Nothing is duplicated, nothing is destroyed by re-composition.

Visual Course Editor

The trainer previously designed course material in Canva and pasted screenshots. The platform now embeds an MIT-licensed Excalidraw canvas:

  • Scene JSON persisted per design in MongoDB
  • Any canvas element can carry an expander annotation (customData): a label, a hover explanation, and an optional deep link to another module
  • Students see published designs rendered as responsive SVG with pulsing hotspots — hover explains the word or phrase, click jumps to the linked module (lock-aware)

Library selection was licensing-driven: Excalidraw (MIT) over tldraw ($6k/yr commercial) and Polotno ($899/mo).

Engineering Notes

  • Auth: Clerk with role claims in the session token, plus a Backend-API fallback path; self-healing student provisioning removes the signup webhook as a single point of failure
  • Server/client split: content pages are React Server Components querying Mongoose directly; interactive surfaces (editor, admin CRUD) are client components on TanStack Query
  • Release safety: unpublishing or unreleasing hides content without deleting anything; stale module references are filtered at read time
  • Stack: Next.js 15 App Router, React 19, TypeScript, MongoDB Atlas, Vercel