Firebase (client side SDK)

Connect to Firebase Cloud Firestore or Realtime Database


Firebase requires a specific configuration to connect from the client. Firstly, open your Firebase appProject Settings - SDK setup and configuration. Open the Config tab and copy the setup script, that will be used later for integration:
Copying Firebase config script
Please do not copy the const firebaseConfig = part!
If there is no web app connection available, create it:
How to create a web app connection in Firebase
Below is a sample of what a setup script might look like:
const firebaseConfig = {
apiKey: "AIzaSyDyWoZsfx4XnpCQ89Sf1BkDTTSWwV4m244",
authDomain: "",
databaseURL: "",
projectId: "fir-webinar-39878",
storageBucket: "",
messagingSenderId: "345464345951",
appId: "1:345464345951:web:1f33b5a91d6d954bc512ea"


Open UI Bakery app – Custom Code tab and insert Firebase connection code:
<script src=""></script>
<script src=""></script>
<script src=""></script>
firebase.initializeApp(Firebase config goes here);
If you need to enable other Firebase capabilities, you can connect the corresponding Firebase libraries. All available libraries are listed here:
Now, you can learn how to manage your data from Cloud Firestore or Realtime Database.