This is a Next.js project bootstrapped with create-next-app.
The NextJs Firebase Starter Kit
| folder | purpose |
|---|---|
| store | An empty Redux store (import anywhere using '@store' alias) |
| components | Components folder for you app ( sample auth components are created. import anywhere using '@components' alias ) |
| firebase | Contains firebase cloud function in function.js file. index.ts is where we initialize and export various firebase services |
Create .env file and copy .env.template 's content.
Create a firebase project and paste the corresponding project config variables in the .env file
Make sure you upgrage to Firebase Blaze plan to use cloud functions.
Currently the app is using light-theme. You can comment out lightTheme import in the pages/_app.tsx and instead import the darkTheme. Make sure you provide the same to the <ThemeProvier />
Install all the dependencies:
npm install
#or
yarn installNow, run the development server:
npm run dev
# or
yarn devOpen http://localhost:3000 with your browser to see the result.
You can start editing the page by modifying pages/index.tsx. The page auto-updates as you edit the file.
API routes can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in pages/api/hello.ts.
The pages/api directory is mapped to /api/*. Files in this directory are treated as API routes instead of React pages.
Make sure that you are on the Blaze plan. Firebase does not support SSR, hence we will deploy a cloud function that will handle all the requests to the app.
You can find the function in firebase/function.js file.
First login to firebase using
firebase loginthen run the following command to deploy to firebase
npm run deploy
# or
yarn deploy