firebase database

Repost for Reusage Purpose

Create an Online Database with Firebase Realtime Database

Multiple databases for different projects — still FREE.

📑 Table of Contents

1. Introduction & Firebase Config Sample
2. Firebase Console Screenshots
3. Step 1 — Create Firebase Project
4. Step 2 — Add Web App & Get SDK Keys
5. Step 3 — Create Realtime Database
6. Step 4 — Create Your First Record (Test)
7. Multiple Web Apps per Project
8. Why Create More Than One Web App?
9. Important Note on API Keys
10. Example: Two Web Apps in One Project
11. Answer Summary

Introduction & Firebase Config Sample

Buat Agan² yang mau menggunakan SourceCode dari Shared Posts gw…

Agan ganti/REPLACE Firebase ID (DATABASE) pada SourceCode post² gw tersebut ya Gan / HTML View!
Agan² buat dulu yang baru sesuai petunjuk Blog Repost gw ini.

Berikut contoh/sampel punya gw pada program² tersebut:

<script>
/* =============================================== */
/*             FIREBASE INIT                       */
/* =============================================== */
firebase.initializeApp({
  apiKey: "AIzaSyAF5r6Rvu-DmoV-vf47wYTZfarpVGmNYR0",
  authDomain: "ronin-11938.firebaseapp.com",
  databaseURL: "https://ronin-11938-default-rtdb.firebaseio.com",
  projectId: "ronin-11938",
  storageBucket: "ronin-11938.firebasestorage.app",
  messagingSenderId: "823368889742",
  appId: "1:823368889742:web:609e16ace214b94a0df"
});

const rdb = firebase.database();
const refCRUD = rdb.ref("urlCrudData");  // main collection
</script>

Firebase Console Screenshots

📁 Kumpulan ScreenShot dari Console Google Firebase *Click here !!

Here is the simplest, shortest, and working guide to create a Firebase Realtime Database for your Blogger/HTML/JS project — exactly matching your current workflow (firebase.initializeApp + rdb = firebase.database()).

✅ 1. Create Firebase Project

1. Open: https://console.firebase.google.com
2. Click Add Project
3. Enter project name → example: ronin-11938
4. Click Continue
5. Enable Google Analytics? → OFF (optional)
6. Click Create Project

✅ 2. Add Web App ("</>") to Get SDK Keys

1. In your Firebase project → left menu: Build → Realtime Database
2. But first: Go to Project Overview → Add App → </> Web
3. App nickname: manu-blog-crud
4. Click Register App
5. Copy the Firebase SDK config, example:

const firebaseConfig = {
  apiKey: "AIzaSyAF5r6Rvu-DmoV-vf47wYTZfarpVGmNYR0",
  authDomain: "ronin-11938.firebaseapp.com",
  databaseURL: "https://ronin-11938-default-rtdb.firebaseio.com",
  projectId: "ronin-11938",
  storageBucket: "ronin-11938.firebasestorage.app",
  messagingSenderId: "823368889742",
  appId: "1:823368889742:web:609e16ace214b94a0df"
};
firebase.initializeApp(firebaseConfig);
const rdb = firebase.database();

✔ This is exactly the format you already used — correct.

✅ 3. Create Realtime Database

1. Go to left menu: Build → Realtime Database
2. Click Create Database
3. Choose region → asia-southeast1 (Jakarta) — best for Indonesia, fastest
4. Select Start in test mode (you can lock rules later)
5. Click Enable

🔥 NOW YOUR DATABASE IS READY

You will see the structure panel (empty) like this:

{ }

✅ 4. Create Your First Record (Test)

Paste the following HTML+JS in Blogger to test:

<script src="https://www.gstatic.com/firebasejs/8.10.0/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.10.0/firebase-database.js"></script>

<script>
  const firebaseConfig = {
    apiKey:"AIzaSyAF5r6Rvu-DmoV-vf47wYTZfarpVGmNYR0",
    authDomain:"ronin-11938.firebaseapp.com",
    databaseURL:"https://ronin-11938-default-rtdb.firebaseio.com",
    projectId:"ronin-11938",
    storageBucket:"ronin-11938.firebasestorage.app",
    messagingSenderId:"823368889742",
    appId:"1:823368889742:web:609e16ace214b94a0df"
  };

  firebase.initializeApp(firebaseConfig);
  const rdb = firebase.database();

  // write test record
  rdb.ref("test").set({
    message: "Hello Manu, Firebase Connected!"
  });
</script>

✔ After publishing → Open Firebase Console → Realtime Database. You will see:

test {
   message: "Hello Manu, Firebase Connected!"
}

---

🚀 One Firebase Project = Many Web Apps

One Firebase account can make more than one Web App, and each Web App will have its own SDK configuration keys.

Here is the exact logic:

✅ 1. One Firebase Project = Can Create MANY Web Apps

Inside 1 Firebase project, you can create:

• Multiple Web Apps
• Multiple Android Apps
• Multiple iOS Apps

Example:

ronin-11938 (Firebase project)

 ├── Web App: blogger-crud

 ├── Web App: translation-layer

 ├── Web App: youtube-indexer

 ├── Android App: manu-logger

 └── etc...

Each Web App created will generate:

• Its own apiKey
• Its own appId
• Its own messagingSenderId

BUT all Web Apps still share the same databaseURL (same Realtime Database).

🔥 Why Create More Than One Web App?

Because you might have:

• Different websites
• Different admin panels
• Test environment + Production environment
• Separate tools or prototypes (like yours)

Each needs different "identities", but still uses the same project/database.

🧠 Important Note

Even though each Web App has its own apiKey, Firebase keys are not secret. They are public and safe to include in your Blogger HTML/JS.

🧪 Example: Two Web Apps in One Project

App #1 (CRUD for Blogger)

const firebaseConfig = {
  apiKey: "AIzaSyA-APP1",
  appId: "1:12345:web:AAA",
  databaseURL: "https://ronin-11938-default-rtdb.firebaseio.com",
  ...
};

App #2 (YouTube Translation Manager)

const firebaseConfig = {
  apiKey: "AIzaSyA-APP2",
  appId: "1:12345:web:BBB",
  databaseURL: "https://ronin-11938-default-rtdb.firebaseio.com",
  ...
};

Both apps connect to the same database, storage, functions, etc.

---

🚀 Answer Summary

✔ Yes, you can create more than one Web App

✔ Each Web App = 1 unique SDK config

✔ All Web Apps still share the same Firebase project resources

✔ Safe to use for multiple Blogger systems you are building

Firebase Realtime Database Guide — Repost for Reusage