Skip to content

Moodle Playground

Moodle Playground

Moodle running entirely in your browser using WebAssembly. No server required.

What is this?

Moodle Playground lets you run a full Moodle LMS instance in your browser for learning, testing, and prototyping course experiences. Everything runs locally — no installation, no server, no data leaves your machine.

The runtime is fully ephemeral: all state lives in memory and is lost when you close the tab.

Default credentials: username admin, password password.

How it works

The project follows a layered architecture:

  1. Shell UI (index.html + src/shell/main.js) — toolbar, URL bar, iframe host, runtime logs
  2. Runtime host (remote.html + src/remote/main.js) — registers the service worker and hosts the playground iframe
  3. Request routing (sw.js + php-worker.js) — intercepts requests and routes them to the PHP runtime
  4. PHP/Moodle runtime (src/runtime/*) — boots Moodle via @php-wasm/web and serves HTTP requests through a bridge
  5. Generated assets (assets/moodle/) — prebuilt ZIP bundle with Moodle core (extracted into writable MEMFS at runtime)

Quick start

# Clone the repo
git clone https://github.com/ateeducacion/moodle-playground.git
cd moodle-playground

# Install and build
npm install
make prepare
make bundle

# Start the dev server
make serve

Then open http://localhost:8080 in your browser.

Features

  • Full Moodle 4.4 / 5.0 running in WebAssembly
  • PHP 8.1 to 8.5 support (version depends on Moodle branch; default: 8.3)
  • SQLite database via experimental PDO driver patch (in-memory, no persistence needed)
  • Pre-built install snapshot for fast boot (~3s vs ~8s full install)
  • Step-based blueprint system for provisioning users, courses, enrolments, modules, and more
  • Works on GitHub Pages with subpath support

CI/CD and GitHub Actions

The project includes a reusable GitHub Action for generating live PR previews of Moodle Playground:

  • action-moodle-playground-pr-preview — Deploys a temporary Moodle Playground instance for each pull request, allowing reviewers to test changes in the browser before merging.

The main CI/CD pipeline (.github/workflows/ci.yml) handles linting, unit tests, E2E tests (Chromium + Firefox), and deployment to GitHub Pages on push to main.

Made with ❤️ by Área de Tecnología Educativa