Moodle is an open-source Learning Management System built on the principle of modularity. It contains all of the basic structures and features geared toward teaching and learning, however it also contains a long list of libraries/APIs that are useful and relevant to application development in general, such as database abstraction and migration, authentication methods, access control via capabilities, web services, search, job scheduling, caching, messaging, internationalization, file management, logging, debugging, and fundamentally, a plugin architecture with events for inter-plugin communication.
Having developed a number of Moodle plugins for educational institutions, I have found Moodle to be a mature and convenient platform that provides many of the foundational elements needed to develop, run, and manage applications. It occurred to me recently that the standard interface and many of the core features could be divorced from the whole, creating a more generic and headless framework for building applications. This may appeal to institutions that are already familiar with Moodle and anyone who wants to avoid the complex tooling and integration that is often required to establish the same baseline in other backend frameworks.
The plugin architecture of Moodle would be used as the way to add separate systems to the platform without affecting the normal Moodle upgrade path. The normal Moodle interface could be completely averted, allowing you to build systems on top of Moodle using a frontend framework of your choosing, such as Vue or React, which would interact with the platform via web services.
The initial idea:
- Install Moodle, disable plugins you don’t need.
- Create a new local plugin to bootstrap the new front-end layer and provide a web service gateway. The purpose of this plugin is to redirect users away from the Moodle interface once they’ve authenticated (using one of Moodle’s auth methods) to one of your custom applications (e.g. a custom dashboard).
A collection of modular tools or microsystems for schools built on Moodle as a headless backend.
- /platform: Bootstraps the microsystem platform and provides core services for other tools
- /example: An example of a tool
- /dashboard: The landing page for the platform – just another tool
- /excursions: The first real world tool and PoC for the platform. Uses Vite, React, Mantine, and TailwindCSS.
Each tool has the standard local plugin files needed by Moodle. The tool is then divided into:
- Frontend: the UI layer of the tool, using React for example.
- Backend: the API layer for the tool
- A fresh and working Moodle installation on Apache: https://github.com/moodle/moodle
rm -rf * #Remove all existing contents from local dir
git clone email@example.com:michaelvangelovski/edutools.git .
- Run the installation of the plugins via the browser.
<moodle_root_dir>/config.phpand add the following line to the bottom:
Access the example tool
- Access the example tool: <site_url>/local/example
npm install # this will install all of the front end dependencies
npm run dev # this command starts the development server
- Access the example tool again, dev scripts will be loaded, and live reload will be working: <site_url>/local/example
npm run build # this will build the frontend for production into /dist