Introduction: Change RGB LED Connected to ESP12E From Web Page Using Knob
Change RGB LED connected to ESP12E NodeMCU from Web Page using knob - Breadboard Setup is the first part of this lesson. In this lesson we are going to setup the breadboard with an ESP12E NodeMCU module with a Groove RGB Chainable LED V1.0. We will also create a web page with three knobs for controlling the three colors. I hope that you already have all the components ready for this tutorial which I specified in the introduction phase. So lets start.
Step 1: Breadboard Connection
Make pin connections as specified in the image. Tally your breadboard circuit with the circuit diagram provided in the image.
Step 2: Programming ESP12E NodeMCU
Now download this repository and copy paste this into a new arduino sketch. Make sure you make changes in
https://github.com/vikkey321/Change-RGB-LED-connec...
const char* ssid = "your wifi user name"; //Replace your wifi user name
const char* password = "your wifi password"; //Replace your wifi password
Where you have to replaced the wifi username and password with your own credentials. And flash the ESP12E NodeMCU module with the code. Copy the IP address of your ESP12E NodeMCU module which you will find in serial terminal.
Then test it in the browser before making the HTML page.
Copy the IP address and replace it with "xxx.xxx.xx.xx" in the following url and copy the whole url. http://xxx.xxx.xx.xx/arguments?r=10&g=10&b=10
And then paste it in the browser and hit enter. If everything is alright then you will get the following output and your RGB LED should lit up with a color like show in the image.
Step 3: Make the HTML Page With Knobs
Simply go to the below repository and download the whole file.
https://github.com/vikkey321/Change-RGB-LED-connec...
and inside the folder edit "index.html" and make the following changes:
Replace your IP(IP of ESP12E NodeMCU which you found in serial terminal) with the default variable
Example : xxx.xxx.x.xx to 192.168.0.0
var ip = "xxx.xxx.x.xx"
and hit save.If everything is good then your output should look like as shown in the video.
Hope you like my tutorial :)
My original Project here :