Engineers Garage

  • Projects and Tutorials
    • Electronic Projects
      • 8051
      • Arduino
      • ARM
      • AVR
      • PIC
      • Raspberry pi
      • STM32
    • Tutorials
    • Circuit Design
    • Project Videos
    • Components
  • Articles
    • Tech Articles
    • Insight
    • Invention Stories
    • How to
    • What Is
  • News
    • Electronic Products News
    • DIY Reviews
    • Guest Post
  • Forums
    • EDABoard.com
    • Electro-Tech-Online
    • EG Forum Archive
  • Digi-Key Store
    • Cables, Wires
    • Connectors, Interconnect
    • Discrete
    • Electromechanical
    • Embedded Computers
    • Enclosures, Hardware, Office
    • Integrated Circuits (ICs)
    • Isolators
    • LED/Optoelectronics
    • Passive
    • Power, Circuit Protection
    • Programmers
    • RF, Wireless
    • Semiconductors
    • Sensors, Transducers
    • Test Products
    • Tools
  • EE Resources
    • DesignFast
    • LEAP Awards
    • Oscilloscope Product Finder
    • White Papers
    • Webinars
  • EE Learning Center
    • Design Guides
      • WiFi & the IOT Design Guide
      • Microcontrollers Design Guide
      • State of the Art Inductors Design Guide
  • Women in Engineering

Controlling Appliances Over WiFi And Ethernet

By Ganesh Selvaraj

 

This a simple tutorial on how to setup your Arduino board with Ethernet shield to control your home appliances like Lights or Fans using any device (Mobile/Tablet/Laptop/Desktop) connected to your WiFi network. It is assumed that the reader has gone through the project how to get started with the arduino.

Components Required

 
1. Arduino Ethernet Shield
 
2. Arduino Uno (or any other Arduino board compatible with the shield)
 
3. Relay Board (Number of Relays depend on how many appliances you want to control)
 
4. WiFi router
 
5. Ethernet cables
 
6. Wires
 

Block Diagram

Block Diagram of Arduino based Wi-Fi Controlled Home Automations System

Fig. 1: Block Diagram of Arduino based Wi-Fi Controlled Home Automations System

HTML (Hyper Text Markup Language)

Yeah right! HTML! How else do you expect to make your interface accessible in all your WiFi enabled devices then?
 
We basically create an HTML page from Arduino which can be accessed by the devices connected to the network from their respective internet browsers. So we don’t need to install any specific application in each device you want to control your appliance with.
 
You just need to know some basics of HTML (which I will cover here) but the better you know, the cooler your web interface would look!
 

Getting Started

– Open the Notepad and copy paste the following code:
 
<html>
 
<head>
 
<title>My First Page Title</title>
 
</head>
 
<body>
 
Congrats! You have created your first Webpage!
 
</body>
 
</html>
 

– Go to File menu and click Save As. Below the file name you would see save as type:

Click on that and you should see All Files. Select it and give a name to your page like for example myweb.html and save it.

Screenshot of saving webpage on Windows used for controlling home appliances

Fig. 2: Screenshot of saving webpage on Windows used for controlling home appliances

– Now close the notepad and open the file again using a browser (Mozilla Firefox/ Google Chrome/ IE). You should see something like this.

Screenshot of a simple HTML webpage

Fig. 3: Screenshot of a simple HTML webpage

What we wrote above is the basic code.

HTML Tags Explanation

HTML Tags start with ‘<’ symbol and end with ‘>’ symbol. For example let’s take the tag used for making text to be shown in bold letters, which is <b>.
 
<b> is the opening tag so it indicates from where the operation should start and its corresponding closing tag is </b> which tells where to end the operation.
 
For example if we write the following in the text editor:
 
<b>This is a bold text</b>
 
We get this:
 

This is a bold text

Some Frequently Used Tags

Tags

Function

<title></title>

Title of the page which would be shown as the name of the browser window and bookmarks

<body></body>

Whatever you want to display on your webpage would be included in this tag

<b></b>

Bold

<u></u>

Underline

<i></i>

Italics

<strike></strike>

Strike through the text

<center></center>

For displaying text on center of the page

Empty Tags

<br/> and <hr/> are called empty tags since they don’t have corresponding closing tag. <br/> is used for giving line break (equivalent to hitting enter in a word document) and <hr/> is horizontal rule (shows a visible line when used).

Linking to Other pages

This is the most important part for our project. The syntax for linking is as follows:
 
<a href=”http://www.engineersgarage.com”>Text to be displayed</a>
Here a stands for anchor and href=”” is where you mention the web address where you desire to go to. </a> is the corresponding closing tag and the text between them is the text which would be displayed on the web page.
 
