ptpaterson / netlify-faunadb-graphql-auth

Netlify functions example with faunadb, graphql, and authorization

Netlify + FaunaDB + GraphQL + Auth    

Example of using FaunaDB with Netlify functions.

This example shows how to use HTTP only cookies for auth with FaunaDB's native Graphql API.

About this application

This application is using React for the frontend, Netlify Functions for API calls, and FaunaDB as the backing database, utilizing the Graphql API with Apollo. This project is bundled with Parcel.

The todo editing is enabled by Draft.js

This project is primarily derived from netlify-faunadb-example

It has been updated to be better and more responsive stylings!

Easy setup with Netlify dev

Netlify Dev works with parcel-bundler out of the box!

(it also works with create-react-app)

So there is no need to install netlify-lambda and set up function proxies.

Setup

1. Clone down the repository

git clone https://github.com/ptpaterson/netlify-faunadb-graphql-auth.git

2. Enter the repo directory

cd netlify-faunadb-example

3. Install the dependencies

npm install
# -OR-
yarn

4. Sign up for a FaunaDB account

https://dashboard.fauna.com/accounts/register

5. Create a master database

It will become the parent database for the app database generated by the script provided.

In the Fauna Cloud Console:

• Click “New Database”
• Enter any name, e.g. “Netlify”, as the “Database Name”
• Click “Save”

6. Create a database access key

In the Fauna Cloud Console:

• Click “Security” in the left navigation
• Click “New Key”
• Make sure that the “Database” field is set to “Netlify” (or whatever you named it)
• Make sure that the “Role” field is set to “Admin”
• Enter any name, e.g. “Netlify Admin key” as the “Key Name”
• Click “Save”

7. Copy the database access key

You will save it in a .env file in the next step. You won’t get a second chance to see it!

8. Bootstrap the database

Create a .env file in the project directory and store the server secret as an environment variable:

# .env
FAUNADB_ADMIN_KEY="YOUR_SECRET_KEY_HERE"

NOTE: The bootstrap script will store another environment variable in this file called FAUNADB_PUBLIC_KEY.

9. Bootstrap your FaunaDB collection and indexes

# create database and fill with example data
npm run bootstrap

This bootstrap package.json script will create a Fauna database called auth-example using scripts/create-database.js and then fill it with example data using scripts/create-example-data.js.

Output should be similar to:

Creating your FaunaDB Database...

1) Create database "auth-example"
+ Created Database "auth-example"

2) Creating temporary key
+ Created Key "temp admin key for auth-example"

3) Uploading Graphql Schema...
o GraphQL schema imported

4) Update generated User Defined Functions...
o Updated Function "login"
o Updated Function "logout"
o Updated Function "me"
o Updated Function "user_create_todo"

5) Create custom roles...
+ Created Role "public"
+ Created Key "Public key for auth-example"
! Public client key: fnADmZcVSKFYEykYVRyVaQ5WN9RQ3OEmEMtweMWk
+ Created Role "user"
-Deleted Key "temp admin key for auth-example"

Fauna Database schema has been created
Claim your fauna database with "netlify addons:auth fauna"

10. Get netlify-cli

npm install netlify-cli -g

11. Start developing!

# serve development version
netlify dev

Updating the Schema

This project uses apollo-server-lambda for the lambda function. Lambdas are not a great solution for constantly polling remote schemas. I've also had trouble with async lambda's in general. Because of this, any time a new schema is uploaded to FaunaDB, the SDL should be downloaded and placed as a string in functions/graphql/remoteSchema.js.

netlify-faunadb-graphql-auth's Issues

Uncaught (in promise) Error: Could not identify object

Update functions are not working correctly, but add and delete are fine.

Add error handling

Most errors are silent. This is particularly surprising when login fails!

failed login still goes to the logged in screen

Entering incorrect login information tries to route to the logged in screen, but throws an error because there is no data to present.

Use `instrospectSchema`

It is possible to use introspectSchema.

It seems that the lambda is returning early before graphql server handler can act, when I try to use async/await. It worked when using Promises instead.

how latency increased by a lot because my caching of schema is not working -- it's fetching remote schema on every request. This really increased the latency of the functions.

This latency issue should be resolved before merging introspection.

The location of `faunaSchema.graphql` is incorrectly listed in the README

Readme has the wrong location. Can either update the README, or update the file location.

For the former,

Upload the schema at [`functions/graphql/faunaSchema.graphql`](https://github.com/ptpaterson/netlify-faunadb-graphql-auth/blob/master/functions/graphql/faunaSchema.graphql)

should be

Upload the schema at [`scripts/faunaSchema.graphql`](https://github.com/ptpaterson/netlify-faunadb-graphql-auth/blob/master/scripts/faunaSchema.graphql)

incorrect null check

This line is suspicious to me. I think it should check for response.data.email.

netlify-faunadb-graphql-auth/functions/graphql/overrideSchema.js

Line 34 in 7408734

if (args.data && args.data.email && args.data.email) {