API GraphQL avec JavaScript : tutoriel étape par étape pour Node.js
GraphQL est un langage de requête puissant pour les API, développé par Facebook. Contrairement à REST, où vous obtenez des structures de données fixes, GraphQL permet au client de demander uniquement ce dont il a besoin. Dans ce tutoriel, nous allons créer une API GraphQL complète en JavaScript en utilisant Node.js et Apollo Server. Vous apprendrez à configurer le serveur, définir le schéma, écrire les résolveurs et effectuer des requêtes et des mutations.
Qu'est-ce que GraphQL et pourquoi en avons-nous besoin ?
GraphQL résout plusieurs problèmes des API REST :
- Surabondance de données : le client reçoit uniquement les champs qu'il a demandés.
- Requêtes multiples : une seule requête GraphQL peut remplacer plusieurs points de terminaison REST.
- Typage strict : le schéma définit les types de données et les relations entre eux.
JavaScript (Node.js) est le choix idéal pour créer une API GraphQL grâce à son vaste écosystème de paquets et à sa nature asynchrone.
Étape 1 : Installation et configuration du projet
Créez un nouveau répertoire et initialisez le projet :
mkdir graphql-api-tutorialcd graphql-api-tutorialnpm init -yInstallez les dépendances nécessaires :
npm install apollo-server graphqlCréez le fichier index.js — ce sera le point d'entrée de notre application.
Étape 2 : Définition du schéma GraphQL
Le schéma est le cœur de l'API GraphQL. Il décrit les types de données et les opérations disponibles (requêtes, mutations, abonnements). Créons un schéma simple pour gérer les livres.
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 }`;Ici, nous avons défini :
- Book — un type objet avec les champs id, title, author, year.
- Query — le point d'entrée pour la lecture des données (liste des livres et livre par ID).
- Mutation — les opérations de modification des données (ajout et suppression de livre).
Étape 3 : Écriture des résolveurs
Les résolveurs sont des fonctions qui retournent les données pour chaque champ du schéma. Créons une base de données fictive (un tableau d'objets) et implémentons les résolveurs.
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; }, },};Remarquez la structure : Query et Mutation sont des objets contenant les méthodes résolveurs. Chaque résolveur prend trois arguments : parent (le résultat du résolveur parent), args (les arguments de la requête) et context (un objet de contexte, par exemple pour l'authentification).
Étape 4 : Lancement du serveur et test
Maintenant, connectons le schéma et les résolveurs dans Apollo Server :
const server = new ApolloServer({ typeDefs, resolvers });
server.listen().then(({ url }) => { console.log(`🚀 Serveur prêt à ${url}`);});
Blogs
Book Recommendations
Lire aussi
Travailler avec JSON en Swift : analyse et sérialisation des données
Débogage C# : techniques et outils pour développeurs experts
Fonctions Serverless en C++ sur AWS Lambda : guide complet
Injection de dépendances en PHP : Guide complet avec exemples
Docker et PHP : conteneurisation d'applications — guide complet