An Next.js example repo for building authenticated pages with Firebase Authentication, cookies, and getServerSideProps
This project demonstrates how to implement authenticated server-side rendering with Next.js and Firebase Authentication.
Update November 19, 2020: A bug has been fixed where the Firebase tokens would expire after an hour without being refreshed. All tokens are now force refreshed every 10 minutes.
Update November 9, 2020: this repo has been updated to use the redirect functionality introduced in
[email protected]. Currently you must be on thecanaryrelease of Next for this approach to work (yarn add [email protected]).
Full walkthrough and documentation here: Authenticated server-side rendering with Next.js and Firebase.
To run this example:
git clone [email protected]:vriad/next-firebase-ssr.git
cd next-firebase-ssr
yarn
firebaseClient.ts. To get these, go to the Firebase Console > open your project > Gear Icon > Project Settings > General > Your apps > Firebase SDK Snippet > click the "Config" radio button > copy/paste.
.env.local.exampleand rename it to
.env.local. This is the file where you will put your secret Firebase credentials. Copy/paste the values from the private key JSON file over to the new
.env.localfile:
privateKeybecomes
PRIVATE_KEY,
project_idbecomes
PROJECT_ID, and
clientEmailbecomes
CLIENT_EMAIL.
yarn dev
localhost:3000