Web-based VS Code MicroPython dev environment in a Docker Container

[DavesCodeMusings]

MicroPython VS Code Dev Environment in a Web Browser

Quick take:

It's a Docker container that combines VS Code code-server, with MicroPython tools and some VS Code extensions, to create a web-based development environment for microcontrollers that runs well on something as low-powered as an old Raspberry Pi 3.

https://github.com/DavesCodeMusings/school-coding-lab/tree/main/rpi/code-server

Why?

My goal was to create something I could use to introduce middle school students to programming and Internet of Things (IoT). The chromebooks that most schools have are too locked down to be of any use for this. So enter the lowly box of donated Raspberry Pi 3s.

Technically the Pi 3 can run Raspberry Pi OS desktop and Thonny, but it's not an experience I would wish upon anyone. It does, however, have enough power to run Docker and Nginx on top of Raspberry Pi OS Lite. And it's pretty responsive.

How do you use it?

If you just want the code-server, have a look at the Docker Compose file and modify it for your needs. You can run it on any ARM64 or x86-64 platform that can run Docker.

If you want to dip into the whole Raspberry Pi 3 web-based development workstation thing, keep reading.

The larger project hosts the containerized VS Code server on a Pi 3 that functions as an isolated WiFi hotspot. Students pair up and connect their chromebooks to one of the Pi SSIDs. From there, they go to an Nginx-hosted web site that has links to VS Code code-server and HTML lab manuals.

Simple MicroPython programs are available in VS Code from the pre-installed code samples. The students modify the code to achieve the goal stated in the lab. But they are also encoraged to "color outside the lines" and come up with their own scenarios. This is the best part!

Bonus automation!

There's a whole metric ton of Ansible automation in the project to make bare Pi 3s into workstations with a minimum of fuss. Honestly, it takes longer to explain the Raspberry Pi Imager options than it does to configure all the pieces after that.

Two commands, baby! That's it!

admin@pi3:~ $ wget https://raw.githubusercontent.com/DavesCodeMusings/school-coding-lab/main/rpi/fleet-automation/quickstart_dev_workstation.sh
...
Saving to: ‘quickstart_dev_workstation.sh’

admin@pi3:~ $ bash ./quickstart_dev_workstation.sh
--2025-04-15 08:03:30--  https://github.com/DavesCodeMusings/school-coding-lab/raw/main/rpi/fleet-automation/install_ansible.sh
Resolving github.com (github.com)... 140.82.112.3
...

Where's it going?

After having the opportunity to beta test on a group of students, I'll be making some changes the labs. Addressable LEDs (NeoPixels) were a big hit, so I'll probably focus more on that. Measuring GPIO voltages was the least interesting, so I'm going to move that to an optional lab.

Also, the LED traffic lights I bought are kind of sad in terms of uniform brightness. I may KiCAD up some of my own and see if I can do better.

And there's some automation and documentation clean-up to do.

Where will you take it?

If you find any of this interesting, I'd be curious to know what you would do with it.