GraphQL biedt een flexibel alternatief voor de klassieke REST-benadering wanneer u een API bouwt.

Een van de meest cruciale factoren waarmee rekening moet worden gehouden bij het ontwerpen van een applicatie, is het type API-architectuur dat moet worden gebruikt. Efficiënt API-ontwerp is cruciaal om ervoor te zorgen dat apps gedurende hun hele levenscyclus goed presteren.

RESTful-architectuur is de meest populaire benadering, maar heeft één belangrijk nadeel: een vaste eindpuntstructuur die vooraf bepaalde gegevens retourneert. Dit ontwerp kan leiden tot inefficiënte communicatie.

GraphQL, een alternatief voor REST, biedt daarentegen meer flexibiliteit doordat u alleen de gegevens kunt opvragen die u nodig hebt.

Wat zijn GraphQL API's?

GraphQL is een querytaal die u kunt gebruiken om backend-API's (Application Programming Interfaces) te schrijven. in tegenstelling tot REST API's, die meerdere eindpunten hebben voor verschillende gegevens, hebben GraphQL API's slechts één ingangspunt.

Klanten kunnen vanaf dit enkele toegangspunt de gegevens specificeren die ze nodig hebben in hun zoekopdrachten, waardoor het flexibeler en efficiënter wordt om alleen de noodzakelijke gegevens op te halen.

instagram viewer

Simpel gezegd, een GraphQL API implementeert de GraphQL-architectuur beschreven door de GraphQL-specificaties. Dit ontwerp omvat het definiëren van het schema, de query's en de mutaties waarmee klanten kunnen communiceren.

Hier is een vereenvoudigd overzicht van de essentiële componenten van de GraphQL API-architectuur:

  1. Schema: Een schema is een beschrijving van de typen gegevens en bewerkingen die de API biedt. Kortom, een schema definieert de structuur van de beschikbare gegevens en het type query's en mutaties dat een klant kan uitvoeren om de gegevens te wijzigen.
  2. Query's: Clients gebruiken query's om gegevens uit de database op te halen door de structuur van de gegevens die ze nodig hebben te specificeren. Bovendien kunnen ze meerdere query's in één HTTP-verzoek nesten om gerelateerde gegevens van meerdere eindpunten op te halen.
  3. Mutaties: Mutaties zijn bewerkingen die worden gebruikt om gegevens in de database te wijzigen. Klanten kunnen mutatieverzoeken versturen om gegevens aan te maken, bij te werken of te verwijderen.

Zet een MongoDB-database op

Starten, maak een MongoDB-database. Als alternatief kan dat stel gratis een MongoDB-cluster in de cloud op.Zodra u uw database hebt ingesteld, kopieert u de URI-reeks voor de databaseverbinding van MongoDB.

U kunt de code van dit project vinden in de bijbehorende GitHub-opslagplaats.

Maak een Apollo-server

Apollo-server is een populaire GraphQL-serverimplementatie waarmee u GraphQL-API's kunt bouwen in JavaScript-omgevingen, waaronder Node.js, Express en meer.

Maak een directory voor een nieuw project en CD erin:

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

Initialiseer vervolgens een nieuw Node.js-project.

npm init --ja

Deze opdracht maakt een pakket.json bestand.

Installeer de vereiste afhankelijkheden

Voer de volgende opdracht uit om de pakketten te installeren.

npm installeer apollo-server graphql mongoose

Maak tot slot een index.js bestand in de hoofdmap van uw project.

Stel de Apollo-server in

Open index.js en voeg onderstaande code toe:

const { ApolloServer } = vereisen('apollo-server');
const mangoest = vereisen('mangoest');
const typeDefs = vereisen("./graphql/typeDefs");
const oplossers = vereisen("./graphql/resolvers");
const server= nieuw ApolloServer({
 typeDefs, 
 oplossers 
});


