Introdução ao Desenvolvimento de API GraphQL

O que você aprenderá neste tutorial

✓ Conceitos básicos de GraphQL
✓ Definição de schema
✓ Implementação de resolvers
✓ Queries e mutations
✓ Como usar Apollo Server

Step 1: Configuração

npm init -y
npm install @apollo/server graphql
npm install -D typescript ts-node @types/node

Step 2: Definição de Schema

// src/schema.ts
export const typeDefs = `#graphql
  type User {
    id: ID!
    name: String!
    email: String!
    posts: [Post!]!
  }

  type Post {
    id: ID!
    title: String!
    content: String
    author: User!
  }

  type Query {
    users: [User!]!
    user(id: ID!): User
    posts: [Post!]!
  }

  type Mutation {
    createUser(name: String!, email: String!): User!
    createPost(title: String!, content: String, authorId: ID!): Post!
  }
`;

Step 3: Implementação de Resolvers

// src/resolvers.ts
const users = [
  { id: '1', name: 'Alice', email: 'alice@example.com' },
  { id: '2', name: 'Bob', email: 'bob@example.com' },
];

const posts = [
  { id: '1', title: 'Introdução ao GraphQL', content: '...', authorId: '1' },
];

export const resolvers = {
  Query: {
    users: () => users,
    user: (_: any, { id }: { id: string }) =>
      users.find(u => u.id === id),
    posts: () => posts,
  },
  Mutation: {
    createUser: (_: any, { name, email }: { name: string; email: string }) => {
      const user = { id: String(users.length + 1), name, email };
      users.push(user);
      return user;
    },
    createPost: (_: any, args: { title: string; content?: string; authorId: string }) => {
      const post = { id: String(posts.length + 1), ...args };
      posts.push(post);
      return post;
    },
  },
  User: {
    posts: (parent: { id: string }) =>
      posts.filter(p => p.authorId === parent.id),
  },
  Post: {
    author: (parent: { authorId: string }) =>
      users.find(u => u.id === parent.authorId),
  },
};

Step 4: Iniciando o Servidor

// src/index.ts
import { ApolloServer } from '@apollo/server';
import { startStandaloneServer } from '@apollo/server/standalone';
import { typeDefs } from './schema';
import { resolvers } from './resolvers';

const server = new ApolloServer({ typeDefs, resolvers });

startStandaloneServer(server, { listen: { port: 4000 } })
  .then(({ url }) => console.log(`Server ready at ${url}`));

Step 5: Executando Queries

# Lista de usuários
query {
  users {
    id
    name
    posts {
      title
    }
  }
}

# Criar usuário
mutation {
  createUser(name: "Charlie", email: "charlie@example.com") {
    id
    name
  }
}

Resumo

GraphQL permite um design de API flexível. Você pode desenvolver de forma type-safe com schema-first, e os clientes podem obter apenas os dados necessários.