Introduction: Build Your Very First Wi-Fi Webserver

About: Maker evangelist. Start-up entrepreneur. Former civil servant & public school teacher.

The ESPresso Lite is the latest Wi-Fi enabled, Arduino-compatible development board that is (currently on beta testing) produced by Espert Pte Ltd. It uses Espressif System's ESP8266 WROOM-02 module for its core Wi-Fi and MCU functions. It is designed with direct-to-board headers that has been pre-arranged to ensure that components that require e.g. I2C connections can be easily plugged in without the need of additional jumper wires.

The ESPresso Lite has in-built Arduino library and example codes that allow any novice user to experiment with building a simple webserver that can take in and display sensor data on the browser upon request, in this case temperature & humidity information using the DHT22.

This tutorial will be able to demonstrate how convenient it is to have direct-to-board connectors that allow for quick set up and deployment of the code to build this simple temperature-humidity webserver.

Step 1: Stack the Sensors and OLED Display (optional) Modules

The ESPresso Lite board allows a generic OLED LCD display module to be plugged in directly to the I2C headers. Similarly the DHT22 sensor can be inserted directly into the V3, GPIO12, GPIO14 (not used), GND UART headers without the need to have additional jumper wires or passive components.

Step 2: Using the ESPert Arduino Library

The ESPert Arduino library is specially written for ESPresso Lite. You can download the zip version of the ESPert folder at GitHub Repository https://github.com/JimmySoftware/ESPert

Start the Arduino IDE and open Preferences window

At Sketchbook location, click Browse, locate the folder labelled ‘ESPert’ and point the location to that folder

Step 3: Get the Example Sketch

Go to File > Sketchbook > _0080_WebServer to load the sketch into the Arduino IDE.

Remember to press RESET button on the ESPresso Lite before uploading the sketch into it.

Step 4: Option 1: Setting Up the Wi-Fi Using Smart Config

After the sketch is uploaded, the OLED display will show that it is in Smart Config mode, waiting for a Wi-Fi connection to be set up.

Option 1:

Use the ESPert app (download from http://thaigw.com/espert) to use the Smart Config feature to set up the Wi-Fi wirelessly. Key in the necessary information e.g. SSID & pasword and activate the Smart Config. The ESPresso Lite will be connected to the Wi-Fi using the credentials broadcasted by the app in a few seconds.

Step 5: Option 2: Setting Up Wi-Fi Using AP Mode

Option 2:

Another way to set up Wi-Fi for the ESPresso Lite is using the AP mode. Hold the button switch for a while and when the Setting AP text is displayed, check the available WI-Fi network and connect to it. After that key in the IP address indicated e.g. 192.168.4.1 in the URL panel to access the setup panel to connect the ESPresso Lite to an available Wi-Fi point by keying in their SSID & password.

Step 6: Connect to Your Webserver

After setting up the Wi-Fi connection, go to your web browser and enter the IP address indicated in the OLED display e.g. 192.168.1.9 as the URL.

The temperature and humidity information will be return when you press 'Enter' each time.

There you have it. A temperature-humidity webserver that can take in sensor data remotely and broadcast them to the Internet, whose data can be requested through a web browser.

If you like to try the project yourself and would like to get the board, head over to http://espert.co and pre-order an ESPresso Lite. Delivery is scheduled to be in December.