MissionControl Nano Edition





Introduction: MissionControl Nano Edition

Hello everyone,

What does this Instructables actually teach you => Remote controlling of 2 relays via a ESP8266 chip on a NODEmcu board via a Bootstrap webpage.

A few months ago I designed a home automation system named MissionControl. I built this system completely from scratch and it is based on Python(CGI), Bootstrap and jQuery. You can read the full story about this system on my personal website => www.vangoidsenhoven.com . Recently I discovered the ESP8266 NODEmcu module. This is a very low cost (approx. 3$), easy to use, internet of things board. The base of this board is the ESP8266 chip with built in WiFi. The NODEmcu itself is a pcb with a ESP8266 chip on it. The pcb provides breakout pins, a power distribution system and a USB to serial converter for the ESP8266 chip. This "kit" makes the ESP8266 very easy to use. It can be powered and programmed by just plugging a micro USB cable, sensors and other peripherals can be attached via the breakout pins. I experimented a little bit with the NODEmcu and i came to the idea, why don't I just build a very simple version of my MissionControl system. I started coding in Arduino and I ended up with 2 programs that can be flashed on the NODEmcu. Both programs provide a Bootstrap website with 2 buttons that toggle the 2 relays that are attached to the NODEmcu pcb. The first program is coded to be connected to an already existing wireless network. The second program is designed to work standalone with the ESP8266 itself functioning as a wireless access point, in this state it can be controlled directly from a smartphone without the need of a router or any other network device.

Step 1: What Do You Need

- a NODEmcu ESP8266 v3 module => AliExpress (approx. $3)

- a relay board with 2 relays => AliExpress (approx. $1)

- 4 dupont female to female wires => AliExpress (approx $1)

- a computer with windows 7 or higher

- a micro usb cable => charging cable of your smartphone

- very basic knowledge of electronics

Step 2: Setting Up Your Computer

This video will demonstrate how you need to install the Arduino IDE and the requirements to get the NODEmcu to communicate with your computer.

Step 3: Hardware Setup

Connect the relay board to the NODEmcu pcb via 4 dupont female to female wires.

Connect the VCC from the relay board to the VU pin on the NODEmcu (VU = Vusb = 5V directly from the usb connector)

Connect the GND form the relay board to one of the G pins on the NODEmcu (G = Ground)

Connect the relay 1 input from the relay board to the D1 pin on the NODEmcu (D1 = GPIO5)

Connect the relay 2 input from the relay board to the D2 pin on the NODEmcu (D2=GPIO4)

Step 4: The Software - Client Mode

You can choose 1 of the 2 programs that i've made.

This program will connect the NODEmcu to an existing wireless network. You need to change the 2 lines as in the picture above to your own networks credentials.

The webpage will be accessible on the network that it is connected to.

You can flash this code by first downloading it from here, then open it in the arduino IDE and then click the little arrow at the top that points to the right side (also visible at the end of the instructions video) to upload it to the ESP8266.

By default the NODEmcu is setup to obtain an ip address via DHCP, but if you want to give the ESP8266 a static ip address you can do so by uncommenting and editing the line as in the second picture.

NOTE: I noticed that there is some lag between the press on the buttons on the webpage and the reaction of the relay. This can be caused due to the congesting of the ESP8266 by random network request from the router or other devices on the network. The ESP8266 is a very light chip and cannot handle a lot of network traffic. HOWEVER the standalone mode (see next step) is in comparison to this program very responsive and doesn't have this problem.

Step 5: Software - Standalone AP Mode

You can choose 1 of the 2 programs that i've made.

This program will configure the NODEmcu to setup its own access point. The NODEmcu will by default broadcast a wireless network with the SSID: MissionControlNano and the password: nodemcu8266. This can be changed by changing the variables as in the picture above.

You can flash this code by first downloading it from here, then open it in the arduino IDE and then click the little arrow at the top that points to the right side (also visible at the end of the instructions video) to upload it to the ESP8266.

The ip address is by default set to , if you browse to this address in the webrowser you should see the webpage. You can change this ip address by editing the line as in the second picture. Please do not set the ip address to because most devices use this ip address by default as the DNS server. If you do so the ESP8266 will get overloaded by DNS requests and will not function normally.

NOTE: If you connect your smartphone or any other device to this network, than the device will have no internet connection. Keep that in mind.

NOTE2: The Bootstrap page which is hosted on the ESP8266 itself gets its CSS and jQuery scripts from a CDN (Content Delivery Network). This means that if you visit the website the website will load external scripts needed to run bootstrap form a source on the internet. But if you use the MissionControl nano in standalone mode the device connected to it will have no access to the internet to get the required scripts. This could possibly result in a non functional webpage. I will try to fix this later. HOWEVER I noticed if you have already visited a bootstrap website before (which you probably did) the required scripts are already cached in the browsers cache. Which will result in a correct displayed website despite the lack of an internet connection.

Step 6: What Can You Do With It ?

The possibilities of this setup are endless.
Name it and you can make it.

Some examples:

A remote controlled power strip
Remote control the lighting of a room
Open your garage door from your smartphone
An idea of a friend => Remotely detonate firework (which makes it a lot safer)



    • Epilog Challenge 9

      Epilog Challenge 9
    • Pocket-Sized Contest

      Pocket-Sized Contest
    • Pro Tips Challenge

      Pro Tips Challenge

    We have a be nice policy.
    Please be positive and constructive.




    Thanks for sharing and keep up the good work :)