Azea – TypeScript React Admin & Dashboard Template

Firebase SetUp

step-1: Now run below commands inside our React project to install firebase latest.

npm install firebase --save 
                

step-2: Now we need to add firebase configuration details(create database on firebase) and we need to add that details in root:azea/src/layout/firebase/firebaseapi/firebaseapi.tsx file:

 const firebaseConfig = {
apiKey: <your apiKey>,
authDomain: <your authDomain>,
projectId: <your projectId>,
storageBucket: <your storageBucket>,
messagingSenderId: <your messagingSenderId>,
appId: <your appId>,
measurementId: <your measurementId>,
};
const firebaseApp = firebase.initializeApp(firebaseConfig);

const db = firebaseApp.firestore();
const auth = firebase.auth();

export { db, auth }
Firebase SetUp Remove

step-1: we have to remove firebase flie src/layout/Firebase

step-2: Remove from the Routing file src/main.tsx


<Route path={`${import.meta.env.BASE_URL}/`} element={<Firebaselayout />}>
<Route index element={<Login />} />
<Route path={`${import.meta.env.BASE_URL}/Firebaseauthentication/login`} element={<Login />} />
<Route path={`${import.meta.env.BASE_URL}/Firebaseauthentication/signup`} element={<SignUp />} />
</Route>

Note:change the index element to dashboard index page

step-3: Remove the path from the Header section src/Layouts/Header/Header.tsx


<Dropdown.Item className="dropdown-item" onClick={() => {auth.signOut();routeChange()}}>
<i className="dropdown-icon fe fe-alert-circle"></i> Sign out
</Dropdown.Item>

step-4: Remove the firbase package from package.json/package.json and re-intsall the node_modules