B4J Tutorial [BANanoVuetifyAD3] Hosting your FireStore CRUD WebApp on FireBase Hosting For Free

Hi there

Ok granted, when it comes to creating WebApps that has to be hosted on Firebase, one has to be very careful about costs. A good friend of mine reminded me this again.
I guess for simple MVPs, proof of concepts and other things, the free tier from firebase comes very handy.

They call is the Spark Plan, it still look too good to be true for a $0/cost per month platform. These are some of the things it offererd.

1663615129626.png


So after I optimized my concept BVAD3 WebApp, I ran some simple scripts to get it hosted. It has some CRUD forms and also a leaflet map.

The deployment was easier than what I thought. Just go to hosting and follow the instructions as they are). Also when installing the Firebase CLI on your PC, just use the default parameters provided.

1663615295764.png


1. First build you app in B4J and then follow the instructions about hosting above.
2. After all that, copy all the BANano generated i.e content (assets/scripts/styles/index.html/favicon/manifest) to the public folder
3. execute firebase deploy

There is also functionality to set Github Actions and other things.


1663615509246.png


Related Content

BANanoVuetifyAD3 - Full Stack WebApp using Vuetify & FireStore (No PHP)

Happy BVAD3 Coding.

Update:

Related Content


 
Last edited:

NGUYEN TUAN ANH

Active Member
Licensed User
Hi there

Ok granted, when it comes to creating WebApps that has to be hosted on Firebase, one has to be very careful about costs. A good friend of mine reminded me this again.
I guess for simple MVPs, proof of concepts and other things, the free tier from firebase comes very handy.

They call is the Spark Plan, it still look too good to be true for a $0/cost per month platform. These are some of the things it offererd.

View attachment 133830

So after I optimized my concept BVAD3 WebApp, I ran some simple scripts to get it hosted. It has some CRUD forms and also a leaflet map.

The deployment was easier than what I thought. Just go to hosting and follow the instructions as they are). Also when installing the Firebase CLI on your PC, just use the default parameters provided.

View attachment 133831

1. First build you app in B4J and then follow the instructions about hosting above.
2. After all that, copy all the BANano generated i.e content (assets/scripts/styles/index.html/favicon/manifest) to the public folder
3. execute firebase deploy

There is also functionality to set Github Actions and other things.


View attachment 133832

Related Content

BANanoVuetifyAD3 - Full Stack WebApp using Vuetify & FireStore (No PHP)

Happy BVAD3 Coding.
This is a very useful topic and I'm very interested
I have created a BVAD3 WebApp with MogoDB CRUD forms and also a leaflet map on B4j, it works fine on my Localhost. Now, could you please guide me step by step in detail to store my WebApp and MogoDB database on FireBasse, then install hosting to be able to access Webapp from Internet
Thank you very much .!
Best Regards
 

Mashiane

Expert
Licensed User
Longtime User
This is a very useful topic and I'm very interested
I have created a BVAD3 WebApp with MogoDB CRUD forms and also a leaflet map on B4j, it works fine on my Localhost. Now, could you please guide me step by step in detail to store my WebApp and MogoDB database on FireBasse, then install hosting to be able to access Webapp from Internet
Thank you very much .!
Best Regards
The app that I'm hosting is using Firebase Firestore as a back-end, no php or any other 3rd party back-end.

I dont think hosting mongo is possible unless one is directly using Google Cloud Services,
 

NGUYEN TUAN ANH

Active Member
Licensed User
The app that I'm hosting is using Firebase Firestore as a back-end, no php or any other 3rd party back-end.

I dont think hosting mongo is possible unless one is directly using Google Cloud Services,
No problem, please guide me, I can use Firebase Realtime Database instead of MongoDB
 

NGUYEN TUAN ANH

Active Member
Licensed User
I can also not use MongoDB but use Firebase Firestore like you to work with data
"copy all the BANano generated i.e content (assets/scripts/styles/index.html/favicon/manifest) to the public folder", you mean the public folder in Firebase Storage right?
Also, I don't understand "3. execute firebase deploy" how to do ?
 
Last edited:

Mashiane

Expert
Licensed User
Longtime User
Yes, See the first post. The image is the guide, the instructions after clicking 'hosting' in your firebase will be simple to follow.

Just note that after your first successful deploy, zip the firebase generated content so that you can unzip it again if you will rerun your bvad3 project. That helped me not to redo it again as Banano deletes the contents of your deploy folder in root.
 

NGUYEN TUAN ANH

Active Member
Licensed User
i have watched this over and over again but i really don't understand how to follow it
Thanks any way @Mashiane
 

Mashiane

Expert
Licensed User
Longtime User
i have watched this over and over again but i really don't understand how to follow it
Thanks any way @Mashiane
I have updated the link in the tutorial to introduce one to Firebase from a YouTube tutorial as its beyond the scope of BVAD3.
 
Top