PenguinTutor YouTube Channel

Raspberry Pi Pico Web Based MP3 Player using DFPlayer Mini

Taking your microcontroller audio projects to the next level just got a lot more interesting. Building on my custom MicroPython library for the DFPlayer Mini, this project upgrades the setup with the wireless capabilities of the Raspberry Pi Pico 2W to create a fully functional, web-controlled MP3 player. Now, you can DJ your hardware builds directly from your smartphone or computer network. But the real magic lies in the web interface itself: rather than wrestling with clunky CSS or loading dozens of static image files, this build uses dynamically updated SVG files to cleanly and efficiently display the player's status. It is a smart, streamlined approach to building user interfaces on microcontrollers!

Adding Web Based IoT player capabilities to my DFPlayer Raspberry Pi Pico

I've previously explained how I created a MicroPython library for DFPlayer mini MP3 player for a Raspberry Pi Pico. I've also created a web based version which uses a Raspberry Pi Pico 2W and allows you to control the MP3 Player with your phone or computer.

DFRobot DFPlayerMini MP3 player with Micro SD Card connected to a Raspberry Pi Pico 2W

I've now expanded on this by programming a web server to run on the Raspberry Pi Pico 2W, which allows this to be used as a web based MP3 Player.

I've created web interfaces for the Raspberry Pi Pico before, but for this I tried something different. Could I have an SVG file and change the text dynamically. That sounded more interesting than manually creating a bunch of image files and avoids some of the pitfalls of trying to do that using CSS. It turns out that I could and I included that in the video.

Web interface for a Raspberry Pi Pico 2W with DFRobot DFPlayer Mini MP3 Player

The SVG file has a token used in place of the title, and the web page code replaces that with the appropriate title.

Source code

You can download the source code from github.

Related projects

I eventually intend to use this as part of a model railway layout providing sounds for the station building. See the link below for more details of model railway projects.

To see future updates please:
Subscribe to the PenguinTutor YouTube Channel

Previous Pico MP3 player
Pico MP3 player Next Pico Reindeer MP3 player
Pico Reindeer MP3 player