Remember: Tags can be used within each other also. For example you want a text to be in bold and at the same time underlined, you can use the tags with each other. This:
 
<b><u> Text in bold and underlined</u></b>
 
Or this:
 
<u><b> Text in bold and underlined </b></u>
 

Will give you this:

 

underlined

Well nothing is good without a good example so let us implement everything we just learned into an example code. Copy paste the following into a notepad, save it as a HTML file and see for yourself in the browser.

<html>
 
<head>
 
<title>Example Two</title>
 
</head>
 
<body>
 
<center>
 
Everything on this page would be at the center.
 
<hr/>
 
<br/>
 
<b>This is a sentence in Bold.</b>
 
<br/>
 
<u>This sentence would be underlined</u>
 
<br/>
 
<b><u><i><strike>This sentence would have multiple formatting</strike></i></u></b>
 
<br/>
 
<br/>
 
<br/>
 
Click the link below to go the Engineers Garage homepage
 
<br/>
 
<br/>
 
<a href=”http://www.engineersgarage.com”>EngineersGarage</a>
 
</center>
 
</body>
 
</html>

This is how the page would look in the browser:

Screenshot of a simple HTML webpage showing simple text

Fig. 4: Screenshot of a simple HTML webpage showing simple text

Now that we have learnt the web interface part, let us move on to the next section.

Hardware Setup -Step by Step

Hardware Setup

1) Gather all the parts shown in the image.

Image showing components used in design of Wi-Fi controlled Home Automation System

Fig. 5: Image showing components used in design of Wi-Fi controlled Home Automation System

Note 1:  The one I used is an Indian made Arduino clone. Depending on from which manufacturer you bought, it would look different.

 
Note 2:  This tutorial will teach you to control a single appliance so a single relay (with transistor and free-wheeling diode) is enough as shown in the circuit diagram. I’ve used a relay board for my convenience.
 
2) Attach the Ethernet Shield carefully to the Arduino board such that the pins align correctly.

Image of Ethernet Shield for Arduino Uno

Fig. 6: Image of Ethernet Shield for Arduino Uno

3) Connect one end of the Ethernet cable to a LAN port of the Wi-Fi router and other end of the same cable to the computer.
 
(You can skip the above step if a. You have already configured your router and b. You don’t want to control the appliance using your desktop)

Image showing Ethernet Cable connected to PC

Fig. 7: Image showing Ethernet Cable connected to PC

Image showing Ethernet Cable connected to Wi-Fi Modem

Fig. 8: Image showing Ethernet Cable connected to Wi-Fi Modem

 
4) Power ON the Router and configure it (Assigning a name, password and other parameters to Router) using the instructions/ CD given by the Router’s manufacturer.

(Skip this step if the Router has already been configured)

5) Now take another Ethernet cable and connect one end to another LAN port of the Wi-Fi router and other end of the same cable to the Ethernet port of the Ethernet shield.

Image showing LAN cable connected to Ethernet Shield

Fig. 9: Image showing LAN cable connected to Ethernet Shield

Image showing LAN Cable connected to Wi-Fi Modem

Fig. 10: Image showing LAN Cable connected to Wi-Fi Modem

 
6) Connect the Arduino to your computer and upload the program given. Once everything is in the right place, open the serial monitor in Arduino and you should see something like this on the monitor:

Screenshot of Arduino Serial Port showing Local IP Address

Fig. 11: Screenshot of Arduino Serial Port showing Local IP Address

7) Switch ON WiFi on your Phone/Tablet/Laptop and locate the name of the Router (which you assigned earlier) and enter the password if necessary to connect to the network.

Note: My WiFi SSID is “Robots Reloaded”

Screenshot of Android's Settings for connecting to Wi-Fi Router

Fig. 12: Screenshot of Android’s Settings for connecting to Wi-Fi Router

8) Open your browser and go to the address “http://192.168.0.108” (which was assigned in the sketch uploaded into it)

You should see this page in few seconds

Screenshot of webpage loaded from Local Server

Fig. 13: Screenshot of webpage loaded from Local Server

When opened from desktop/Laptop:

Screenshot of Webpage on a desktop computer

Fig. 14: Screenshot of Webpage on a desktop computer

9)  Connect the rest of the circuit as per the circuit diagram.

 
10) Now click the links and see if the appliance corresponding to that link is responding or not. You would also see something in the serial monitor of Arduino if everything goes right.
 
At any point if you didn’t get the output as shown in the above steps, check out the troubleshooting part at the end.

Arduino Code Explanation & Troubleshooting

Arduino Code Explanation

