React Firebase
Now with smartcodehub you can actually generate a serverless working application based on on your domain models
So after a small break here i am with a brand new featture in smartcodehub
Now with smartcodehub you can actually generate a serverless working application based on on your domain models
Now if you are already famillier with firebase you can go down and see how smartcodehub can help you out in your next project
What is firebase
Firebase is a Backend-as-a-Service — BaaS — that started and grew up into a next-generation app-development platform on Google Cloud Platform.
To get started with firebase thier is a amzing document on the official sitte of google here I recommend you to go through it and follow along as to get started you need to have a firebase project (ofcourse you can create it afterwords from cli )
so below are the screen shott of how to create full serverless project based on fiebase and react
Step 1 : Visit Smartcodehub and click on start now

Step 2 : Create account
once you create your accountt you can sign in with the newly created account

Step 3 : Create Entities (Your Database tables )
go to menu expand Entities and go to create Model

you can create the entity by filling the form
We will create two tables UserRole and User


also you can have image in it create a new property image and go to propertyvalidation

now lets give a relation between entities like a user will have a userRole
create a new property called userRole and enable the hasRelationship flag

and now With has relation flag enabled if you go to property validation you will see some new context

so you have to select the entity which has relation in our case UserRole then it will enable two more selects

Select Coulumn to display is when you create entity this property will be shown in dropdown and in db select column to store will be inserted this will make more sense when we see it live
with this changs just create the resourses and you will be redirected to Entities List Page

Where you have the options to Edit your model Delete your model Make it a securitygateway (it is currently available only if you generate api )
Step 4 : Select Models and Generate Resourses
when you select the models a new button will be enables which is generate click on it and give your requirements

we will go with react firebase and press ok thats it withing few seconds it will show one more button to download the project

Clickon that cloud icon and your project will be downloded with following project structure

Now To Enable firebase you need to get your config values
Navigate to https://console.firebase.google.com/
Go to the settings of your project scroll down and you will see a option like this

selec config it will have some secret values relates to your project copy them and replace them in project at src/services/firebase.config.js
add firebase to your app
npm install -g firebase-tools
then
firebase login
then
firebase init


select what all services you need like database firestore hosting cloudfunction
minimum you have to select firestore
once done it will create few files in your project and you are all setup correctly
go to your project do
npm i
npm run start
If You recieve Error Like below
Error: Cloud resource location is not set for this project but the operation you are attempting to perform in Cloud Firestore requires it. Please see this documentation for more details: https://firebase.google.com/docs/projects/locations
Then you need to go to the project settings in firebase console thier you will have a option like

if the location is not set set it as per your preference and then try again fiebase init and you are good to go
If you still have some issues connection to your firestore
go to the Menu under develop Database and if you see something like
This project is set up to use Cloud Firestore in Datastore mode. This mode can only be accessed from Google Cloud Platform

just tgo to the url "Go to Cloud Platform " and select swith to native once done
try to run your code again with npm i
and thier are chances that you may see a new error in your web app

in this case go to the databse in firebase console

Change the rules with
rules_version = '2';
service cloud.firestore {
match /databases/{database}/documents {
match /{document=**} {
allow read, write
}
}
}
and hit publish
with change syou showuld be able to create a userrole first


