Skip to main content

Command Palette

Search for a command to run...

Oracle APEX to Firebase Firestore Integration (No ACL / No Server)

Published
β€’2 min read

πŸ”₯ Oracle APEX to Firebase Firestore Integration (No ACL / No Server)

This document will guide you step-by-step on how to connect Oracle APEX directly to Firebase Firestore using only JavaScript β€” no middleware, no REST API, no ACL!

Vedio Link

Step 1: Create Firebase Project

  1. Go to Firebase Console

  2. Create a new project β†’ e.g., firestore-enable-karo-f6ae6

  3. Add a Web App () in your Firebase project settings

  4. Copy the Firebase config object that looks like this:

const firebaseConfig = {
  apiKey: "AIzaSyCEXIGUX6Zl4POHDythKrySa03KuwxBzwA",
  authDomain: "firestore-enable-karo-f6ae6.firebaseapp.com",
  projectId: "firestore-enable-karo-f6ae6",
  storageBucket: "firestore-enable-karo-f6ae6.appspot.com",
  messagingSenderId: "106631730307",
  appId: "1:106631730307:web:0e25f845c6ba5b45bff7b6"
};

Step 2: Set Firestore Rules

  1. In Firebase Console β†’ Firestore Database β†’ Rules

  2. Paste the following for testing (make secure later):

rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {
    match /apex_data/{document} {
      allow read, write: if true;
    }
  }
}

Step 3: Oracle APEX Setup

  1. Go to APEX Page 2 (or any page)

  2. Add 3 text items: P2_ID, P2_NAME, P2_EMAIL

  3. Add a button: Send to Firebase with Static ID SEND_TO_FIREBASE

Step 4: Add Firebase Scripts (Execute When Page Loads)

<script src="https://www.gstatic.com/firebasejs/9.6.1/firebase-app-compat.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.6.1/firebase-firestore-compat.js"></script>

Step 5: Add JavaScript Function (Function and Global Variable Declaration)

function sendApexDataToFirestore() {
  const firebaseConfig = {
    apiKey: "AIzaSyCEXIGUX6Zl4POHDythKrySa03KuwxBzwA",
    authDomain: "firestore-enable-karo-f6ae6.firebaseapp.com",
    projectId: "firestore-enable-karo-f6ae6",
    storageBucket: "firestore-enable-karo-f6ae6.appspot.com",
    messagingSenderId: "106631730307",
    appId: "1:106631730307:web:0e25f845c6ba5b45bff7b6"
  };
if (!firebase.apps.length) {
firebase.initializeApp(firebaseConfig);
}
const db = firebase.firestore();
const data = {
id: $v('P2_ID'),
name: $v('P2_NAME'),
email: $v('P2_EMAIL')
};
if (!data.id || !data.name || !data.email) {
alert("❗ Please fill all fields.");
return;
}
db.collection("apex_data").doc(data.id).set(data)
.then(() => {
alert("βœ… Data sent to Firebase!");
})
.catch((error) => {
console.error("❌ Firebase Error:", error);
});
}

Step 6: Button Dynamic Action

  1. Create Dynamic Action on button SEND_TO_FIREBASE

  2. Action: Execute JavaScript Code

  3. Code:

sendApexDataToFirestore();

βœ… Done! Now Run the Page

1. Fill the APEX form β†’ 2. Click β€œSend to Firebase” β†’ 3. Data appears in Firebase Firestore instantly.

You can verify in Firebase Console under the apex_data collection.


Next Steps: Want to fetch Firestore data into APEX or sync with Firebase Auth? Let’s build that too!