Introduction à la fabrication d'API et d'applications GraphQL dans Node.js

La communication et le transfert de données entre le frontal et le backend de toute application se produisent via des API (interface de programmation d'application). Il existe de nombreux types d'API différents pour communiquer entre les applications avant et back-end comme l'API RESTFul, l'API SOAP, GraphQL, etc. L'API GraphQL est une technologie relativement nouvelle, et elle est beaucoup plus rapide que les autres types d'API disponibles. La récupération des données de la base de données à l'aide de l'API GraphQL est beaucoup plus rapide que l'API REST. Lors de l'utilisation de l'API GraphQL, le client a un contrôle pour récupérer uniquement les données requises au lieu d'obtenir tous les détails; C'est pourquoi l'API GraphQL fonctionne plus rapidement que l'API REST.

Installation de packages

Nous allons construire un nœud.Application JS à l'aide de l'API GraphQL, nous devons donc installer le nœud.JS et NPM pour cela avant de commencer le projet.

ubuntu @ ubuntu: ~ $ sudo apt-get update -y
ubuntu @ ubuntu: ~ $ sudo apt-get install nodejs
ubuntu @ ubuntu: ~ $ sudo apt-get install npm

Configuration du projet

Nous utiliserons le framework «express» à partir du nœud.JS pour construire notre application. Créez un répertoire nommé «GraphQL» et lancez le projet.

ubuntu @ ubuntu: ~ $ mkdir graphql
ubuntu @ ubuntu: ~ $ cd graphql /
Ubuntu @ Ubuntu: ~ $ npm init -y

Configuration de MongoDB

Dans notre projet GraphQL, nous utiliserons MongoDB comme base de données. MongoDB est une base de données de schémas et stocke les données sous la forme de paires clés. Afin d'installer MongoDB, suivez les étapes données.

Importer la clé publique GPG pour MongoDB.

ubuntu @ ubuntu: ~ $ wget -qo - https: // www.mongodb.org / static / pgp / server-4.4.ASC | sudo apt-key ajouter -

Créez le fichier de liste pour MongoDB.

ubuntu @ ubuntu: ~ $ echo "deb [arch = amd64, arm64] https: // repo.mongodb.org / apt / ubuntu bionic / mongodb-org / 4.4 Multiverse "| Sudo Tee / etc / APT / Sources.liste.D / MONGODB-ORG-4.4.liste

Mettre à jour les référentiels locaux.

ubuntu @ ubuntu: ~ $ sudo apt-get update -y

Installer le package MongoDB.

ubuntu @ ubuntu: ~ $ sudo apt-get install -y mongodb-org

Démarrer et activer Mongod.service.

ubuntu @ ubuntu: ~ $ sudo systemctl start mongod.service
ubuntu @ ubuntu: ~ $ sudo systemctl activer mongod.service

Installation des modules NPM

Pour notre application GraphQL, nous devons installer certains packages NPM. Nous installerons CORS, Express, Body-Parser, Mongoose, etc.

ubuntu @ ubuntu: ~ $ cd graphql /
Ubuntu @ Ubuntu: ~ $ npm installer Cors Express Body-Parser Mongoose - Save

Pour créer une API GraphQL, nous devons installer un package NPM supplémentaire nommé 'Apollo-Server-Express.'Ce package NPM est utilisé pour exécuter GraphQL Server avec tout le nœud.frameworks JS HTTP comme 'Express.'

ubuntu @ ubuntu: ~ $ npm installer Apollo-Server-Express - Save

Définition du schéma MongoDB

Nous avons maintenant notre environnement configuré pour notre application GraphQL dans Node.js, et il est temps de définir un schéma pour notre application. Créer un fichier modèle / étudiant.JS 'dans le répertoire racine du projet.

// Définition du schéma étudiant
const Mongoose = require («Mongoose»);
Const Studentschema = New Mongoose.Schéma(
nom:
Type: chaîne,
requis: vrai
,
classe:
Type: numéro,
requis: vrai
,
majeur:
Type: chaîne,
requis: vrai

,
Timestaps: vrai
);
Const étudiant = Mongoose.Modèle («étudiant», Studentschema);
module.Exports = Student, Studentschema

Dans le schéma défini ci-dessus, chaque élève doit avoir un nom, une classe et une majeure.

API GraphQL de construction

Après avoir créé le schéma étudiant, nous allons maintenant construire une API GraphQL. Créer un schéma.JS 'pour écrire des paramètres graphiques. Il existe deux paramètres, «types» et «résolveurs», utilisés dans l'API GraphQL. Dans «Types», nous spécifierons notre schéma, les requêtes (e.g., Faire des demandes de get) et des mutations (e.g., Faire des demandes de mise à jour ou de suppression) au schéma spécifié. Nous rédigerons les différentes méthodes définies dans les «types» pour relier les requêtes et les mutations à la base de données dans «Resolvers.'

// Importation de schéma et de module
const gql = require ('apollo-server-express');
const étudiant = require ('./ modèles / étudiant ').Étudiant;
// Définition du schéma, de la requête et du type de mutation
const typedefs = gql '
Tapé étudiant
je l'ai fait!,
nom: chaîne!,
Classe: int!,
Major: chaîne!

Type Query
GetStudents: [Étudiant],
getStudentByid (ID: ID!): Étudiant

mutation de type
addStudent (nom: chaîne!, Classe: int!, Major: chaîne! ): Étudiant
UpdateStudent (nom: chaîne!, Classe: int!, Major: chaîne! ): Étudiant
DeleteStudent (ID: ID! ): Étudiant
'
// Définir les résolveurs
const Resolvers =
Mettre en doute:
GetStudents: (parent, args) =>
étudiant de retour.trouver();
,
getStudentByid: (parent, args) =>
étudiant de retour.findbyid (args.identifiant);

,
Mutation:
addStudent: (parent, args) =>
Laissez Student = New Student (
Nom: Args.nom,
Classe: Args.classe,
Major: Args.majeur
);
étudiant de retour.sauvegarder();
,
UpdateStudent: (parent, args) =>
si(!args.id) return;
étudiant de retour.FindOnOnDupdate (
_id: args.identifiant
,

$ set:
Nom: Args.nom,
Classe: Args.classe,
Major: Args.majeur

,
new: true, (err, étudiant) =>
if (err)
console.log (err);
autre ;
)



module.exportations =
typeds,
résolve

Création du serveur API GraphQL

Maintenant, nous avons presque fini de créer l'application GraphQL. La seule étape restante est de créer le serveur. Créer un fichier nommé 'App.JS 'pour configurer les paramètres du serveur.

// Importation de packages requis
const Express = require ('express');
const Mongoose = require («Mongoose»);
const bodyParser = require ('body-parser');
const CORS = require ('CORS');
const apollOserver = require ('apollo-server-express');
// Importation de schéma
const typedefs, résolvers = require ('./schéma');
// Connexion à MongoDB
const Url = «MongoDB: // 127.0.0.1: 27017 / étudiants »;
const Connect = Mongoose.connect (url, usenewurlparser: true);
connecter.alors ((db) =>
console.log («connexion réussie»);
, (err) =>
console.log (err);
);
// Création d'un serveur
const Server = new ApollOserver (
typedefs: typedefs,
Resolvers: Resolvers
);
const app = express ();
appliquer.Utiliser (BodyParser.JSON ());
appliquer.use ('*', cors ());
serveur.applaitermiddleware (app);
appliquer.Écoutez (8000, () =>

console.log («écouter 8000»);
)

Test de l'API GraphQL

Nous avons notre serveur GraphQL en cours d'exécution sur le port 8000, et il est temps de tester l'API GraphQL. Ouvrez la page Web GraphQL dans le navigateur en visitant l'URL suivante.

http: // localhost: 8000 / graphQL

Et il ouvrira la page Web suivante.

Ajoutez l'étudiant à la base de données à l'aide de l'API GraphQL.

De même, ajoutez plus d'étudiants et après avoir ajouté l'étudiant, obtenez tous les étudiants en utilisant l'API GraphQL.

Notez l'ID de l'un des étudiants et obtenez l'élève spécifique en utilisant son identifiant.

Conclusion

La récupération des données de la base de données à l'aide de l'API REST standard rend la requête lente car parfois nous obtenons plus de données que requises. En utilisant GraphQL, nous pouvons récupérer exactement les données requises qui rendent l'API GraphQL plus rapidement. Dans ce projet de démonstration, nous n'avons qu'un seul schéma, nous avons donc créé une API GraphQL pour ce schéma unique. De plus, nous avons défini trois à quatre méthodes pour le schéma. Vous pouvez créer plus d'une requête ou des mutations en fonction de votre application.