Develop MagicMirror the easy way — all in one workspace

HeikoGr

start little ‘advertising’ … (this is what you get when you ask AI to promote your project…)

Stop juggling terminals and fighting file permissions. With MMM-DevContainer you can develop MagicMirror in VS Code using either Docker Compose or Dev Containers — your choice.

Why it’s better:

One workspace for everything: modules, config and css all in one place. No more multiple windows or scattered folders.
Works with Docker Compose and/or VS Code Dev Containers: pick the workflow that fits your setup.
No file-rights hassle: edit and save directly from VS Code without sudo/chmod pain (unlike editing inside a running MM Docker container - if you’ve ever tried that).
Reproducible, clean environment: consistent installs, easy onboarding, and less “it works on my machine.”
Great DX: built-in terminals, IntelliSense, debugging, and Git — all inside the container.
npm install runs automatically on first start, so you can get coding faster.
Get started: https://github.com/HeikoGr/MMM-DevContainer

Quick start

Clone the repo:
git clone --depth=1 https://github.com/HeikoGr/MMM-DevContainer.git
cd MMM-DevContainer
Add your module:
Create your module inside modules/YourModule (or add it as a Git submodule).
Keep MagicMirror core, your modules, and config together in this single workspace.
Choose your workflow from below:

Option A — Docker Compose
docker compose up --build
Open the app in your browser (e.g., http://localhost:8080)
Stop when done: docker compose down

Option B — VS Code Dev Container
Install VS Code + the “Dev Containers” extension.
Open the MMM-DevContainer folder in VS Code.
Reopen in Container when prompted (or use Command Palette: “Dev Containers: Reopen in Container”).

Notes:
At the moment it’s only testet on linux (or windows with ssh on linux…)
Dependencies: npm install runs automatically on first start (via the devcontainer/compose setup). If your module needs extra dependencies, you can still run npm install inside the container terminal.
All source folders are mounted into the container; edits happen from VS Code without permission issues.
Suggestions and feedback welcome!

Have ideas to improve the setup? Issues and PRs are very welcome.
Tell me what works well for you and what could be smoother.

schlomm

@HeikoGr This ist a great idea! I will test this out :)!

karsten13

@HeikoGr

Thanks! Your configuration inspired me to write down and update my own.

I don’t mean to hijack your thread, but since development environments are always a matter of personal preference, I thought I’d share this as an alternative.

HeikoGr

@karsten13 your docker container was/is a great source of inspiration and you are right: every developer needs an own setup. The more (good) alternatives exist - the easier it gets to start developing.

HeikoGr

Windows is working now! You need to install Linux (tested with default [according to WSL] Ubuntu and Debian) and Docker Desktop.

BGH_H

That’s a great help. I’m going to try this soon and fiddle around with it. Good job 👍🏻.