f52955ec94
Clean up package.json files in the `examples` directory: - Add `private: true` - Remove `version` (because they are irrelevant for packages that are not meant to be published) - Remove `name` (because they are optional for packages that are not meant to be published, and when someone clones an example, they often rename it and the property becomes stale) - Remove `author` - Remove `description` - Remove `license` Also remove `with-dynamic-app-layout` example completely, since it does the same as `layout-component` (https://github.com/vercel/next.js/pull/27121#discussion_r668178408). ## Documentation / Examples - [x] Make sure the linting passes |
||
---|---|---|
.. | ||
context | ||
fetchData | ||
firebase | ||
pages | ||
public | ||
.env.local.example | ||
.gitignore | ||
package.json | ||
README.md | ||
vercel.json |
Firebase Example
This is a simple set up for Firebase for client side applications.
The firebase app is initialized in firebase/clientApp.js
, to use you just have to import it anywhere in the app
The React Context API is used to provide user state.
Deploy your own
Deploy the example using Vercel:
How to use
Execute create-next-app
with npm or Yarn to bootstrap the example:
npx create-next-app --example with-firebase with-firebase-app
# or
yarn create next-app --example with-firebase with-firebase-app
Configuration
- Create a Firebase project and add a new app to it.
- Create a
.env.local
file and copy the contents of.env.local.example
into it:
cp .env.local.example .env.local
-
Set each variable on
.env.local
with your Firebase Configuration (found in "Project settings"). -
If you want to check the SSR page, get your account credentials from the Firebase console at Project settings > Service accounts, where you can click on Generate new private key and download the credentials as a json file. Then set
FIREBASE_CLIENT_EMAIL
andFIREBASE_PRIVATE_KEY
in.env.local
Deploy on Vercel
You can deploy this app to the cloud with Vercel (Documentation).
Deploy Your Local Project
To deploy your local project to Vercel, push it to GitHub/GitLab/Bitbucket and import to Vercel.
Important: When you import your project on Vercel, make sure to click on Environment Variables and set them to match your .env.local
file.