GraphQL bietet eine flexible Alternative zum klassischen REST-Ansatz, wenn Sie eine API erstellen.

Einer der wichtigsten Faktoren, die beim Entwerfen einer Anwendung zu berücksichtigen sind, ist die Art der zu verwendenden API-Architektur. Ein effizientes API-Design ist entscheidend, um sicherzustellen, dass Apps während ihres gesamten Lebenszyklus leistungsfähig sind.

Die RESTful-Architektur ist der beliebteste Ansatz, hat aber einen wesentlichen Nachteil: eine feste Endpunktstruktur, die vorgegebene Daten zurückgibt. Dieses Design kann zu einer ineffizienten Kommunikation führen.

Im Gegensatz dazu bietet GraphQL – eine Alternative zu REST – mehr Flexibilität, da Sie nur die Daten anfordern können, die Sie benötigen.

Was sind GraphQL-APIs?

GraphQL ist eine Abfragesprache, mit der Sie Backend-APIs (Application Programming Interfaces) schreiben können. nicht wie REST-APIs, die mehrere Endpunkte für unterschiedliche Daten haben, haben GraphQL-APIs nur einen Einstiegspunkt.

Kunden können die Daten, die sie in ihren Abfragen benötigen, von diesem einzigen Einstiegspunkt aus angeben, wodurch es flexibler und effizienter wird, nur die erforderlichen Daten abzurufen.

instagram viewer

Einfach ausgedrückt implementiert eine GraphQL-API die von beschriebene GraphQL-Architektur GraphQL-Spezifikationen. Dieser Entwurf umfasst die Definition des Schemas, der Abfragen und Mutationen, mit denen Clients interagieren können.

Hier ist eine vereinfachte Aufschlüsselung der wesentlichen Komponenten der GraphQL-API-Architektur:

  1. Schema: Ein Schema ist eine Beschreibung der Datentypen und Vorgänge, die die API bereitstellt. Grundsätzlich definiert ein Schema die Struktur der verfügbaren Daten und die Art der Abfragen und Mutationen, die ein Client ausführen kann, um die Daten zu ändern.
  2. Abfragen: Clients verwenden Abfragen, um Daten aus der Datenbank abzurufen, indem sie die Struktur der benötigten Daten angeben. Darüber hinaus können sie mehrere Abfragen in einer einzigen HTTP-Anforderung verschachteln, um zugehörige Daten von mehreren Endpunkten abzurufen.
  3. Mutationen: Mutationen sind Operationen, die verwendet werden, um Daten in der Datenbank zu ändern. Clients können Mutationsanforderungen senden, um Daten zu erstellen, zu aktualisieren oder zu löschen.

Richten Sie eine MongoDB-Datenbank ein

Um loszulegen, Erstellen Sie eine MongoDB-Datenbank. Alternativ können Sie Richten Sie kostenlos einen MongoDB-Cluster in der Cloud ein.Sobald Sie Ihre Datenbank eingerichtet haben, kopieren Sie den URI-String der Datenbankverbindung von MongoDB.

Sie finden den Code dieses Projekts in seiner GitHub-Repository.

Erstellen Sie einen Apollo-Server

Apollo-Server ist eine beliebte GraphQL-Serverimplementierung, mit der Sie GraphQL-APIs in JavaScript-Umgebungen erstellen können, einschließlich Node.js, Express und mehr.

Erstellen Sie ein Verzeichnis für ein neues Projekt und CD hinein:

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

Als nächstes initialisieren Sie ein neues Node.js-Projekt.

npm init - ja

Dieser Befehl erstellt eine Paket.json Datei.

Installieren Sie die erforderlichen Abhängigkeiten

Führen Sie den folgenden Befehl aus, um die Pakete zu installieren.

npm installiert apollo-server graphql mongoose

Erstellen Sie abschließend eine index.js Datei im Stammverzeichnis Ihres Projekts.

Richten Sie den Apollo-Server ein

Offen index.js und fügen Sie den folgenden Code hinzu:

konst {ApolloServer} = erfordern('Apollo-Server');
konst Mungo = erfordern('Mungo');
konst typeDefs = erfordern("./graphql/typeDefs");
konst Auflöser = erfordern("./graphql/resolvers");
konst Server = neu ApolloServer({
 TypDefs, 
 Resolver 
});


