Simple Webserver Using Arduino and ESP8266

The main aim of this instructable is to show how you can create a simple web server using Arduino and Wi-Fi module which displays the sensor data in the webpage.

Enjoy this instructables........

Step 1: Things You Need

Hardware

1. Arduino UNO or Mega.

2. WiFi module ESP8266- 01/12.

3. 3.3V voltage regulator. (LM390/LD117)

4. LM35 Temperature Sensor.

5. Jumper wires.

6. External 5V source (optional)..

7. Breadboard.

8. Capacitors (0.47uF, 22uF).

Software:

1 .Arduino IDE.

2. Web browser.

Step 2: Pin Configurations and Preparing ESP8266

Things to know before starting with ESP8266
The ESP8266 WiFi Module is a self contained SOC with integrated TCP/IP protocol stack that can give any microcontroller access to your WiFi network. The ESP8266 is capable of either hosting an application or offloading all Wi-Fi networking functions from another application processor. Each ESP8266 module comes pre-programmed with an AT command set firmware, meaning, you can simply hook this up to your Arduino device and get about as much WiFi-ability as a WiFi Shield offers.

Before you go for programming we have to prepare ESP module to work with arduino.

For ESP8266-01 the VCC pin and CH_PD pin should be short-circuit as shown in the image above.

Same way in ESP8266-12 there a certain pins which are to be short i.e CH_PD and GPIO0 with VCC, GPIO15 with GND

For ESP8266-12 without base board we have to solder it on perfboard or with connecting wires for making it breadboard compatible.

AT commands for ESP8266 is attached below..

Step 3: Circuit Connections

Voltage Regulator

The circuit for voltage regulator is shown in the above diagram. Capacitors are connected at the input and output terminal of regulator for smoothing. The capacitors used is ceramic type connected at input side and electrolytic type at the output side.

NOTE: It is not advisable to give 5v source from Arduino as ESP requires more current for its operation. Doing so can cause malfunction of Wi-Fi module. Schematics shown above is just for representation.

ESP8266 connections

VCC should be connected to the 3.3v voltage regulator and GND should be common for both Arduino and for ESP same follows for any sensors used.

ESP RxD----------------->Arduino Tx

ESP TxD------------------>Arduino Rx

If using Arduino Mega we can use Serial Port 1, i.e. Pin 18 and 19, for connecting to ESP as Serial Port 0 is used by serial monitor.

For Arduino UNO we have to assign software serial which is declared in the program. Here we are using Arduino pin 2 and 3 as Rx and Tx

Temperature Sensor

the VCC of the sensor is connected to 5v source from Arduino and GND is connected to the common ground. the Output pin is connected to Arduino's analog pin (A0).

Step 4: Arduino Sketch and Explanation.

Arduino sketch for this tutorial is attached below, Program is self-explanatory and contains comments for all operations.

If you are using Arduino Uno then follow this...

#include<SoftwareSerial.h>

#define DEBUG true

SoftwareSerial esp8266(2,3);

REPLACE the above text in bold with the content above the void setup() ,and also Serial1 with esp8266 in program.

The above Code is to assign UNO pins 2 and 3 as RX and TX. This means that you need to connect the TX line from the esp to to Arduino's pin 2 and the RX line from the ESP to the Arduino's pin 3.

Step 5: Final Outcome.

As we are using ESP8266 in Mode 2 i.e. Access Point ,it will create a Wi-Fi hotspot with ssid AI-THINKER.

By default there is no password for the network. We can change SSID and PASSWORD by sending the AT commands from the program.

Accessing the Web page

First connect to the network by your device.

Open a web browser such as Google Chrome.

Go to the Address bar and enter the IP Address of your ESP8266 then press Enter. By default the IP address is 192.168.4.1 .Now you will get the webpage as shown in the image.

This is just the basic work with ESP8266,but you can get more out of it, just be creative and Think out of the Box :)

Thank you.