https://github.com/timreynolds/firebase-authentication-for-nextjs-with-apollo

An example of authentication with firebase with Next.JS and Apollo
https://github.com/timreynolds/firebase-authentication-for-nextjs-with-apollo

apollographql authentication firebase gcp graphql nextjs

Last synced: 26 days ago
JSON representation

An example of authentication with firebase with Next.JS and Apollo

• Host: GitHub
• URL: https://github.com/timreynolds/firebase-authentication-for-nextjs-with-apollo
• Owner: timReynolds
• License: mit
• Created: 2019-03-01T12:55:25.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2023-01-09T11:40:06.000Z (almost 2 years ago)
• Last Synced: 2024-04-14T23:57:44.950Z (7 months ago)
• Topics: apollographql, authentication, firebase, gcp, graphql, nextjs
• Language: JavaScript
• Size: 1.2 MB
• Stars: 7
• Watchers: 1
• Forks: 0
• Open Issues: 35
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Firebase Authentication example for Next.JS (SSR React) with Apollo

Unlike traditional frameworks that provide a server-side templating engine to create HTML which can then be shipped to the client (browser), SPA which are server-side rendered require the ability to authenticate the user against the API on both the client and the server.

Next.JS already provides many examples of various authentication setups, however, if you're trying to follow along using an external authentication provider, like firebase, along with Apollo server you'd have to follow serval examples without extensive explanation.

This repository builds on those to provide a more comprehensive example referencing the relevant documentation to help you understand what's required to create an application using these technologies which includes authentication.

## Running the example

To run the example, you'll need both client and admin credentials retrieved from your [firebase accounts](https://firebase.google.com) console.

Client credentials are required to run the [firebase web ui](https://github.com/firebase/firebaseui-web) and can be retrieved using the Web setup button in the Authentication screen in the Firebase console. These should be placed in `creds/firebase-client.json`.

```json

{

  "apiKey": "",

  "authDomain": ""

}

```

Admin credentials are required to initialise the firebase admin SDK used on the server to create cookies and verify them. These are retrieved using the Service accounts tab in the Settings screen of the Firebase console. These should be placed in `creds/firebase-admin.json`.

```json

{

  "type": "",

  "project_id": "",

  "private_key_id": "",

  "private_key": "",

  "client_email": "",

  "client_id": "",

  "auth_uri": "",

  "token_uri": "",

  "auth_provider_x509_cert_url": "",

  "client_x509_cert_url": ""

}

```

Both the server and the client can then run using `npm run dev` in both the server and client folder which will run the UI on [http://localhost:3000](http://localhost:3000)

## Explanation