konst MONGO_URI = 'mongodb://localhost: 27017';
Mungo
 .connect (MONGO_URI, {
 useNewUrlParser: WAHR,
 useUnifiedTopology: WAHR,
 })
 .Dann(() => {
Konsole.Protokoll(`Db Verbunden`);
zurückkehren server.listen({ Hafen: 5000 });
 })
 .Dann((res) => {
Konsole.Protokoll(`Server läuft auf ${res.url}`);
 })
 .fangen(irren => {
Konsole.log (Fehlermeldung);
 });

Dieser Code initialisiert einen lokalen GraphQL-Server unter Verwendung der Apollo Server-Bibliothek. Anschließend stellt es eine Verbindung zu einer MongoDB-Datenbank mit dem angegebenen Verbindungs-URI her.

Beachten Sie, wie der Code zwei Argumente an die neue Instanz von ApolloServer übergibt: typeDefs und Resolver. Diese geben die Datentypen und die Operationen an, die die GraphQL-API ausführen kann.

Nachdem die Verbindung zur MongoDB-Datenbank hergestellt wurde, beginnt der Server, Port 5000 zu überwachen.

Definieren Sie das Datenmodell

Erstellen Sie einen neuen Ordner im Stammverzeichnis Ihres Projektordners und benennen Sie ihn Modelle. Erstellen Sie in diesem Ordner einen neuen Dateinamen dataModel.js und fügen Sie den folgenden Code hinzu:

konst {Modell, Schema} = erfordern('Mungo');
konst MitarbeiterSchema = neu Schema({
 Name: Schnur,
 Abteilung: Schnur,
 Gehalt: Schnur,
});
Modul.exports = Modell ('Mitarbeiter', MitarbeiterSchema);

Definieren Sie das GraphQL-Schema

Ein GraphQL-Schema definiert die Struktur der Daten, die Sie mit der GraphQL-API abfragen können. Das Schema umreißt auch die Abfragen und Mutationen, die die API ausführen kann. Sie können Abfragen verwenden, um Daten abzurufen, und Mutationen, um sie zu ändern.

Erstellen Sie im Stammverzeichnis Ihres Projekts einen neuen Ordner und benennen Sie ihn graphql. Fügen Sie in diesem Ordner zwei Dateien hinzu: typeDefs.js Und resolvers.js

Fügen Sie den folgenden Code in der Datei typeDefs.js hinzu:

konst {gql} = erfordern("Apollo-Server");
konst typeDefs = gql`
 Typ Mitarbeiter {
 Ich tat!
 Name: Schnur
 Abteilung: Schnur
 Gehalt: Schnur
 }
 Eingabe MitarbeiterEingabe {
 Name: Schnur
 Abteilung: Schnur
 Gehalt: Schnur
 }
 Typ Abfrage { 
 getEmployee (id: ID): Mitarbeiternummerzurückkehren Mitarbeiter nach ID
 Mitarbeiter: [Mitarbeiter] #zurückkehren Reihe von Mitarbeiter
 }
 Typ Mutation {
 createEmployee (employeeInput: EmployeeInput): Mitarbeiter
 updateMitarbeiter (id: ID, MitarbeiterInput: Mitarbeitereingabe): Boolesch
 Mitarbeiter löschen (ID: ID): Boolesch
 }
`;
Modul.exports = typeDefs;

Dieser obige Code verwendet die gql Funktion, die vom apollo-server-Paket bereitgestellt wird, um ein GraphQL-Schema für die Mitarbeiterdaten zu erstellen.

Das Schema besteht aus vier Hauptelementen: Datentypen für Mitarbeiterinformationen, Eingabetypen, Abfragen und Mutationen, die die API ausführen kann.

Definieren Sie die Resolver für die GraphQL-API

Ein Resolver ist eine GraphQL-Funktion, die die weiterzugebenden Daten definiert, wenn ein Client eine API-Anfrage zum Abrufen von Daten sendet. Im Wesentlichen besteht seine Hauptaufgabe darin, die erforderlichen Daten aus der angegebenen Datenquelle abzurufen und an den Client zurückzugeben.

Fügen Sie den folgenden Code hinzu resolvers.js Datei in der graphql Ordner. Die Resolver werden in diesem Fall innerhalb der Abfrage- und Mutationsobjekte angegeben.

