Firebase

VITE (TS)

At present, Firebase requires you to set a secret in the following file. For more details, refer to Firebase here: https://firebase.google.com/docs/reference/rest/auth

1. Set Firebase Config in .env

.env

VITE_APP_FIREBASE_API_KEY=
VITE_APP_FIREBASE_AUTH_DOMAIN=
VITE_APP_FIREBASE_PROJECT_ID=
VITE_APP_FIREBASE_STORAGE_BUCKET=
VITE_APP_FIREBASE_MESSAGING_SENDER_ID=
VITE_APP_FIREBASE_APP_ID=
VITE_APP_FIREBASE_MEASUREMENT_ID=

1. Change AuthProvider

src\App.tsx

// Replace at line 17
import { FirebaseProvider as AuthProvider } from 'contexts/FirebaseContext';

1. Change auth Hooks

   1. Comment out another context in the following file and uncomment the Firebase one.

src\hooks\useAuth.ts

import AuthContext from 'contexts/FirebaseContext';

1. Change Auth Login Method

src/config.ts

export const APP_AUTH: AuthProvider = AuthProvider.FIREBASE;

VITE (JS)

At present, Firebase requires you to set a secret in the following file. For more details, refer to Firebase here: https://firebase.google.com/docs/reference/rest/auth

1. Set Firebase Config in .env

.env

VITE_APP_FIREBASE_API_KEY=
VITE_APP_FIREBASE_AUTH_DOMAIN=
VITE_APP_FIREBASE_PROJECT_ID=
VITE_APP_FIREBASE_STORAGE_BUCKET=
VITE_APP_FIREBASE_MESSAGING_SENDER_ID=
VITE_APP_FIREBASE_APP_ID=
VITE_APP_FIREBASE_MEASUREMENT_ID=

1. Change AuthProvider

src\App.jsx

// Replace at line 17
import { FirebaseProvider as AuthProvider } from 'contexts/FirebaseContext';

1. Change auth Hooks

   1. Comment out another context in the following file and uncomment the Firebase one.

src\hooks\useAuth.js

import AuthContext from 'contexts/FirebaseContext';

1. Change Auth Login Method

src/config.js

export const APP_AUTH: AuthProvider = AuthProvider.FIREBASE;

NEXT (TS)

At present, Firebase requires you to set a secret in the following file. For more details, refer to Firebase here: https://firebase.google.com/docs/reference/rest/auth

1. Set Firebase Config in .env

.env

NEXT_PUBLIC_FIREBASE_API_KEY=
NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=
NEXT_PUBLIC_FIREBASE_PROJECT_ID=
NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET=
NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID=
NEXT_PUBLIC_FIREBASE_APP_ID=
NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID=

1. Change AuthProvider

src/store/ProviderWrapper.tsx

// Replace at line 27
import { FirebaseProvider as AuthProvider } from 'contexts/FirebaseContext';

1. Change auth Hooks

   1. Comment out another context in the following file and uncomment the Firebase one.

src\hooks\useAuth.ts

import AuthContext from 'contexts/FirebaseContext';

1. Change Auth Login Method

src/config.ts

export const APP_AUTH: AuthProvider = AuthProvider.FIREBASE;

NEXT (JS)

At present, Firebase requires you to set a secret in the following file. For more details, refer to Firebase here: https://firebase.google.com/docs/reference/rest/auth

1. Set Firebase Config in .env

.env

NEXT_PUBLIC_FIREBASE_API_KEY=
NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=
NEXT_PUBLIC_FIREBASE_PROJECT_ID=
NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET=
NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID=
NEXT_PUBLIC_FIREBASE_APP_ID=
NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID=

1. Change AuthProvider

src/store/ProviderWrapper.jsx

// Replace at line 27
import { FirebaseProvider as AuthProvider } from 'contexts/FirebaseContext';

1. Change auth Hooks

   1. Comment out another context in the following file and uncomment the Firebase one.

src\hooks\useAuth.js

import AuthContext from 'contexts/FirebaseContext';

1. Change Auth Login Method

src/config.js

export const APP_AUTH: AuthProvider = AuthProvider.FIREBASE;