REPOST for REUSAGE PURPOSE! Create Online Database by Firebase Realtime Database; multiple database for different projects can be done/allowed/also (still) FREE
Buat Agan2 yg mo menggunakan SourceCode dr Shared Posts gw ..
Agan ganti/REPLACE Firebase ID (DATABASE) pada SourceCode Post2 gw tersebut ya Gan/HTML View!
Agan2 buat dolo yg baru sesuai petunjuk Blog Repost gw ini
Berikut (contoh/sampel) punya gw pada Program2 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>
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 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)
🔥 2. Why can you 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.
🧠 3. 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 same database, storage, functions, etc.
🚀 ANSWER SUMMARY
✔ Yes, you can create more than one Web App
✔ Each Web App = 1 unique SDK config
✔ Safe to use for multiple Blogger systems you are building
Comments