Introduction: IoT Development With Mobile Directly

By Follow my bilibili：陳亮手痕定律

This Instructables shows how to code your IoT with your mobile directly.

Once setup finished, it is no need USB to TTL cable (neither an extra server) anymore, just direct connect your mobile to ESP softAP or your mobile and the ESP board connect to the same WiFi network and then use your favorite browser as a editor. Lua coding, save, compile and run it all within your mobile browser!!

Step 1: Introduction

Various ESP8266 boards are great and cheap MCU board to develop IoT device.

It is an WiFi board, but ironically, you always need to use a USB to TTL cable while development. I would like to change this situation and make it able coding in the mobile anywhere.

There are an Instructables shows how to upload files to the ESP8266 wirelessly. But it still need a PHP server in the middle, I want one step forward.

Marcos Kirsch has developed a nodemcu-httpserver and have essential web server facility. It can handle POST request and more, It is a good starting point.

source: https://github.com/marcoskirsch/nodemcu-httpserver

Step 2: Build the NodeMCU Firmware

ESP board is very powerful but it still very limited resource for acting a web server. So you need to custom build the NodeMCU firmware with only the feature you really need.

http://nodemcu-build.com can help you custom build your NodeMCU firmware.

Remember only select the modules that really need: file, net, node, WiFi is the essential modules for the web server. GPIO also an essential module for most projects; end user setup can help you connect various AP when you go out; My next project is using WS2812, so I also select this extra module.

After selected modules, input your email and press start build button, the firmware should be ready within a few minutes. Check your email to find the download link and download the firmware.

Step 3: Flash the NodeMCU Firmware

Here are the summary of flashing the firmware in OS X: (steps for Linux should be similar)

  • download esptool if not yet
pip install esptool
  • connect USB to TTL cable to your ESP board
    • TTL 3.3V -> EN pin (CH_PD), Vcc pin
    • TTL RX -> TX pin
    • TTL TX -> RX pin
    • TTL GND -> GPIO0 pin, GPIO15 pin, GND pin
  • plug your USB to TTL cable and find you serial port
ls /dev/cu.*
  • flash the firmware
esptool.py -p [your serial port] write_flash 0x0 [your firmware path]
  • wait around 1 minute (or TX LED blink) for the firmware actually finish write to the flash (it is studied from repeated painful experience)
  • remove GPIO15 pin
  • reconnect the USB to TTL cable for restart the ESP board
  • if you have a serial console (Arduino have one or you can use ESPlorer), you can see your custom firmware init message

Step 4: Download Web Server Code

I have added the editor.lua on top of Marcos Kirsch's nodemcu-httpserver, here is the source code:

https://github.com/moononournation/nodemcu-httpserver

If you are not familiar with GitHub, simply click the Download ZIP button.

Step 5: How It Works?

The editor.lua actually an enhanced version of post.lua example code. Here are the summary of the code:

  • read the code file (adhoc.lua) to the textarea html block
  • while save button pressed, use Javascript split the text into multiple 1024 bytes data block and POST request to the httpserver
  • httpserver receive the data block and write/append to the code file (adhoc.lua)
  • After every POST request, clean up the memory (collectgarbage()) to avoid out of memory
  • After last block sent, POST request to compile the code
  • If compile success, show the compiled link on the web

Coding notes:

  • Your code must be within the "return function" block to facilitate calling by the web server

Step 6: Configuration

  • Makefile
    • "PORT=" - change to your serial port
  • httpserver-conf.lua
    • "auth.enabled = true" - turn on basic Authentication for enable the editor
    • "auth.user" - config your web logon user name
    • "auth.password" - config your web logon password
  • init.lua
    • "wifiConfig.mode" - STATION / SOFTAP / STATIONAP
    • "wifiConfig.accessPointConfig.ssid" - name of SOFTAP
    • "wifiConfig.accessPointConfig.pwd" - password of SOFTAP
    • "wifiConfig.accessPointIpConfig.*" - IP config of SOFTAP
    • "wifiConfig.stationPointConfig.ssid" - name of your real AP
    • "wifiConfig.stationPointConfig.pwd" - password of your real AP
    • "dofile("httpserver.lc")(80)" - Uncomment to automatically start the server in port 80

Step 7: Upload to ESP Board

Download NodeMCU uploader for upload the Web Server code:

https://github.com/kmpm/nodemcu-uploader

Again, if you not familiar with GitHub, simply click the Download ZIP button.

Expand the uploader under the same parent folder as the nodemcu-httpserver code.

Under the nodemcu-httpserver folder: (don't try upload_all if your ESP board only have 512 KB flash)

make upload_server

Reconnect the USB to TTL cable for restart the ESP board.

Open the serial console or ESPlorer, you can see compiling the Web Server code and connecting to your AP.

Remember the obtained IP address.

Disconnect the serial console.

Upload the web content:

make upload_http

Step 8: Test

  • Use your mobile connect to your AP (or connect to the ESP softAP)
  • Open the ESP IP address (or the ESP softAP IP address)
  • Select the link of "Editor"
  • You can see the "Hello World" sample code (adhoc.lua default data)
  • Press save button
  • You can see the code save step by step in 1 KB block sequence
  • At last you can see the compiled code link at the bottom
  • Click the compiled code link (adhoc.lc)
  • You can see the "Hello World!" in the browser!
  • Back to the editor and start coding

Step 9: Happy Coding!

You can now take your ESP board (with battery) outside and start coding with your mobile. (no need stick to the USB to TTL cable anymore)

What's next?

  • The editor is actually run in your mobile, it should capable to have more fancy editor UI
Internet of Things Contest 2016

Participated in the
Internet of Things Contest 2016