Das Query-Objekt definiert zwei Methoden: Mitarbeiter Und Mitarbeiter bekommen. Diese Methoden sind für das Abrufen von Mitarbeiterdaten aus der Datenbank auf Anforderung durch einen Client verantwortlich.

konst Mitarbeiter= erfordern("../models/employeesModel");
// GraphQL-Resolver
konst Resolver = {
 Anfrage: {
 Mitarbeiter: asynchron () => {
versuchen {
konst Mitarbeiter = erwarten Mitarbeiter.find({});
zurückkehren Mitarbeiter;
 } fangen (Fehler) {
Konsole.error (Fehler);
WurfneuFehler(„Mitarbeiter konnten nicht abgerufen werden“);
 }
 },
 getMitarbeiter: asynchron (übergeordnet, Argumente) => {
versuchen {
konst Mitarbeiter = erwarten Employee.findById (args.id);
zurückkehren Mitarbeiter;
 } fangen (Fehler) {
Konsole.error (Fehler);
WurfneuFehler('Mitarbeiter konnte nicht nach ID abgerufen werden');
 }
 },
 },

Das Mutation-Objekt hat drei Methoden: Mitarbeiter erstellen, updateMitarbeiter, Und Mitarbeiter löschen. Diese Methoden nehmen Änderungen an den in der MongoDB-Datenbank gespeicherten Daten vor.

 Mutation: {
asynchron createEmployee (_, { MitarbeiterInput: { Name, Abteilung, Gehalt } }) {
konst neuerMitarbeiter = neu Mitarbeiter({
 Name Name,
 Abteilung: Abteilung,
 Gehalt: Gehalt
 });
konst Antwort = erwarten neuerMitarbeiter.save();
Konsole.log (neuer Mitarbeiter);


zurückkehren {
 id: Antwort._id,
 ...Antwort._doc
 }
 },


asynchron updateMitarbeiter (_, {id, MitarbeiterInput: {Name, Abteilung, Gehalt}}) {
konst aktualisiertMitarbeiter = erwarten Mitarbeiter.updateOne(
 { _Ausweis: Ausweis },
 { name, abteilung, gehalt }
 );


Wenn (!aktualisierter Mitarbeiter) {
WurfneuFehler(`Mitarbeiter mit Ausweis: ${id} nicht gefunden“.);
 }


zurückkehrenWAHR; // Einen booleschen Wert zurückgeben, der den Erfolg der Aktualisierung anzeigt
 },


asynchron Mitarbeiter löschen (_, {id}) {
konst gelöschtMitarbeiter = erwarten Employee.deleteOne({ _Ausweis: Ausweis });

Wenn (!gelöschterMitarbeiter || gelöschterMitarbeiter.gelöschteAnzahl 0) {
WurfneuFehler(„Mitarbeiter mit Ausweis ${id} nicht gefunden“.);
 }


zurückkehrenWAHR; // Einen booleschen Wert zurückgeben, der den Erfolg des Löschens anzeigt
 },
 },
};
Modul.exports = Resolver;

Führen Sie schließlich diesen Befehl aus, um den Server hochzufahren:

Knoten index.js

Sobald eine Datenbankverbindung hergestellt wurde, startet der Server auf Port 5000.

Sie können die Funktionalität der GraphQL-API testen, indem Sie HTTP-Anforderungen vom GraphQL-Playground in Ihrem Browser stellen.

Sie können zum Beispiel die verwenden Mitarbeiter erstellen Mutation zum Hinzufügen neuer Mitarbeiterdaten in der MongoDB-Datenbank.

Popularität von GraphQL in der Entwickler-Community

GraphQL gewinnt in der Entwickler-Community als alternativer API-Designansatz zur beliebten REST-Architektur an Bedeutung.

Dies liegt an seiner Fähigkeit, eine flexiblere und effizientere Möglichkeit zum Abrufen von Daten aus verschiedenen Quellen von einem einzigen Einstiegspunkt aus bereitzustellen. Dadurch wird vermieden, dass mehrere Endpunkte für unterschiedliche Daten verwaltet werden müssen, was ein häufiges Problem bei der REST-API-Architektur ist. Diese Designlösung rationalisiert den Prozess der Erstellung und Verwaltung von Back-End-APIs.