OVERVIEW
Being able to control or get information from your projects using WiFi is something that we all want to experiment with at some time or another.
An easy way to start, is using a development board that has WiFi built into it like the NodeMCU dev boards.
The NodeMCU is built around the popular ESP8266 WiFi module.
Using the NodeMCU makes it easy to connect and use the capabilities of the ESP8266 as well as use the Arduino IDE we are familiar with to upload sketches.
As we make more tutorials using the NodeMCU boards we will go into more details on how these work, what inputs and outputs are available and the different ways you can program them.
In this first part we will control a Pixel stick (WS2812B) through a webpage to turn on and off, change the colours and we will use the Arduino IDE to program the NodeMCU.
PARTS USED
WS2812 RGB Stick
NODEMCU V2
These are Amazon affiliate links...
They don't cost you anything and it helps me keep the lights on
if you buy something on Amazon. Thank you!
NODEMCU INTRODUCTION
We will be looking at two versions of the NodeMCU board: Version 2 and Version 3:
As you can see from the picture above, Version 3 (top) is a little bigger than Version 2 (bottom), also V3 of the NodeMCU board uses the CH340G USB to serial chip compared to V2 which uses the CP2102 serial chip.
Doesn’t make much of difference which one is used as long as you load the correct driver.
Version 2 also includes an extra LED onboard.
The pin out of both boards are pretty much the same except that V3 has one more Ground pin and also provides a USB power Out pin as you can see in the diagram below.
CONNECTIONS
The connection for this tutorial are pretty minimal as you can see from the schematic.
To power the WS2812 Pixel Stick, we are using the 3.3V and GND pins of the NodeMCU.
The RX pin or D9 of the NodeMCU is connected to the D1 (Digital In) of the WS2812 Pixel Stick.
*Note: Since we are only using one WS2812 Pixel Stick we can power it using the NodeMcu.
In future tutorial we will use an external power supply since we will be using more LEDs..
THE CODE
We are using the NeoPixelBus library to control the WS2812 RGB Pixel stick.
You can find a link to download the library at the bottom of this tutorial page.
To install the NodeMCU board in the Arduino IDE you will need to go to:
FILE –> PREFERENCES — >
and add the following information in “Additional Boards Manager URLs:”
http://arduino.esp8266.com/stable/package_esp8266com_index.json
The code below will connect to a WiFi network and then create a webpage that will have 2 buttons to select which colors you want to display.
Remember to replace the “xxxxxxx” in the code with your own WiFi network name and password.
You can open the Serial Monitor windows at startup to see which IP is given to the NodeMCU by the WiFi network.
We will go into more detail and complexity in future tutorials using the NodeMCU.
As always, Don’t forget to watch our Tutorial video for more information.
#include "NeoPixelBus.h" // Library to control Pixel Stick
#include "ESP8266WiFi.h" // WiFi Library
#define PixelCount 8 // Number of leds on stick
#define PixelPin 2 // NodeMCU pin 2 (RX) connected to Digital In of Pixel Stick
const char* ssid = "xxxxxxx"; // Name of WiFi Network
const char* password = "xxxxxxx"; // Password of WiFi Network
int firstrun = 0; // Check if system was just powered on
int buttonpressed = 5; // To hold which button was pressed on Web Page
// Initialize Library
NeoPixelBus<NeoGrbFeature, Neo800KbpsMethod> strip(PixelCount, PixelPin);
// Define Arrays for colors
long switchled00[] =
{
0x0E5219, 0x52160E, 0x0E5219, 0x52160E,0x0E5219,0x52160E,0x0E5219,0x52160E
};
long switchled01[] =
{
0x19257B, 0x7B7A19, 0x19257B, 0x7B7A19, 0x19257B, 0x7B7A19, 0x19257B, 0x7B7A19
};
WiFiServer server(80); // Define Web Server Port
void setup() {
Serial.begin(115200);
delay(10);
strip.Begin(); // Init of Pixel Stick
strip.Show(); // Clears any lit up Leds
// Connect to WiFi network
Serial.print("Connecting to ");
Serial.println(ssid);
WiFi.begin(ssid, password);
// Wait until connected to WiFi
while (WiFi.status() != WL_CONNECTED) {
delay(250);
Serial.print(".");
}
// Confirmation that WiFi is connected
Serial.println("");
Serial.println("WiFi connected");
// Start the Web Server
server.begin();
Serial.println("Web Server Started");
// Display IP address
Serial.print("You can connect to the Server here: ");
Serial.print("http://");
Serial.print(WiFi.localIP());
Serial.println();
Serial.println();
}
void loop() {
// Check if someone is connected
WiFiClient client = server.available();
if (!client) {
return;
}
// Read which button was pressed on the Web Page
String request = client.readStringUntil('\r');
// Light Up leds based on the button pressed
if (request.indexOf("/REDGREEN=1") != -1) {
for (int led = 0; led < 8; led++) {
strip.SetPixelColor(led, HtmlColor(switchled00[led]));
}
strip.Show();
buttonpressed = LOW;
firstrun=1;
}
if (request.indexOf("/BLUEYELLOW=1") != -1) {
for (int led = 0; led < 8; led++) {
strip.SetPixelColor(led, HtmlColor(switchled01[led]));
}
strip.Show();
buttonpressed = HIGH;
firstrun=1;
}
// Create Web Page
client.println("HTTP/1.1 200 OK"); // HTML Header
client.println("Content-Type: text/html");
client.println("");
client.println("<!DOCTYPE HTML>");
client.println("<html>"); // Start of HTML
client.println("<style>");
client.println("body {background-color: #ACAEAD;}"); // Set Background Color
client.println("</style>");
if (firstrun == 0) {
client.print("Please Click a Button ");
}
else {
client.print("Last Button Pressed was ");
}
if(buttonpressed == LOW) {
client.print("Red & Green");
}
if (buttonpressed == HIGH){
client.print("Blue & Yellow");
}
client.println("<br><br>");
client.println("<a href=\"/REDGREEN=1\"\"><button>Red & Green </button></a>");
client.println("<a href=\"/BLUEYELLOW=1\"\"><button>Blue & Yellow </button></a><br />");
client.println("</html>");
delay(10);
}TUTORIAL VIDEO
DOWNLOAD
Copy the above Sketch code in your Arduino IDE software to program your NodeMCU board.
Used Libraries:
Download The NeoPixel Library
created by ‘Makuna’ :
Once downloaded, just extract the content of the zip files inside your “arduino/libraries” folder, and make sure to restart the Arduino IDE (Close and Reopen) software so it detect this newly installed library.