API GraphQL con JavaScript: tutorial paso a paso para Node.js

Entrenador de Python en Línea para Principiantes

Aprende Python fácilmente sin sobrecargarte de teoría. Resuelve tareas prácticas con verificación automática, recibe pistas y escribe código directamente en el navegador, sin instalar nada.

Start Course

GraphQL API con JavaScript: Tutorial paso a paso para Node.js

GraphQL es un poderoso lenguaje de consultas para API, desarrollado por Facebook. A diferencia de REST, donde se obtienen estructuras de datos fijas, GraphQL permite al cliente solicitar solo lo que necesita. En este tutorial, crearemos una API GraphQL completa en JavaScript usando Node.js y Apollo Server. Aprenderás a configurar el servidor, definir el esquema, escribir resolutores y ejecutar consultas y mutaciones.



¿Qué es GraphQL y por qué es necesario?

GraphQL soluciona varios problemas de las API REST:

  • Redundancia de datos: el cliente recibe solo los campos que solicitó.
  • Múltiples consultas: una sola consulta GraphQL puede reemplazar varios endpoints REST.
  • Tipado estricto: el esquema define los tipos de datos y las relaciones entre ellos.

JavaScript (Node.js) es la elección ideal para crear una API GraphQL gracias a su enorme ecosistema de paquetes y su naturaleza asíncrona.



Paso 1: Instalación y configuración del proyecto

Crea un nuevo directorio e inicializa el proyecto:

mkdir graphql-api-tutorialcd graphql-api-tutorialnpm init -y

Instala las dependencias necesarias:

npm install apollo-server graphql

Crea el archivo index.js — este será el punto de entrada de nuestra aplicación.



Paso 2: Definición del esquema GraphQL

El esquema es el núcleo de la API GraphQL. Describe los tipos de datos y las operaciones disponibles (consultas, mutaciones, suscripciones). Crearemos un esquema simple para gestionar libros.

const { ApolloServer, gql } = require('apollo-server');

const typeDefs = gql` type Book { id: ID! title: String! author: String! year: Int }

type Query { books: [Book] book(id: ID!): Book }

type Mutation { addBook(title: String!, author: String!, year: Int): Book deleteBook(id: ID!): Book }`;

Aquí hemos definido:

  • Book — un tipo objeto con los campos id, title, author, year.
  • Query — el punto de entrada para leer datos (lista de libros y libro por ID).
  • Mutation — operaciones de modificación de datos (añadir y eliminar libro).


Paso 3: Escritura de los resolutores

Los resolutores son funciones que devuelven datos para cada campo del esquema. Crearemos una base de datos ficticia (un array de objetos) e implementaremos los resolutores.

let books = [  { id: '1', title: '1984', author: 'George Orwell', year: 1949 },  { id: '2', title: 'To Kill a Mockingbird', author: 'Harper Lee', year: 1960 },];

const resolvers = { Query: { books: () => books, book: (parent, args) => books.find(book => book.id === args.id), }, Mutation: { addBook: (parent, args) => { const newBook = { id: String(books.length + 1), title: args.title, author: args.author, year: args.year, }; books.push(newBook); return newBook; }, deleteBook: (parent, args) => { const index = books.findIndex(book => book.id === args.id); if (index === -1) return null; const deletedBook = books.splice(index, 1)[0]; return deletedBook; }, },};

Observa la estructura: Query y Mutation son objetos que contienen métodos resolutores. Cada resolutor recibe tres argumentos: parent (resultado del resolutor padre), args (argumentos de la consulta) y context (objeto de contexto, por ejemplo, para autenticación).



Paso 4: Inicio del servidor y pruebas

Ahora conectamos el esquema y los resolutores en Apollo Server:

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

server.listen().then(({ url }) => { console.log(`🚀 Server ready at ${url}`);});

Blogs

Book Recommendations