– Initialize all parameters like MAC address (The physical address of the Ethernet shield), IP Address (which would be the address you type in the browser to get the web page), gateway and subnet mask.
 
– Initialize serial communication and Serial Peripheral Interface with the Ethernet shield and a server.
 
– Enter an Infinite loop.
 
– Allow a client (which is the device we used to access the web interface page) when the server becomes ready. Read whatever the client sends and store it in the variable ‘readString’
 
– When client is connected, print the HTML webpage using ‘client.println()’ function.
 
–  If client sends GET request then take necessary action (i.e. when you click a link on your mobile/tablet/PC, a GET request is sent to the server which is the arduino here).

Troubleshooting

– Problem: Nothing is shown on the serial monitor after implementing step 6

Possible cause:

a. The Ethernet shield is not plugged onto the Arduino board correctly.
 
b. Ethernet cable connected to the shield/ USB cable connected to Arduino can be loose or faulty.
 
c. Router is not switched ON
 
Make sure all the connections are correct and press RESET button on the Arduino board.

-Problem: Web page not loading after implementing step 8

Possible cause:

a.       You connected to the wrong WiFi network

b.      The IP Address you dialed doesn’t match the one in the serial monitor

Make sure you are connected to the same WiFi network with correct password and that you have entered the correct IP Address.

– Problem: Web page not loading after implementing step 8

While you click the links, check the serial monitor output. If you see something like this:

Screenshot of Arduino Serial Port sending commands to control relays

Fig. 15: Screenshot of Arduino Serial Port sending commands to control relays

Then either the connections from Arduino to relay or relay to bulb is loose or wrong. Also check if the bulb and relay works properly or not.
 
If you don’t see any output on the serial monitor  then you might have gone wrong in one of the previous steps.
 

Improvements

Although only single appliance control is shown here, you can create code based on this model  to control any number of appliances through WiFi.

Project Source Code

###

#include <SPI.h>
#include <Ethernet.h>

int relay = 3;

byte mac[] = { 0xDE, 0xAD, 0xBE, 0xEF, 0xFE, 0xED };   //physical mac address
byte ip[] = { 192, 168, 0, 108 };         // ip in lan (that's what you need to use in your browser.
 ("192.168.0.108")
byte gateway[] = { 192, 168, 1, 1 };                   // internet access via router
byte subnet[] = { 255, 255, 255, 0 };                  //subnet mask
EthernetServer server(80);                             //server port    
String readString;

void setup() {
// Open serial communications and wait for port to open:
  Serial.begin(9600);
   while (!Serial) {
    ; // wait for serial port to connect. Needed for Leonardo only
  }
  pinMode(relay, OUTPUT);
  // start the Ethernet connection and the server:
  Ethernet.begin(mac, ip, gateway, subnet);
  server.begin();
  Serial.print("server is at ");
  Serial.println(Ethernet.localIP());
}


void loop() {
  // Create a client connection
  EthernetClient client = server.available();
  if (client) {
    while (client.connected()) {  
      if (client.available()) {
        char c = client.read();
    
        //read char by char HTTP request
        if (readString.length() < 100) {
          //store characters to string
          readString += c;
          //Serial.print(c);
         }

         //if HTTP request has ended
         if (c == 'n') {         
           Serial.println(readString); //print to serial monitor for debuging
    
           client.println("HTTP/1.1 200 OK"); //send new page
           client.println("Content-Type: text/html");
           client.println();    
           client.println("<HTML>");
           client.println("<HEAD>");

           client.println("<TITLE>WEB INTERFACE</TITLE>");
           client.println("</HEAD>");
           client.println("<BODY>");
           client.println("<center>");
           client.println("WELCOME TO THE WEB INTERFACE OF APPLIANCE CONTROLLER OVER WIFI");
           client.println("<hr />");
           client.println("<br />"); 
           client.println("<H2>Arduino with Ethernet Shield</H2>");
           client.println("<br />"); 
           client.println("<a href="/?relay1on">Switch ON Relay 1</a>");
           client.println("<a href="/?relay1off">Switch OFF Relay 1</a><br />");  
           client.println("<br />");    
           client.println("<br />");
           
           client.println("<p>Created by GANESH SELVARAJ for EngineersGarage.com</p>"); 
           client.println("<br />");
           client.println("</center>");
           client.println("</BODY>");
           client.println("</HTML>");
    
           delay(1);
           //stopping client
           client.stop();
           //controls the Arduino if you press the buttons
           if (readString.indexOf("?relay1on") >0){
               digitalWrite(relay, HIGH);
           }
           if (readString.indexOf("?relay1off") >0){
               digitalWrite(relay, LOW);
           }
         
            //clearing string for next read
            readString=""; 
          
         }
       }
    }
}
}

