Remote LED control with web management panel


This example shows on how to turn ESP8266 WiFi module into a web server that shows a simple console to control an LED. A console is going to be an HTML page that sits on ESP8266. It is going to have a piece of JavaScript code that makes a RESTful call to the ESP8266 module to either set or get LED status. In the ESP8266 firmware code, we are going to write a piece that handles a RESTful call.


For writing a firmware code, we are going to use Mongoose IoT, which is an open source framework for developing professional-grade connected solutions. Mongoose Firmware helps us to run a web server and connect to the WiFi network.


Hardware setup

Connect LED to the pins marked D5 (which is GPIO 14) and GND on the NodeMCU, just like it is shown on the cover image.


Writing a RESTful server on ESP8266

Once a NodeMCU board is connected to your computer via the USB cable, it's time to write the firmware. Download firmware management tool miot from .Create an empty directory, and start a command line console in that directory. Run the following miot commands to login to Mongoose IoT cloud-based build system and initialise firmware directory:

That is going to create necessary files and directories. Now let's write a RESTful server. Open src/app.c in your editor and copy-paste this code in:

Now, build the firmware by running

Built firmware is save as build/ Let's flash it:

miot dev flash -fw build/ -port /dev/ttyUSB0

Note that the port /dev/ttyUSB0 is typical for Linux systems. On Windows, you might be using COM1, on MacOS - /dev/cu.SLAB_USBtoUART. When the device is flashed, configure it to join the WiFi network:

miot dev config set -port /dev/ttyUSB0 wifi.ap.enable=false wifi.sta.enable=true wifi.sta.ssid=WIFI_NETWORK_NAME wifi.sta.pass=WIFI_PASSWORD
Getting configuration...
Setting new configuration...

After that, find out what IP address ESP8266 is using:

$ miot dev call --port /dev/ttyUSB0 /v1/Config.GetNetworkStatus
  "wifi": {
    "sta_ip": "",
    "ap_ip": "",
    "status": "got ip",
    "ssid": "WIFI_NETWORK_NAME"

Now, ESP8266 can talk to the Internet! And it runs the RESTful server to turn an LED on or off. Let's use curl command line utility to test it - turn an LED on (take the IP address from the output of the previous command):

curl -d state=1
{ "result": 0 }

It turns an LED on!


We can query the current status, and turn it off:

{ "state": 1 }
curl -d state=0
{ "result": 0 }

Building a management web page

Okay, now we can talk to the ESP8266 via a RESTful API. Good. Let's build a handy web page. Create a filesystem/console.html file, and copy/paste this code in:

<script type="text/javascript" src=""></script> 
 <h1>Hello from ESP8266!</h1> 
 <p>LED state: <span id="state"></span></p> 
 <input type="checkbox" id="control"> Set state</input> 
   $(document).ready(function() { 
     // Query LED state every second 
     window.setInterval(function() { 
       $.get('/get', null, function(data) { 
       }, 'json'); 
     }, 1000); 
     $('#control').change(function() { 
       var state = $(this).is(':checked') ? 1 : 0; 
       $.post('/set', 'state=' + state); 

The design of this page is intentionally minimal, just to demonstrate the idea. Now let's copy this file to the ESP8266 module:

miot dev fs put -port /dev/ttyUSB0 filesystem/console.html
Contact Us
Have questions about Cesanta, our licensing, support services or anything else? Let us know and we'll get back to you.