Turn ON/OFF a LED from a HTML web site Using Firebase

  1. Nodemcu ESP8266
  2. Firebase Account
  3. Red LED ( Any )
  4. Jumper wires
  5. Breadboard ( optional )
  6. 100 ohm resistor ( optional )

Install Arduino JSON Library

Install Firebase Library

Create a Real-Time Database on Firebase

  1. First, click on Go to console
#include <ESP8266WiFi.h>
#include <SoftwareSerial.h>
#include <FirebaseArduino.h>
#include <ArduinoJson.h>
#include <ESP8266HTTPClient.h>

// Set these to run example.
#define FIREBASE_HOST "ledonoff-a3d11-default-rtdb.firebaseio.com"
#define FIREBASE_AUTH "7O2d5R7LJNON6d41GoXcq0DiKy4uLtfYU6a8oa5L"
#define WIFI_SSID "TP-LINK_04F390"
#define WIFI_PASSWORD "123JAYADEVA"

const int LED_1_SLOT = D2;
void setup()
{

// Debug console
Serial.begin(9600);

pinMode(LED_1_SLOT, OUTPUT);
// connect to wifi.
WiFi.begin(WIFI_SSID, WIFI_PASSWORD);
Serial.print("connecting");
while (WiFi.status() != WL_CONNECTED)
{
Serial.print(".");
delay(500);
}
Serial.println();
Serial.print("connected: ");
Serial.println(WiFi.localIP());

Firebase.begin(FIREBASE_HOST, FIREBASE_AUTH);
if(Firebase.failed())
{
Serial.print(Firebase.error());
}
else{

Serial.print("Firebase Connected");

}
}

void loop()
{

String path = "/LED/";
FirebaseObject object = Firebase.get(path);
String LED_1 = object.getString("status");
Serial.println("LED_1 : " + LED_1);

if(LED_1 == "ON"){

digitalWrite(LED_1_SLOT, HIGH);

}
else if (LED_1 == "OFF"){
digitalWrite(LED_1_SLOT, LOW); }


}

Creating the HTML Web Page

<!DOCTYPE html><html lang=”en”><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title></head><body><h1> LED TURN ON / OFF APP </h1><button onclick="ledOn()">ON</button><button onclick="ledOff()">OFF</button></body></html>

Add Firebase to your project (index.html)

  1. Go to firebase project settings.
<! — The core Firebase JS SDK is always required and must be listed first →<script src="https://www.gstatic.com/firebasejs/8.2.0/firebase-app.js"></script><script src="https://www.gstatic.com/firebasejs/8.2.0/firebase-auth.js"></script><script src="https://www.gstatic.com/firebasejs/8.2.0/firebase-database.js"></script>
function ledOn(){  firebase.database().ref("LED").set({  status:"ON"  })}function ledOff(){  firebase.database().ref("LED").set({  status:"OFF"  })}

Testing

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Senura Vihan Jayadeva

Senura Vihan Jayadeva

93 Followers

Software Engineering undergraduate of Sri Lanka Institute of Information Technology | Physical Science Undergraduate of University of Sri Jayewardenepura