Skip to content

Latest commit

 

History

History
62 lines (54 loc) · 1.48 KB

README.md

File metadata and controls

62 lines (54 loc) · 1.48 KB

Live online visitor counter

server less real-time online visitors counter with firebase Realtime database

you can implement in any javascript based frontend/html/react js/angular js

just replace the config object with your own

HTML

Real-time online visitors counter using firebase realtime database

  1. create firebase project https://firebase.google.com/docs/web/setup
  2. goto firebase realtime database and create a new one.
  3. navigate to rules tab and add rules like this.
{
  "rules": {
    ".read": false,
    ".write": false,
      "tempUser":{
        ".read":true,
         ".write":true,
         ".indexOn":"state"
      }
  }
}
  1. now goto html/index.html
  2. replace firebaseConfig with your own
var firebaseConfig = {
  apiKey: "API_KEY",
  authDomain: "PROJECT_ID.firebaseapp.com",
  databaseURL: "https://PROJECT_ID.firebaseio.com",
  projectId: "PROJECT_ID",
  storageBucket: "PROJECT_ID.appspot.com",
  messagingSenderId: "SENDER_ID",
  appId: "APP_ID",
  measurementId: "G-MEASUREMENT_ID",
};
  1. run index.html

React JS

  1. run npm i
  2. open config.js file
  3. replace firebaseConfig with your own
var firebaseConfig = {
  apiKey: "API_KEY",
  authDomain: "PROJECT_ID.firebaseapp.com",
  databaseURL: "https://PROJECT_ID.firebaseio.com",
  projectId: "PROJECT_ID",
  storageBucket: "PROJECT_ID.appspot.com",
  messagingSenderId: "SENDER_ID",
  appId: "APP_ID",
  measurementId: "G-MEASUREMENT_ID",
};
  1. run npm start