Experiment-8
Proximity-Based Smart Home Controller Using ESP32, Web Server,
and HTML
Aim
To develop a proximity-based smart home automation system using an ESP32 microcontroller, a PIR
sensor, and a web server. This system enables remote control of devices like lights and buzzers via a
responsive HTML-based interface hosted on the ESP32.
Apparatus Required
1. ESP32 Microcontroller Board
2. PIR Sensor (Passive Infrared Sensor)
3. LED (Light Emitting Diode)
4. Buzzer
5. Resistors (220 ohms for LED)
6. Breadboard
7. DHT11/DHT22 Temperature and Humidity Sensor (optional for expansion)
8. Jumper Wires
9. USB Cable for Programming
10. Computer with Arduino IDE or equivalent software
11. Wi-Fi Connection
Theory
The ESP32 is a powerful IoT-enabled microcontroller with built-in Wi-Fi and Bluetooth capabilities. Its
dual-core processor makes it ideal for real-time applications like smart home automation.
This project uses the ESP32 to:
1. Host a web server that provides an interactive HTML-based interface for device control.
2. Interface with a PIR sensor to detect motion, triggering actions like turning on lights or
activating a buzzer.
3. Manage connected devices through GPIO pins, controlled by HTTP requests generated from
user interactions on the web interface.
The web interface allows users to control devices wirelessly, making this a cost-effective solution for
scalable smart home systems.
// Load Wi-Fi library
#include <WiFi.h>
const char* ssid = "PRASHANT";
const char* password = "12345@";
// Assign output variables to GPIO pins
const int output26 = 26; const int
output27 = 27;
// Timing variables unsigned long currentTime = millis();
unsigned long previousTime = 0; const long timeoutTime = 2000;
// Timeout time in milliseconds
void setup()
{ Serial.begin(115200);
// Initialize the output variables as outputs
pinMode(output26, OUTPUT); pinMode(output27,
OUTPUT);
// Set outputs to LOW
digitalWrite(output26, LOW);
digitalWrite(output27, LOW);
// Connect to Wi-Fi network with SSID and password
Serial.print("Connecting to ");
Serial.println(ssid);
WiFi.begin(ssid, password); while
(WiFi.status() != WL_CONNECTED)
{ delay(500); Serial.print(".");
}
// Print local IP address and start web server
Serial.println("");
Serial.println("WiFi connected.");
Serial.println("IP address: ");
Serial.println(WiFi.localIP()); server.begin();
}
void loop() { WiFiClient client = server.available(); //
Listen for incoming
if (client) { // If a new client
connects currentTime = millis();
previousTime = currentTime;
Serial.println("New Client.");
String currentLine = ""; // Make a String to hold incoming
d while (client.connected() && currentTime -
previousTime <= t currentTime = millis(); if
(client.available()) { // If there's bytes to read from
char c = client.read(); // Read a byte Serial.write(c);
// Print it out to the serial monitor header += c;
if (c == '\n') { // If the byte is a newline character
// If the current line is blank, you got two newline c
// That's the end of the client HTTP request, so send
if (currentLine.length() == 0) { // HTTP headers
always start with a response code (e // and a
content-type so the client knows what's com
client.println("HTTP/1.1 200 OK");
client.println("Content-type:text/html");
client.println("Connection: close");
client.println();
// Turns the GPIOs on and off
if (header.indexOf("GET /26/on") >= 0)
{ Serial.println("GPIO 26 on");
output26State = "on";
digitalWrite(output26, HIGH);
} else if (header.indexOf("GET /26/off") >= 0) {
Serial.println("GPIO 26 off");
output26State = "off"; digitalWrite(output26,
LOW); } else if (header.indexOf("GET
/27/on") >= 0) { Serial.println("GPIO 27
on"); output27State = "on";
digitalWrite(output27, HIGH); } else if
(header.indexOf("GET /27/off") >= 0)
{ Serial.println("GPIO 27 off");
output27State = "off"; digitalWrite(output27,
LOW); }
// Display the HTML web page
client.println("<!DOCTYPE html><html>");
client.println("<head><meta name=\"viewport\" conten
client.println("<link rel=\"icon\" href=\"data:,\">"
client.println("<style>html { font-family: Helvetica
client.println(".button { background-color: #4CAF50;
client.println("text-decoration: none; font-size: 30
client.println(".button2 { background-color: #555555
// Web Page Heading client.println("<body><h1>ESP32
Web Server</h1>"); // Display current
state, and ON/OFF buttons for GPI
client.println("<p>GPIO 26 - State " + output26State
if (output26State == "off") {
client.println("<p><a href=\"/26/on\"><button
clas } else { client.println("<p><a
href=\"/26/off\"><button cla }
// Display current state, and ON/OFF
buttons for GPI client.println("<p>GPIO 27 - State
" + output27State if (output27State == "off") {
client.println("<p><a href=\"/27/on\"><button clas
} else {
client.println("<p><a href=\"/27/off\"><button cla
}
client.println("</body></html>");
// The HTTP response ends with another blank line
client.println();
break;
} else { // If you got a newline, then clear currentLi
currentLine = "";
}
} else if (c != '\r') { // If you got anything else but
currentLine += c; // Add it to the end of the currentL
}
}
}
// Clear the header variable
header = "";
// Close the connection
client.stop();
Serial.println("Client disconnected.");
Serial.println("");
}
}
Unique Features of My Project
1. Enhanced User Interface: Added real-time status indicators for devices, improving the
usability of the control panel.
2. Customizable Automation Rules: Incorporated logic for automatic light and buzzer activation
based on motion detection.
3. Expandable Design: Included optional integration with a DHT11/DHT22 sensor for
environmental monitoring.
4. Optimized Web Server Code: Utilized non-blocking functions to ensure smooth performance
and quick response times.
Connection Diagram
SOURCE CODE:
Procedure
1. Hardware Setup:
o Connect the PIR sensor’s output pin to a GPIO pin (e.g., D12) on the ESP32.
o Connect the LED to another GPIO pin (e.g., D26) with a 220-ohm resistor.
o Connect the buzzer to a separate GPIO pin (e.g., D27).
o Ensure all ground (GND) connections are common.
2. Code Development:
o Write a sketch to initialize the ESP32 as a web server.
o Design a responsive HTML page with buttons to control the LED and buzzer.
o Add logic to read PIR sensor input and trigger actions automatically.
o Implement real-time updates using non-blocking code (e.g., millis() instead of
delay()).
3. Upload Code:
o Open the Arduino IDE, select the ESP32 board, and upload the sketch via USB cable.
4. Access Web Server:
o Open the Serial Monitor to retrieve the ESP32’s IP address.
o Connect your device to the ESP32’s Wi-Fi network and enter the IP address in a
browser.
5. Test the System:
o Use the web interface to toggle the LED and buzzer.
o Verify that the PIR sensor detects motion and triggers the devices as programmed.
Observations
1. The ESP32 successfully hosted a web server accessible on any device connected to the same
Wi-Fi network.
2. HTML buttons effectively controlled the LED and buzzer with minimal delay.
3. The PIR sensor accurately detected motion, triggering predefined actions reliably.
4. The optimized code ensured smooth performance without interruptions.
Conclusion
This project demonstrated the successful implementation of a proximity-based smart home
controller using the ESP32, PIR sensor, and web server. The system allowed seamless control of
devices through a responsive HTML interface, with automatic activation based on motion detection.
The expandable design and efficient performance highlight its potential for practical IoT applications
in smart homes.
Name: Prashant Kumar
Roll No.: BT22EEE099