GraphQL offre une alternative flexible à l'approche REST classique lorsque vous créez une API.

L'un des facteurs les plus cruciaux à prendre en compte lors de la conception d'une application est le type d'architecture d'API à utiliser. Une conception d'API efficace est essentielle pour garantir la performance des applications tout au long de leur cycle de vie.

L'architecture RESTful est l'approche la plus populaire, mais elle présente un inconvénient majeur: une structure de point de terminaison fixe qui renvoie des données prédéterminées. Cette conception peut entraîner une communication inefficace.

En revanche, GraphQL, une alternative à REST, offre plus de flexibilité en vous permettant de demander uniquement les données dont vous avez besoin.

Que sont les API GraphQL?

GraphQL est un langage de requête que vous pouvez utiliser pour écrire des API backend (Application Programming Interfaces). Contrairement à API REST, qui ont plusieurs points de terminaison pour différentes données, les API GraphQL n'ont qu'un seul point d'entrée.

instagram viewer

Les clients peuvent spécifier les données dont ils ont besoin dans leurs requêtes à partir de ce point d'entrée unique, ce qui le rend plus flexible et efficace pour récupérer uniquement les données nécessaires.

En termes simples, une API GraphQL implémente l'architecture GraphQL décrite par le Spécifications GraphQL. Cette conception implique de définir le schéma, les requêtes et les mutations avec lesquels les clients peuvent interagir.

Voici une ventilation simplifiée des composants essentiels de l'architecture de l'API GraphQL :

  1. Schéma: un schéma est une description des types de données et d'opérations fournies par l'API. Fondamentalement, un schéma définit la structure des données disponibles et le type de requêtes et de mutations qu'un client peut exécuter pour modifier les données.
  2. Requêtes: les clients utilisent des requêtes pour extraire des données de la base de données en spécifiant la structure des données dont ils ont besoin. De plus, ils peuvent imbriquer plusieurs requêtes dans une seule requête HTTP pour récupérer les données associées à partir de plusieurs points de terminaison.
  3. Mutations: Les mutations sont des opérations utilisées pour modifier les données de la base de données. Les clients peuvent envoyer des demandes de mutation pour créer, mettre à jour ou supprimer des données.

Configurer une base de données MongoDB

Pour commencer, créer une base de données MongoDB. Alternativement, vous pouvez configurer gratuitement un cluster MongoDB dans le cloudUne fois que vous avez configuré votre base de données, copiez la chaîne URI de connexion à la base de données de MongoDB.

Vous pouvez trouver le code de ce projet dans son Référentiel GitHub.

Créer un serveur Apollo

Serveur Apollo est une implémentation de serveur GraphQL populaire qui vous permettra de créer des API GraphQL dans des environnements JavaScript, notamment Node.js, Express, etc.

Créez un répertoire pour un nouveau projet et CD dans ça:

mkdir graphql-API-mongoDB
cd graphql-API-mongoDB

Ensuite, initialisez un nouveau projet Node.js.

npm init --oui

Cette commande crée un package.json déposer.

Installer les dépendances requises

Exécutez la commande suivante pour installer les packages.

npm installer apollo-server graphql mangouste

Enfin, créez un index.js fichier dans le répertoire racine de votre projet.

Configurer le serveur Apollo

Ouvrir index.js et ajoutez le code ci-dessous :

constante { ApolloServeur } = exiger('apollo-serveur');
constante mangouste = exiger('mangouste');
constante typeDefs = exiger("./graphql/typeDefs");
constante résolveurs = exiger("./graphql/résolveurs");

constante serveur = nouveau ServeurApollo({
typeDefs,
résolveurs
});

constante MONGO_URI = 'mongodb://localhost: 27017';

mangouste
.connect (MONGO_URI, {
useNewUrlParser: vrai,
useUnifiedTopology: vrai,
})
.alors(() => {
console.enregistrer(`Base de données connectée`);
retour serveur.écoute({ port: 5000 });
})
.alors((res) => {
console.enregistrer(`Serveur fonctionnant à ${res.url}`);
})
.attraper(se tromper => {
console.log (err.message);
});

Ce code initialise un serveur GraphQL local à l'aide de la bibliothèque Apollo Server. Il établit ensuite une connexion à une base de données MongoDB avec l'URI de connexion donné.

Remarquez comment le code passe deux arguments à la nouvelle instance d'ApolloServer: typeDefs et résolveurs. Ceux-ci spécifient les types de données et les opérations que l'API GraphQL peut exécuter.

Une fois la connexion à la base de données MongoDB établie, le serveur commence à écouter sur le port 5000.

Définir le modèle de données

Créez un nouveau dossier dans le répertoire racine de votre dossier de projet et nommez-le des modèles. Dans ce dossier, créez un nouveau nom de fichier dataModel.js et ajoutez-y le code suivant :

constante {modèle, Schéma} = exiger('mangouste');

constante employSchema = nouveau Schéma({
nom: Chaîne,
département: Chaîne,
salaire: Chaîne,
});

module.exports = modèle('Employé', employéSchéma);

Définir le schéma GraphQL

