Facebook Authentication Example (with React & Apollo)

This is an authentication example based on the Facebook Authentication template.

Getting Started

1. Download the example

curl https://codeload.github.com/graphcool-examples/react-graphql/tar.gz/master | tar -xz --strip=1 react-graphql-master/authentication-with-facebook-and-apollo
cd authentication-with-facebook-and-apollo/server

2. Create your Graphcool service

# Install latest version of the Graphcool CLI
npm install -g graphcool

# Install dependencies and deploy service
yarn install
graphcool deploy

When prompted which cluster you want to deploy to, choose any of the Shared Clusters options (shared-eu-west-1, shared-ap-northeast-1 or shared-us-west-2).

Note: The service's schema is created based on the type definitions in ./server/types.graphql.

3. Connect the app with your GraphQL API

Copy the Simple API endpoint to ./src/index.js as the uri argument in the createNetworkInterface call:

const networkInterface = createNetworkInterface({ uri: '__SIMPLE_API_ENDPOINT__' })

4. Connect the app with Facebook

4.1. Create your Facebook app

Follow the instructions in the Facebook documentation to create your own Facebook app.

Once your app was created, you need to enable Facebook Login and configure it with the right information.

Select Facebook Login in the left sidebar (listed under PRODUCTS) and add the following URLs to the Valid OAuth redirects URIs: http://localhost:3000.

4.2. Enter Facebook app data

Open the Dashboard in the sidebar of your Facebook app and copy the App ID as well as the API Version into App.js. Set them as the values for the two constants FACEBOOK_APP_ID and FACEBOOK_API_VERSION which are defined on top of the file.

5. Install dependencies & run locally

cd ..
yarn install
yarn start

You can now use the app at http://localhost:3000.

Next steps

Help & Community

Say hello in our Slack or visit the Graphcool Forum if you run into issues or have questions. We love talking to you!

thesamkogan/goodgood