Static WiFi LED Visualizer
In no particular order.
- They open source their designs, so there are a lot of inexpensive off-brands.
- Generally cpp based
- Arduino compatible microcrontroller with WiFi.
- The one I usually get.
- Arduino library for controlling LED strips
4. WS2812B RGB LED strip
- The type of RGB LED strip used in most of our projects
- The one I usually get.
- The library for using WiFi on an ESP8266
- Generally a drop in replacement for the standard WiFi arduino library
6. Arduino IDE
- Recommended Arduino IDE
- I don't actually use this, instead I use VSCode with the Arduino extension. However that still requires this and is not full-fledged yet, I use it since it's my IDE of choice.
- Needs set up to work with ESP8266's
- The protocol I use for sending messages to wireless microcontrollers
- Uses a client / server architecture. Meaning it will need a server running on the network.
- Uses a "topic" subscription / publish method. ie (pseudo-code): subscribe("/this/is/a/topic", callbackFunction)
- The library used to interface the ESP8266 with MQTT
- The MQTT server I use. I have it on a VM, but it will work from a Raspberry Pi or such as well.
- A fantastic visual automation platform
- I use this despite being a web dev who could write my own automation scripts due to it's simplicity (and to make it accessible for friends who are not).
- The plugin I used to make the UI (I was in a hurry, but it ended up being good enough I never bothered to roll a custom one).
12. MQTT Explorer
- A good client for browsing + sending MQTT data while testing.
- Can technically control the lights so you don't need the node red stuff, but not recommended
Docs + Tutorials for the Above
17. Classes in Arduino (as in object oriented programming, not school)
18. The repository for this project. (Note this is private... Message me Adam for access).
General Web Development Basics
30. HTML (ie: what your browser downloads and renders - structured data-ish)
31. CSS (Styling the HTML)
35. Good free place to host static websites - Netlify
36. SEO basics (Side note: giant link-dumps like this page? Not so great for SEO).
37. Yes, I actually did 37 ;).
This is by no means comprehensive or particularly cohesive. But it should hopefully be enough to let you work on the static LED visualizer and point you in the right direction for some basic web development concepts. If you want something more structured, I'd recommend udemy courses (but I haven't done many, so hard to specifically recommend one). Or CodeAcademy for better free options.
Not built to any standard, but helpful to visualize how the above work together.