Un schéma GraphQL définit la structure des données que vous pouvez interroger à l'aide de l'API GraphQL. Le schéma décrit également les requêtes et les mutations que l'API peut exécuter. Vous pouvez utiliser des requêtes pour récupérer des données et des mutations pour les modifier.

Dans le répertoire racine de votre projet, créez un nouveau dossier et nommez-le graphql. Dans ce dossier, ajoutez deux fichiers: typeDefs.js et résolveurs.js

Ajoutez le code ci-dessous dans le fichier typeDefs.js :

constante {gql} = exiger("apollo-serveur");

constante typeDefs = gql`
type Employé {
je l'ai fait!
nom: Chaîne
département: Chaîne
salaire: Chaîne
}
entrée EmployeeInput {
nom: Chaîne
département: Chaîne
salaire: Chaîne
}
tapez Requête {
getEmployee (id: ID): numéro d'employéretour Employé par identifiant
employés: [Employé] #retour déployer de Employés
}
type Mutation {
createEmployee (employeeInput: EmployeeInput): Employé
updateEmployee (id: ID, employéEntrée: EntréeEmployé): booléen
deleteEmployee (id: ID): booléen
}
`;

module.exports = typeDefs ;

Ce code ci-dessus utilise le gql fonction fournie par le package apollo-server pour créer un schéma GraphQL pour les données Employee.

Le schéma se compose de quatre éléments principaux: les types de données pour les informations sur les employés, les types d'entrée, les requêtes et les mutations que l'API peut effectuer.

Définir les résolveurs pour l'API GraphQL

Un résolveur est une fonction GraphQL qui définit les données à transmettre lorsqu'un client envoie une requête API pour récupérer des données. Essentiellement, son rôle principal est de récupérer les données requises à partir de la source de données spécifiée et de les renvoyer au client.

Ajoutez le code ci-dessous au résolveurs.js dossier dans le graphql dossier. Les résolveurs, dans ce cas, sont spécifiés dans les objets Query et Mutation.

L'objet Query définit deux méthodes: employés et getEmployee. Ces méthodes sont chargées de récupérer les données des employés de la base de données à la demande d'un client.

constante Employé= exiger("../modèles/employésModèle");

// Résolveurs GraphQL
constante résolveurs = {
Mettre en doute: {
employés: asynchrone () => {
essayer {
constante employés = attendre Employé.find({});
retour employés;
} attraper (erreur) {
console.error (erreur);
lancernouveauErreur("Échec de la récupération des employés");
}
},
getEmployee: asynchrone (parent, arguments) => {
essayer {
constante employé = attendre Employee.findById (args.id);
retour employé;
} attraper (erreur) {
console.error (erreur);
lancernouveauErreur("Échec de la récupération de l'employé par ID");
}
},
},

L'objet Mutation a trois méthodes: créerEmployé, mettre à jourEmployé, et supprimerEmployé. Ces méthodes modifient les données stockées dans la base de données MongoDB.

 Mutation: {
asynchrone créerEmployé (_, { employéEntrée: { nom, service, salaire } }) {
constante nouvelEmployé = nouveau Employé({
nom nom,
département: département,
salaire: salaire
});

constante réponse = attendre nouvelEmployé.save();
console.log (nouvelEmployé);

retour {
identifiant: réponse._id,
...réponse._doc
}
},

asynchrone mettre à jourEmployé (_, {id, employéEntrée: {nom, département, salaire}}) {
constante employé mis à jour = attendre Employé.updateOne(
{ _identifiant: identifiant },
{ nom, département, salaire }
);

si (!Employé mis à jour) {
lancernouveauErreur(`Employé avec pièce d'identité: ${id} introuvable`);
}

retourvrai; // Renvoie une valeur booléenne indiquant le succès de la mise à jour
},

asynchrone supprimerEmployé (_, {id}) {
constante suppriméEmployé = attendre Employé.deleteOne({ _identifiant: identifiant });

si (!DeletedEmployee || suppriméEmployee.deletedCount 0) {
lancernouveauErreur(`Employé avec pièce d'identité ${id} introuvable`);
}

retourvrai; // Renvoie une valeur booléenne indiquant le succès de la suppression
},
 },
};

module.exports = résolveurs ;

Enfin, exécutez cette commande pour lancer le serveur :

index de nœud.js

Une fois qu'il a établi une connexion à la base de données, le serveur démarre sur le port 5000.

Vous pouvez continuer et tester la fonctionnalité de l'API GraphQL en effectuant des requêtes HTTP à partir du terrain de jeu GraphQL dans votre navigateur.

Par exemple, vous pouvez utiliser le créerEmployé mutation pour ajouter de nouvelles données d'employés dans la base de données MongoDB.

Popularité de GraphQL dans la communauté des développeurs

GraphQL gagne du terrain dans la communauté des développeurs en tant qu'approche de conception d'API alternative à l'architecture REST populaire.

Cela est dû à sa capacité à fournir un moyen plus flexible et efficace de récupérer des données à partir de diverses sources, le tout à partir d'un point d'entrée unique. Cela évite d'avoir à gérer plusieurs points de terminaison pour différentes données, ce qui est un problème courant avec l'architecture de l'API REST. Cette solution de conception rationalise le processus de création et de gestion des API backend.