How We Built It

The technical deep dive. For developers, IT folks, and the curious.

Toby the Tortoise

Tech Stack

Frontend

Astro + React

Static-first with React islands for interactivity. SEO-friendly HTML output.

Hosting

Static Site

No backend needed. Simple, fast, scalable.

Styling

CSS with CSS Variables

No frameworks. Just clean CSS with a design system.

Why Astro?

We migrated from a React SPA to Astro for better SEO. Here's what changed:

🔍
The Problem: SPAs are invisible to search engines

Our React SPA served the same empty HTML shell for every URL. Google couldn't see unique titles, descriptions, or content - just JavaScript that needed to run first.

🏝️
The Solution: Astro's Island Architecture

Astro pre-renders 91 static HTML pages with full SEO meta tags. React components only hydrate where interactivity is needed (tabs, quizzes, progress tracking).

What Google Now Sees

Each of our 91 pages has unique titles, descriptions, Open Graph tags, Twitter cards, and canonical URLs. Primary 3 Maths has different meta tags than Primary 5 Science.

91 Static HTML Pages
5.84s Build Time
100% SEO Coverage

The 5-Stage Pipeline

All content flows through a numbered pipeline. Stages 3 & 5 provide dual-source choice for P3-P6.

1

Collection

Gather raw materials: 202 MOE syllabus PDFs and 10,769 exam papers from 100+ Singapore schools. Convert everything to markdown via OCR.

2

Analysis

LLM interprets syllabuses into per-level files. Extract 850+ question templates from exam papers. Enrich syllabuses with exam insights.

↙ ↘
3

📚 Exam-Derived

Generate quizzes and exams using templates extracted from real papers. P3-P6 only (exams exist).

Available: Yes for P3-P6
VS
5

🤖 LLM-Inferred

LLM generates templates from syllabus. Covers P1-P2 (no exam data) and supplements P3-P6 with fresh variations.

Available: All levels

Syllabus Processing

202 MOE syllabus PDFs converted to structured markdown, then split into 128 per-level files.

202 Syllabus PDFs
128 Per-Level Files
P1-P6 Levels Covered
📚
Level-specific files

Each level gets exactly what they need. Math syllabus covers P1-P6, but we split it into 6 separate files for easier consumption.

🔬
Science starts at P3

Science is not taught in P1-P2. Our pipeline respects this - no science content for those levels.

Exam Paper Analysis

We analyzed exam papers from Singapore schools to understand real assessment patterns.

~38,000 Questions Analyzed
850+ Question Templates
P3-P6 Exam-Derived Content

We extract question patterns, not questions. Templates teach AI to generate unlimited fresh practice - no recycled content.

Generated Content

From the pipeline, we generate textbooks, cheatsheets, parent guides, quizzes, and exam papers.

22 Textbooks
20 Cheatsheets
30 Parent Guides
369 Quiz Files
1,024 Exam Files
1,384 Audio Transcripts

Total: 2,859 AI-generated files covering Maths, Science (P3+), English, Chinese, and Higher Chinese.

AI Models Used

🧠
Claude Sonnet 4 for content generation

High-quality textbooks, quizzes, and exam papers. Understands Singapore context and age-appropriate language.

🔧
Claude Haiku 4.5 for template extraction

Fast, cost-effective for bulk processing. Good at recognizing question structure.

📐
DeepSeek R1 for complex reasoning

Geometry proofs, physics problems, multi-step calculations. When you need to show your working.

🔊
Azure Neural TTS for audio lessons

Singapore English (en-SG) and Mandarin Chinese (zh-CN) voices. Custom pitch and rate settings per character for natural-sounding dialogue.

Lessons Learned

Match Model to Task

Don't use one AI for everything. Mistral for English OCR, Gemini for Chinese, Claude for generation, DeepSeek for math reasoning.

Understand Local Context

Singapore education has unique features: no P1-P2 exams, Science starts at P3, specific assessment types. Respect these constraints.

Templates Beat Examples

Extract patterns, not just content. A good template generates infinite practice questions. Raw examples are one-and-done.

Static for SEO

SPAs are invisible to search engines. Pre-render HTML with Astro, use React islands only where interactivity is needed.

Open Source

We're considering open sourcing the tools and processes used to build this. Stay tuned.

Questions?

Curious about the technical details? Want to contribute? Get in touch.

Email Us

[email protected]