Demonstration

Published May 17, 2020 © GPL3+

Control Lights using Buttons

If you like to control whole lights in your house using some buttons, then try this.

BeginnerFull instructions provided2 hours372

Things used in this project

Hardware components

LED (generic)

Resistor 330 ohm

Jumper wires (generic)

Bolt IoT Bolt WiFi Module

USB-A to Mini-USB Cable

Breadboard (generic)

Software apps and online services

Bolt IoT Android App

Bolt IoT Bolt Cloud

Story

Nowadays, people all over the world are mostly interested in keeping touch with newly developing technologies. Being a part of it, I have gone through a few of them and one of the platform I found apt for it was Bolt. Bolt IoT cloud is one of the platforms in providing major capabilities to bolt devices. All bolt devices are connected to Bolt cloud.

Here I am going to give an idea about how we can control our home with key pad of our mobile phone. Through this project we come to know that we can control anything from anywhere. In this project I have introduced three LED s, and let it be for different areas like one for Drawing room, one for Bed room and the other one for Kitchen. Along with these LED s, I have used three resistors of 330 ohms.

AboutComponentsusedalongwiththeirneeds.

LED is the main component used here. LED stands for Light Emitting Diode. This diode is able to convert Electrical energy into Light energy. LED has two legs where one is longer and the other one is shorter. Longer leg is positive and shorter leg is negative. In the connection, we are connecting longer leg (positive) to GPIO pin (It is the pin in Bolt device which is marked as 0, 1, 2, 3, 4. We can choose any pin from this as our GPIO pin.) and the shorter leg to the ground. Resistors are wrapped along each LED s to control the flow of current along each one.

AbouttheCode.

Here the LED s are controlled using the code that we are writing in the Bolt cloud. In the bolt cloud I used HTML along with Javascript and CSS to create buttons. In the header, we will add the js file(Javascript code) which has predefined functions like digitalRead, digitalWrite etc already hosted in the Bolt cloud. Then in our code we will be setting API keys which is present in our Bolt cloud Dashboard. Then we will create buttons in the body of HTML code. I have also used CSS to beautify the buttons.

Demonstration:

Code

html code

html code

HTML

The code is written in the bolt cloud platform. In the head tag we are introducing the script tag and inside it we will be setting the type as javascript text and we need to insert our own API key and Device name inside the script tag. Inside the style tag which is also written inside the head tag , we will be setting the features of buttons using CSS. Then inside body tag, we will be adding functions of each buttons using the inbuilt function like digitalWrite. Inside the digitalWrite function, the first parameter is the GpIO pin number where the one resistor is connected. Next parameter is the HIGH or LOW of the corresponding LED. Like this the rest code goes for rest two LED s and corresponding resistors.

<html>
    <head>
        <title>Bolt IoT Platform</title>
        <script type = "text/javascript" src = "https://cloud.boltiot.com/static/js/boltCommands.js"></script>
        <script type = "text/javascript">setKey('{{ApiKey}}','{{Name}}');</script>
        <style>
        .button{
            background-color:#4CAF50;
            border:none;
            color:white;
            padding:15px 32px;
            text-align:center;
            text-decoration:none;
            display:inline-block;
            font-size:16px;
        }
        .button2{background-color:#f44336;}
        .button3{background-color:#4CAF50;}
        .button4{background-color:#f44336;}
        .button5{background-color:#4CAF50;}
        .button6{background-color:#f44336;}
        </style>
    </head>
    <body>
        <center>
         <button class = "button" onclick = "digitalWrite(0,'HIGH');">Drawing room Light ON</button><br><br>
         <button class = "button button2" onclick = "digitalWrite(0,'LOW');">Drawing room Light OFF</button><br><br>
         <button class = "button button3" onclick = "digitalWrite(1,'HIGH');">Bedroom Light ON</button><br><br>
         <button class = "button button4" onclick = "digitalWrite(1,'LOW');">Bedroom Light OFF</button><br><br>
         <button class = "button button5" onclick = "digitalWrite(2,'HIGH');">Kitchen Light ON</button><br><br>
         <button class = "button button6" onclick = "digitalWrite(2,'LOW');">Kitchen Light OFF</button>
        </center>
    </body>
</html>

Credits

Renjini Jayakumar

1 project • 0 followers

Control Lights using Buttons

Things used in this project

Hardware components

Software apps and online services

Story

Demonstration:

Schematics

Step 1:

Step 2:

Step 3:

Step 4:

Step 5:

Step 6:

Step 7:

Code

html code

Credits

Renjini Jayakumar

Comments

Embed the widget on your own site

Control Lights using Buttons

Control Lights using Buttons

Things used in this project

Hardware components

Software apps and online services

Story

Demonstration:

Schematics

Step 1:

Step 2:

Step 3:

Step 4:

Step 5:

Step 6:

Step 7:

Code

html code

Credits

Renjini Jayakumar

Comments

Related channels and tags