###

 


Circuit Diagrams

Circuit-Diagram-Arduino-Based-Wi-Fi-Controlled-Home-Automation-System

Project Video


Filed Under: Electronic Projects
Tagged With: Arduino, Wi-Fi
 

Questions related to this article?
👉Ask and discuss on EDAboard.com and Electro-Tech-Online.com forums.



Tell Us What You Think!! Cancel reply

You must be logged in to post a comment.

HAVE A QUESTION?

Have a technical question about an article or other engineering questions? Check out our engineering forums EDABoard.com and Electro-Tech-Online.com where you can get those questions asked and answered by your peers!


Featured Tutorials

  • Introduction to Brain Waves & its Types (Part 1/13)
  • Understanding NeuroSky EEG Chip in Detail (Part 2/13)
  • Performing Experiments with Brainwaves (Part 3/13)
  • Amplification of EEG Signal and Interfacing with Arduino (Part 4/13)
  • Controlling Led brightness using Meditation and attention level (Part 5/13)
  • Control Motor’s Speed using Meditation and Attention Level of Brain (Part 6/13)

Stay Up To Date

Newsletter Signup

Sign up and receive our weekly newsletter for latest Tech articles, Electronics Projects, Tutorial series and other insightful tech content.

EE Training Center Classrooms

EE Classrooms

Recent Articles

  • What are the battery-selection criteria for low-power design?
  • Key factors to optimize power consumption in an embedded device
  • EdgeLock A5000 Secure Authenticator
  • How to interface a DS18B20 temperature sensor with MicroPython’s Onewire driver
  • Introduction to Brain Waves & its Types (Part 1/13)

Most Popular

5G 555 timer circuit 8051 ai Arduino atmega16 automotive avr bluetooth dc motor display Electronic Part Electronic Parts Fujitsu ic infineontechnologies integratedcircuit Intel IoT ir lcd led maximintegratedproducts microchip microchiptechnology Microchip Technology microcontroller microcontrollers mosfet motor powermanagement Raspberry Pi remote renesaselectronics renesaselectronicscorporation Research samsung semiconductor sensor software STMicroelectronics switch Technology vishayintertechnology wireless

RSS EDABOARD.com Discussions

  • Band Pass Filte
  • Making a ducted soldering fan?
  • Slope compensation ramp calculation for UCC38084
  • Timer MC14541B wrong delay
  • Pull up via GPIO

RSS Electro-Tech-Online.com Discussions

  • Best way to reduce voltage in higher wattage system?
  • Need a ducted soldering fan for solder smoke extraction
  • Power failure relay options
  • DIY bluetooth speaker
  • Turn CD4029 on/off with TTP223
Engineers Garage
  • Analog IC TIps
  • Connector Tips
  • DesignFast
  • EDABoard Forums
  • EE World Online
  • Electro-Tech-Online Forums
  • Microcontroller Tips
  • Power Electronic Tips
  • Sensor Tips
  • Test and Measurement Tips
  • 5G Technology World
  • About Us
  • Contact Us
  • Advertise

Copyright © 2022 WTWH Media LLC. All Rights Reserved. The material on this site may not be reproduced, distributed, transmitted, cached or otherwise used, except with the prior written permission of WTWH Media
Privacy Policy | Advertising | About Us

Search Engineers Garage

  • Projects and Tutorials
    • Electronic Projects
      • 8051
      • Arduino
      • ARM
      • AVR
      • PIC
      • Raspberry pi
      • STM32
    • Tutorials
    • Circuit Design
    • Project Videos
    • Components
  • Articles
    • Tech Articles
    • Insight
    • Invention Stories
    • How to
    • What Is
  • News
    • Electronic Products News
    • DIY Reviews
    • Guest Post
  • Forums
    • EDABoard.com
    • Electro-Tech-Online
    • EG Forum Archive
  • Digi-Key Store
    • Cables, Wires
    • Connectors, Interconnect
    • Discrete
    • Electromechanical
    • Embedded Computers
    • Enclosures, Hardware, Office
    • Integrated Circuits (ICs)
    • Isolators
    • LED/Optoelectronics
    • Passive
    • Power, Circuit Protection
    • Programmers
    • RF, Wireless
    • Semiconductors
    • Sensors, Transducers
    • Test Products
    • Tools
  • EE Resources
    • DesignFast
    • LEAP Awards
    • Oscilloscope Product Finder
    • White Papers
    • Webinars
  • EE Learning Center
    • Design Guides
      • WiFi & the IOT Design Guide
      • Microcontrollers Design Guide
      • State of the Art Inductors Design Guide
  • Women in Engineering