Federated authentication in GraphQL - Mini Project: Build & Apply

Federated Authentication Setup with GraphQL

📖 Scenario: You are building a GraphQL API that supports federated authentication. This means users can log in using different identity providers like Google or Facebook. Your API needs to store user data and their authentication provider information in a database.

🎯 Goal: Create a simple GraphQL schema and resolver setup that stores user information along with their authentication provider. You will build the data structure, add a configuration for supported providers, implement the core logic to link users with providers, and complete the setup with a query to fetch user details.

📋 What You'll Learn

Create a GraphQL type User with fields id, name, and authProvider

Create a list called users to store user data

Add a configuration list supportedProviders with 'Google' and 'Facebook'

Implement a mutation addUser that adds a user only if the authProvider is supported

Implement a query getUser to fetch user details by id

💡 Why This Matters

🌍 Real World

Federated authentication is common in apps that allow users to log in using third-party accounts like Google or Facebook. This project simulates storing and managing such user data in a GraphQL API.

💼 Career

Understanding how to handle federated authentication and manage user data is essential for backend developers working on modern web applications with social login features.

1

Define User type and initial users list

Create a GraphQL type called User with fields id (ID!), name (String!), and authProvider (String!). Then create a list called users with two users: one with id: "1", name: "Alice", authProvider: "Google" and another with id: "2", name: "Bob", authProvider: "Facebook".

GraphQL

type User {
  id: ID!
  name: String!
  authProvider: String!
}

const users = [
  // Your code here
]

Need a hint?

Define the User type with the three fields exactly as named. Then create the users list with two user objects matching the given details.

2

Add supported authentication providers configuration

Create a constant list called supportedProviders containing the strings "Google" and "Facebook".

GraphQL

type User {
  id: ID!
  name: String!
  authProvider: String!
}

const users = [
  { id: "1", name: "Alice", authProvider: "Google" },
  { id: "2", name: "Bob", authProvider: "Facebook" }
]

// Your code here

Need a hint?

Define the supportedProviders list exactly with the two provider names as strings.

3

Implement addUser mutation with provider check

Add a mutation resolver function called addUser that takes id, name, and authProvider as arguments. It should add a new user to the users list only if authProvider is included in supportedProviders. Use supportedProviders.includes(authProvider) to check support.

GraphQL

type User {
  id: ID!
  name: String!
  authProvider: String!
}

const users = [
  { id: "1", name: "Alice", authProvider: "Google" },
  { id: "2", name: "Bob", authProvider: "Facebook" }
]

const supportedProviders = ["Google", "Facebook"]

const resolvers = {
  Mutation: {
    // Your code here
  }
}

Need a hint?

Inside the addUser mutation, check if authProvider is in supportedProviders. If yes, create a new user object and add it to users. Return the new user. Otherwise, return null.

4

Add getUser query to fetch user by id

Add a query resolver function called getUser that takes id as an argument and returns the user object from users with the matching id. Use users.find(user => user.id === id) to find the user.

GraphQL

type User {
  id: ID!
  name: String!
  authProvider: String!
}

const users = [
  { id: "1", name: "Alice", authProvider: "Google" },
  { id: "2", name: "Bob", authProvider: "Facebook" }
]

const supportedProviders = ["Google", "Facebook"]

const resolvers = {
  Mutation: {
    addUser: (_, { id, name, authProvider }) => {
      if (supportedProviders.includes(authProvider)) {
        const newUser = { id, name, authProvider };
        users.push(newUser);
        return newUser;
      }
      return null;
    }
  },
  Query: {
    // Your code here
  }
}

Need a hint?

In the Query resolver, add getUser that returns the user matching the given id from the users list.