const MONGO_URI = 'mongodb://localhost: 27017';
mangoest
 .connect (MONGO_URI, {
 gebruikNieuweUrlParser: WAAR,
 gebruik Unified Topology: WAAR,
 })
 .Dan(() => {
troosten.log(`Db Verbonden`);
opbrengst server.luister({ haven: 5000 });
 })
 .Dan((res) => {
troosten.log('Server draait op ${res.url}`);
 })
 .vangst(fout => {
troosten.log (foutmelding);
 });

Deze code initialiseert een lokale GraphQL-server met behulp van de Apollo Server-bibliotheek. Vervolgens wordt een verbinding tot stand gebracht met een MongoDB-database met de opgegeven verbindings-URI.

Merk op hoe de code twee argumenten doorgeeft aan de nieuwe instantie van ApolloServer: typeDefs en resolvers. Deze specificeren de gegevenstypen en de bewerkingen die de GraphQL API kan uitvoeren.

Nadat de verbinding met de MongoDB-database tot stand is gebracht, begint de server te luisteren op poort 5000.

Definieer het gegevensmodel

Maak een nieuwe map in de hoofdmap van uw projectmap en geef deze een naam modellen. Maak in deze map een nieuwe bestandsnaam aan dataModel.js en voeg daar de volgende code aan toe:

const {model, schema} = vereisen('mangoest');
const werknemerSchema = nieuw Schema({
 naam: Snaar,
 afdeling: Snaar,
 salaris: Snaar,
});
moduul.export = model('Medewerker', medewerkerSchema);

Definieer het GraphQL-schema

Een GraphQL-schema definieert de structuur van de gegevens die u kunt opvragen met behulp van de GraphQL API. Het schema schetst ook de query's en mutaties die de API kan uitvoeren. U kunt query's gebruiken om gegevens op te halen en mutaties om deze te wijzigen.

Maak in de hoofdmap van uw project een nieuwe map en geef deze een naam grafiekql. Voeg in deze map twee bestanden toe: typeDefs.js En resolvers.js

Voeg de onderstaande code toe aan het bestand typeDefs.js:

const {gql} = vereisen("apollo-server");
const typeDefs = gql`
 typ Medewerker {
 ik deed!
 naam: Snaar
 afdeling: Snaar
 salaris: Snaar
 }
 input MedewerkerInput {
 naam: Snaar
 afdeling: Snaar
 salaris: Snaar
 }
 typ vraag { 
 getEmployee (id: ID): Medewerker #opbrengst Medewerker op id
 werknemers: [Werknemer] #opbrengst reeks van Medewerkers
 }
 type mutatie {
 createEmployee (employeeInput: EmployeeInput): Werknemer
 updateWerknemer (id: ID, medewerkerInput: MedewerkerInput): Booleaans
 deleteEmployee (id: ID): Booleaans
 }
`;
moduul.exports = typeDefs;

Deze code hierboven gebruikt de gql functie geleverd door het apollo-serverpakket om een ​​GraphQL-schema te maken voor de werknemersgegevens.

Het schema bestaat uit vier hoofdelementen: gegevenstypen voor werknemersinformatie, invoertypen, query's en mutaties die de API kan uitvoeren.

Definieer de Resolvers voor de GraphQL API

Een resolver is een GraphQL-functie die de gegevens definieert die moeten worden doorgegeven wanneer een client een API-query verzendt om gegevens op te halen. In wezen is de primaire rol ervan om de vereiste gegevens uit de opgegeven gegevensbron op te halen en terug te sturen naar de klant.

Voeg onderstaande code toe aan de resolvers.js bestand in de grafiekql map. De resolvers worden in dit geval gespecificeerd binnen de objecten Query en Mutation.

Het Query-object definieert twee methoden: medewerkers En krijg werknemer. Deze methoden zijn verantwoordelijk voor het ophalen van werknemersgegevens uit de database op verzoek van een klant.

const Medewerker= vereisen("../modellen/werknemersModel");
// GraphQL-resolvers
const oplossers = {
 Vraag: {
 medewerkers: asynchroon () => {
poging {
const medewerkers = wachten Medewerker.zoeken({});
opbrengst medewerkers;
 } vangst (fout) {
troosten.fout (fout);
gooiennieuwFout('Kon medewerkers niet ophalen');
 }
 },
 getWerknemer: asynchroon (ouder, argumenten) => {
poging {
const werknemer = wachten Medewerker.findById (args.id);
opbrengst medewerker;
 } vangst (fout) {
troosten.fout (fout);
gooiennieuwFout('Kan werknemer niet ophalen op ID');
 }
 },
 },

Het Mutation-object heeft drie methoden: creërenWerknemer, bijwerken Medewerker, En verwijderenWerknemer. Deze methoden brengen wijzigingen aan in de gegevens die zijn opgeslagen in de MongoDB-database.

 Mutatie: {
asynchroon createEmployee (_, { medewerkerInput: { naam, afdeling, salaris } }) {
const nieuweWerknemer = nieuw Medewerker({
 naam naam,
 afdeling: afdeling,
 salaris: salaris
 });
const reactie = wachten nieuweWerknemer.save();
troosten.log (nieuwe Medewerker);


opbrengst {
 id: antwoord._id,
 ...antwoord._doc
 }
 },


asynchroon updateWerknemer (_, {id, medewerkerInput: {naam, afdeling, salaris}}) {
const bijgewerktWerknemer = wachten Medewerker.updateOne(
 { _ID kaart: ID kaart },
 { naam, afdeling, salaris }
 );


als (!updatedWerknemer) {
gooiennieuwFout(`Werknemer met ID: ${id} niet gevonden');
 }


opbrengstWAAR; // Retourneert een booleaanse waarde die aangeeft dat de update is geslaagd
 },


asynchroon deleteEmployee (_, {id}) {
const verwijderdWerknemer = wachten Medewerker.deleteOne({ _ID kaart: ID kaart });

als (!deletedEmployee || deleteEmployee.deletedCount 0) {
gooiennieuwFout(`Werknemer met ID ${id} niet gevonden');
 }


opbrengstWAAR; // Retourneert een booleaanse waarde die aangeeft dat het verwijderen is gelukt
 },
 },
};
moduul.exports = resolvers;

Voer ten slotte deze opdracht uit om de server te laten draaien:

knooppunt index.js

Zodra er een databaseverbinding tot stand is gebracht, start de server op poort 5000.

U kunt doorgaan en de functionaliteit van de GraphQL API testen door HTTP-verzoeken te doen vanuit de GraphQL-speeltuin in uw browser.

U kunt bijvoorbeeld de creërenWerknemer mutatie om nieuwe werknemersgegevens toe te voegen aan de MongoDB-database.

GraphQL Populariteit in de ontwikkelaarscommunity

GraphQL wint aan populariteit in de ontwikkelaarsgemeenschap als een alternatieve API-ontwerpbenadering voor de populaire REST-architectuur.

Dit is te danken aan het vermogen om een ​​flexibelere en efficiëntere manier te bieden om gegevens uit verschillende bronnen op te halen, allemaal vanaf één enkel toegangspunt. Dit voorkomt dat u meerdere eindpunten voor verschillende gegevens moet beheren, wat een veelvoorkomend probleem is met REST API-architectuur. Deze ontwerpoplossing stroomlijnt het proces van het bouwen en beheren van backend-API's.