Transkripte
1. Kursübersicht: Hallo, da. Mein Name ist Savvy und dies ist der komplette Leitfaden zum Erstellen eines Graphen Pirelli P I mit JavaScript jetzt Grafik. Sie werden eine Menge an Popularität jetzt gewinnen, weil es der
traditionellen Ruhe weit überlegen ist. AP-Augen. Große Unternehmen wie Get Up Facebook und Yelp ziehen alle nach Graft Ul um, weil es in diesem Kurs so viel besser ist. Ich werde Ihnen versichern, wie man eine Grafik Euro MP I mit JavaScript Discourse zu bauen ist in
fünf Teilen strukturiert . Ich werde damit beginnen, die Grundprinzipien des Schlauen zu erklären. Nun, danach werden wir einige Vorbereitungen machen und mit der Umsetzung unserer Grafik beginnen Sie l a p i. Schließlich werden
wir einen Blick auf grafische ein großartiges Werkzeug zum Testen Ihrer Grafik nehmen Sie l a p i. Um dies alles ein bisschen mehr zu machen realistisch, wir werden eine Grafik, die Sie l a p i für einen Block erstellen. Ich habe eine kleine Datenbank mit Blockbeiträgen, Autoren und Kommentaren, die wir als Grundlage für unser A p I
verwenden werden . Sie benötigen einige Grundkenntnisse in Javascript und keine Js. Sie müssen kein Programmierexperte sein, obwohl der Code und die Beispiele, die ich während dieses Kurses verwendet habe, einfach und
selbsterklärend sind , so dass Grundkenntnisse gut sind. Nachdem Sie die Partituren abgeschlossen
haben, können Sie Ihre eigene Grafik UNDP I mit JavaScript erstellen. Also, worauf wartest du? Und rollen Sie jetzt und fahren Sie mit dem nächsten Video fort, wo ich im Detail erklären werde. Welche Grafik Sie? Nun, das ist es
eigentlich.
2. Was ist GraphQL?: Hi, alle. Mein Name ist schwerwiegend und in diesem Video wird aufgenommen werden. Ein Blick darauf, was schlauer Nun, eigentlich ist grafisch. UAL ist eine Abfragesprache. Das war das Ventil von Facebook im Jahr 2012, während sie an ihren nativen IOS- und
Android-Anwendungen arbeiteten . Was sie brauchten, war ein p I. Das war flexibel, effizient und eine, die mit den relationalen Daten arbeiten konnte, die Facebook hat. Sie landeten mit der Erstellung von Transplantat Sie gut, weil kein anderes Werkzeug ihr Problem lösen konnte. Graphic UAL hat viele Funktionen, die es zu einer großartigen Wahl für den Bau eines A p I machen. Also lassen Sie uns über einige von ihnen gehen. Zuallererst ist die
graphische ul sehr effizient. Es ermöglicht dem Client zu fragen, welche Informationen er benötigt, und der Server antwortet. Würden nur die Daten? Es ist auch möglich, mehrere Abfragen in einer einzigen Anforderung auszuführen, und Sie können auch die Beziehungen von Entitäten navigieren. Zum Beispiel können
Sie Graph que el für eine Liste Ihrer Freunde und den Namen ihrer Freunde fragen. Graphic UL gibt genau das zurück, und es enthält keine Treibstoffe, die Sie nicht angefordert haben, wie Geburtsdatum oder E-Mail. Zweitens, Grafik Sie gut, es verwendet ein Typsystem. Dadurch wird ein Vertrag zwischen dem Client und dem Server erstellt, und es ermöglicht dem Server, eine eingehende Abfrage zu validieren und aussagekräftige
Fehlermeldungen bereitzustellen , wenn etwas damit nicht stimmt. Als Benutzer eines A P I bietet Ihnen
das Typsystem zusätzliche Sicherheit,da Sie wissen, welche Art von Daten das A P Izurückgeben
wird. Als Benutzer eines A P I bietet Ihnen
das Typsystem zusätzliche Sicherheit, da Sie wissen, welche Art von Daten das A P I Drittens stellt das
grafische UAL nur einen Endpunkt für Ihren gesamten AP I zur Verfügung und es ist so konstruiert
, dass Sie Ihr A p i einbeziehen können, ohne die Abwärtskompatibilität zu brechen. In der Tat, Facebook sagt, dass sie nie Version dort. Graphic Ihre A p I, und dass alle Versionen ihrer Anwendungen immer noch mit neueren Versionen von ihrem A
P I arbeiten . Es sagte, dass Grafik Sie werden die letzte AP I, die Sie ziemlich genial bereitstellen sollten, oder? Und schließlich, Transplantat. UAL ist nicht an eine bestimmte Datenbank oder Speicher-Engine gebunden. Sie können es bis zu Ihrer vorhandenen Codebasis in Ihrer vorhandenen Datenbasis verbinden. Sie können sogar mehrere Datenbanken zusammen verwenden, um eine einzelne a p i zu versorgen, so dass ein schneller
Überblick aus war . Welche Grafik hast du aus? Dies Im nächsten Video werden
wir Grafik Sie gut mit traditionellen Rest AP Ice vergleichen.
3. GraphQL vs REST API's: hallo. Jeder Bergbau Misc schwer und in diesem Video wird genommen werden. Ein Blick auf die Unterschiede zwischen Grafik Sie gut und ausgeruht Eis sein. Jetzt habe ich mir ein praktisches Beispiel für den Vergleich der beiden ausgedacht. Nehmen wir an, dass wir kein P I für einen Block sind Blogger Writer einfach, und es enthält drei Arten von Objekten. Blockieren von Beiträgen, Autoren und Kommentaren. Die Beziehung zwischen diesen sind ziemlich offensichtlich. Block verfügt über Air, geschrieben von einem einzelnen Autor und Block Post kann einen oder mehrere Kommentare haben. Werfen wir nun einen Blick darauf, wie Sie auf einem P I aufbauen können. Dazu mit dem Restprinzip beginnen, würden
Sie
mit dem Restprinzip beginnen,indem Sie einen einzelnen Punkt pro Entität erstellen. Möchten Sie die Details zu einem Blockbeitrag erhalten, und dies würde den Titel und den Inhalt des Beitrags enthalten. Ein weiterer, um die Details über Kommentare zu erhalten. Und dies würde den Namen des Plakats und
natürlich
den Inhalt des Kommentars selbst beinhalten natürlich . Ich werde auch eine hinzufügen, um die Details eines Autors zu erhalten, der
zum Beispiel den Namen und eine
E-Mail-Adresse zurückgibt , , und Sie sollten auch in der Lage sein, alle Blockbeiträge auf der Website aufzulisten. Und so fügen Sie 1/4 und Punkt hinzu, der eine Liste von Blockbeiträgen zurückgibt. Ich DS. Jetzt scheint diese Architektur in Ordnung zu sein, aber lassen Sie uns sie tatsächlich verwenden. Ich möchte eine Liste von Blockbeiträgen rendern, in denen wir den Titel jedes Beitrags und den Namen
des Autors gezeigt haben . Also beginnen wir mit einer Anfrage für die neuesten Blockposts und die A P. Ich werde mit einem luftigen antworten, der die Verweise auf einige dieser Beiträge enthält. Danach muss
ich eine Anfrage pro Block Post stellen, um den Titel und den Inhalt von jedem zu erhalten. Aber diese Antwort enthält noch eine weitere Referenz diesmal einen Beitrag Referenzen und Autor. Also, um zu wissen, wer geschrieben hat, um zu posten, muss
ich eine weitere Reihe von Anfragen stellen, um den Namen jedes der Autoren zu erhalten, und das ist, was die A P Ich würde jetzt zurückgeben. Dieses Beispiel ist ein bisschen übertrieben, aber es zeigt den Schmerz. Zeigen Sie die Ruhe-AP-Augen ab. In realen Anwendungen werden
Sie definitiv auf Situationen stoßen, in denen Sie mehrere Anfragen an den
Server stellen müssen , um alle Daten zu erhalten, die Sie benötigen. Dies kann schmerzhaft langsam sein, da jeder Strip auf dem Server viel Warten und Sehen hinzufügt, und das ist nicht ideal für mobile Verbindungen, zum Beispiel. Nun möchten Sie vielleicht versucht sein, ein paar Endpunkte hinzuzufügen, um dieses Problem zu lösen. Sie können einen Beitrag mit Autoren hinzufügen und zeigen, um eine Liste von Beiträgen zusammen mit den
Details über den Autor zurückzugeben . Und dann können Sie eine weitere hinzufügen, um auch gemeinsame Zählungen zurückzugeben. Dies ist jedoch keine sehr skalierbare Lösung. Dies führt zu einer Explosion von Endpunkten, die schwer zu pflegen sind und für neue
Menschen schwer zu lernen, wie sie zu verwenden sind. Lassen Sie uns nun einen Blick darauf werfen, wie grafisch Sie diese Probleme mit Transplantat lösen werden. Sie gut, Sie können eine einzelne Anfrage stellen und fragen Sie nach allen Ressourcen ist, die Sie wollen. Also hier kann ich sagen, ich will den neuesten Beitrag mit dem Namen von den Autoren. Der grafische Server wird dann den Block Post für Sie suchen. Es wird die Beziehungen zum Autor folgen, und es wird sachlich die Informationen über den Autor, und es wird alles, um Sie in einem einzigen Anfragen drehen. Jetzt möchte ich hier darauf hinweisen, dass die Antwort Autogramm QL-Abfrage genau die gleiche
Form von Ihrer Abfrage hat , dass dies sehr nützlich ist, weil Sie im Voraus wissen, wie das A p I reagieren
wird, und mit dem Rest AP I ist das einfach nicht der Fall. So können wir hier auf der linken Seite sehen, dass wir nach Beiträgen und auf der rechten Seite abfragen. Wir erhalten ein Objekt aus Grafik Sie werden, die einen Beitrag Harry enthält Objekte mit allen Attributen, die wir wollen. Also das ist Titelinhalt und dann auf Autorobjekt mit der Name-Eigenschaft. Um zusammenzufassen, mit grafischen UL, können
Sie mehrere Ressourcen in einer einzigen Anfrage erhalten. Die Struktur Ihrer Query definiert die Struktur der Antwortgrafik. Sie verstehen auch die Beziehung zwischen Ihren Objekten und können sie nachschlagen, wenn
sie benötigt werden. Und schließlich bekommst du immer die Daten, die du nie zu viel brauchst. wird es nie auch. Also, das war es für diese Lektion In den kommenden Videos, werde ich die wichtigsten Konzepte des Transplantats erklären. Sie alle danken Ihnen sehr für das Ansehen, und ich werde Sie im nächsten Video sehen
4. Felder und Argumente: Hi, alle. Mein Name ISC Savvier. Und du siehst meinen Kurs auf Graphic You? Nun, in diesem Video werden wir einen Blick auf die Felder werfen und auch einen Blick darauf werfen, wie Sie Argumente mit Feldern
verwenden können . Also lassen Sie uns mit Feldern Grafik beginnen Sie gut geht es darum, nach Daten zu fragen und Sie können
sehr genau sein , welche Teile der Daten Sie erhalten möchten. Lassen Sie mich Ihnen zeigen, wie eine grundlegende Abfrage in der Grafik Sie sehen. Also werde ich damit beginnen, zu sagen, dass wir etwas abfragen wollen und dass ich sagen werde, ich will eine Abfrage Beiträge und ich möchte den Titel jeder Block Beiträge erhalten. Dies ist also eine sehr einfache Abfrage. Und wenn ich das durchführe, bekommen
wir eine Antwort von dir. Nun, es sagt nur, dass Beiträge uns einen Bereich von Objekten geben, und jedes Objekt enthält nur den Titel von unserem Beitrag, weil das das einzige ist, was wir
gefragt haben . Also in diesem Fall ist die
Abfrage hier der Name der Operation. Während Beiträge und Titel sind unsere beiden Felder Felder sehr wichtig in der grafischen UAL und sie sind Einheit von Daten, die Sie fragen können. Und es spielt keine Rolle, wie tief in der Abfrage diese Felder erscheinen. Es sind immer aufgerufene Felder auf. Sie verhalten sich immer auf die gleiche Weise, auch wenn Sie sie jetzt durcheinander bringen, können
Sie auch eine Unterauswahl von Feldern treffen. Nehmen wir an, ich möchte auch wissen, wer diese Block-Posts geschrieben hat, während ich tun muss, ist ich zu sagen, während ich die Beiträge mit dem Titel möchte. Aber ich möchte auch wissen, über den Autor und Autor ist eigentlich ein Objekt. Also hier kann ich definieren, welche Felder des Autors ich möchte. Und so, wenn ich Steuerraum grafische sagt mir, dass Autor hat eine Idee, Name und E-Mail in einer Post Eigenschaft, und ich kann eine von ihnen wählen. Also werde ich sagen, während ich den Namen oft Autor möchte Und wenn ich diese Abfrage ausführe, bekomme
ich ein Autorenfeld in meinen Beiträgen, und das ist natürlich wieder
ein Objekt, das enthält den Namen des Autors. Nun natürlich können
Sie diese Feldernatürlichnoch weiter verschachteln, wenn Ihre Datenstruktur dies jetzt zulässt. Asset im vorherigen Video, die Fähigkeit, mehrere Ressourcen abfragen ist und die Beziehung in einer einzigen Anforderung kann grafisch. Sie werden viel effizienter als Rest AP I Also in diesem Fall, aus Strom für die neuesten Beiträge. Ich habe ihren Titel geschnappt und ich habe ihre Beziehung mit der Autoreneinheit durchgemacht, und ich habe auch den Namen von dem Autor genommen, der dem Beitrag zugewiesen ist. Eine Verhaftung, a p I. Dies hätte mehrere Anfragen an den Server gefordert. Nun gehen wir zu den Argumenten über. Abrufen von Objekten und Feldern ist in der Grafik ziemlich einfach. Du bist gut, wie wir gerade gesehen haben. Aber manchmal müssen Sie einige Argumente geben. Zum Beispiel möchten
Sie vielleicht einen besonders Blockpost basierend auf seinem i.
D.holen D. so dass es unseren bestehenden Crary löschen würde. Und ich werde sagen, dass ich einen Beitrag will und ich werde es in Argumenten geben. Und ich werde sagen, dass die Idee der Post, die ich holen möchte, drei ist, zum Beispiel, und ich werde die Klammern öffnen und sagen, Geben Sie mir den Titel off post mit i d drei. Es sind wir, wenn ich das
ausführe, bekomme ich genau den Titel von Blockposts mit I d. Three Now, in einem traditionellen Ruhe-System, können
Sie Onley einen einzigen Satz von Argumenten an den Server übergeben. In Graphic UL jedoch können
jedoch
alle Felder und verschachtelte Objekte über eigene Argumente verfügen. Nehmen wir an, Sie möchten die Kommentare von diesen Blockbeiträgen abrufen. Dann füge ich einfach Kommentare hinzu. Und ich kann für jeden gemeinsamen sagen und wollen den Namen und das wird funktionieren. Da gehen wir hin. Es gab also einen Kommentar von Peter. Aber jetzt kann ich auch ein Argument an Kommentare weitergeben. Und ich kann sagen, zum Beispiel, während geben Sie mir die Kommentare aus dem Jahr 2017 zum Beispiel. Und wenn ich diese Grafik ausführe, werden
Sie es gut funktionieren lassen. Es wird Post mit I d drei holen. Es wird die Kommentare dieses Beitrags nachschlagen, die sich
beispielsweise in einer anderen Datenbanktabelle befinden könnten. Es wird sie nach Jahr filtern, indem wir unser zweites Argument in einem Umschlag alle Daten verwenden, die ich angefordert habe. Also, das war es für dieses Video. Das waren Felder und Argumente. Im nächsten Video werden
wir einen Blick auf Alia Anwendungen und Fragmente
5. Aliasen und Fragmente: Hi, alle. Mein Name ist streng, und das ist mein Kurs auf Grafik. Sie in diesem Video, wir werden einen Blick auf einen Mietvertrag und Fragmente nehmen. Fangen wir mit Aliasnamen an. Möglicherweise haben Sie ein Problem mit der Art und Weise entdeckt, wie Abfragen in der Grafik ausgeführt werden. Nun, die Ausgabe einer Graph QL-Abfrage hat den gleichen Namen wie die Abfrage selbst. Also in diesem Fall habe
ich das Beispiel des vorherigen Videos genommen und ich fragte nach Post I D drei und ich fragte seinen Titel und seinen Inhalt. Beachten Sie nun, dass ich hier Post eintippe und dass ich Beiträge in der Antwort zurück bekomme. Aber was ist, wenn ich die Details von zwei spezifischen Beiträgen erhalten möchte? Ich kann so etwas nicht schreiben, ich
rühme mich zwei und dann Titel und Inhalt von diesem Beitrag abholen. Denn wenn ich diese Grafik mache, werden Sie sagen, dass die Fehdenposten miteinander in Konflikt stehen, denn wieder, sie sind der gleiche Name. Deshalb gibt es Aliase in der Grafik. Nun, sie ermöglichen es Ihnen, das Ergebnis eines Feldes in alles andere umzubenennen, was Sie wollen. Sie könnten also beide Beiträge abfragen, indem Sie sagen, dass die 1. 1 erste Hoffnungen ist und dass die 2. 1 der zweite Beitrag ist. Und wenn ich es jetzt ausführe, wird
Graph Carol die Ausgabe dieses Beitrags umbenennen und den ersten Beitrag benennen, wie Sie hier im Antwortobjekt sehen können. Nun sind
Aliase ideal, um denselben Objekttyp mehr als einmal abzufragen. Aber Ihre Abfragen werden auch sehr repetitiv, wie Sie hier in diesem Beispiel sehen können. Lassen Sie uns dieses Beispiel nun ein wenig vollständiger machen. Nehmen wir an, dass wir den Titel den Inhalt jedes Beitrags zusammen mit dem Namen
des Autors fash wollen . Also hier muss ich sagen, während ich den Autor will und ich will den Namen des Autors und dann eine Kopie auch in
unseren zweiten Beitrag eingefügt . Da gehen wir jetzt. Das ist ziemlich repetitiv. Der ganze Code zwischen den Klammern ist genau der gleiche für beide Beiträge, und das bringt uns zu Fragmenten. Durch die Verwendung von Fragmenten können
wir die duplizierten Felder entfernen und sie in einen wiederverwendbaren Mantelblock setzen, damit wir
beginnen können , indem wir unser Fragment definieren, und wir beginnen, indem wir Ihnen die Namen speichern Fragment, grundlegende Post Details . Und dann müssen wir sagen, womit dieses Fragment kompatibel ist. Daher ist dieses Fragment mit dem Post-Typ kompatibel. Also werde ich sagen, dass es auf dem Post-Typ funktioniert, und dann werde ich die ausgewählten Felder in unsere Fragmente kopieren. Nun, danach, können
wir dieses Fragment innerhalb unserer Abfragen verwenden, so dass wir diese beiden Abfragen neu schreiben können, indem alle unsere Felder
entfernen und einfach Punkt a dot basic post Details sagen. Und ich würde diesen Frieden auch kopieren, der da drin ist, und das war's. Wenn ich das jetzt
ausführe, bekomme ich genau die gleiche Ausgabe. Aber ich habe dieses Stück Code nicht endlos kopiert und eingefügt. Ich könnte es einfach wiederverwenden, indem ich auf seinen Namen verweise. Jetzt stellen Sie vielleicht fest, dass die Syntax ein bisschen wie der neue Spread-Operator in JavaScript aussieht . Und wie Sie sehen können, reduziert
es die Größe von York Träumereien erheblich. Also, das war es für dieses Video. Im nächsten Video werden
wir einen Blick darauf werfen, wie Sie Variablen in Ihrer Grafik verwenden können. Sie werden Abfragen
6. Variablen: Hi, alle. Mein Name ISC Savvier. Und du siehst meinen Kurs auf Graphic You? Nun, in diesem Video werden
wir einen Blick darauf werfen, wie Sie Variablen in der Grafik verwenden können Sie
Nun, bis jetzt haben wir Argumente direkt in unseren Abfragen geschrieben, und hier ist ein Beispiel für eines der vorherigen Videos, die wir Details off post mit i d drei. Und wie Sie sehen können, habe ich das Argument drei direkt in meiner Abfrage übergeben. In den meisten Anwendungensind
die Argumente
jedochdynamisch und hängen normalerweise von Benutzereingaben ab. In den meisten Anwendungen jedoch Beispielsweise können
Autoren über ein Formular verfügen, um einen neuen Blockbeitrag zu erstellen.
Daher empfiehlt es sich nicht, die Formulardaten zu verwenden, um ihn zu serialisieren. Und um es in diese Abfrage einzufügen. Es könnte nicht nur ein Sicherheitsproblem sein, sondern
es erstellt auch eine völlig neue Abfrage, die möglicherweise ungültig geworden ist. Stattdessen können
wir Variablen Insider-Abfragen verwenden und dann entlang der Benutzereingabe separat übergeben. Und so geht es. So wird damit beginnen, dass unsere Abfrage außer einer Variablen zu sagen. Also werde ich sagen, dass unsere Abfrage eine Variable namens Post I D akzeptiert und ich werde sagen, dass es eine Typ-Ganzzahl ist, und ich werde sagen, dass dieser Beitrag I d erforderlich ist, indem ein Ausrufezeichen hinzugefügt wird. Das bedeutet also, dass die Variable obligatorisch ist und graphic ul
diese Abfrage nicht fortsetzen wird , wenn sie jetzt nicht vorhanden ist, nachdem wir die Variable deklariert
haben, können wir sie innerhalb unserer Abfrage verwenden. So rächt er Details des Beitrags mit i d drei. Aber anstelle von drei kann
ich jetzt unseren variablen Post i d verwenden . Nun, natürlich müssen
wir auch den Wert dieser Variablen an den Server übergeben. Und dazu erstellen
wir ein Jason-Objekt und senden es zusammen mit dieser Anfrage an den Server. Und in der grafischen, gibt es hier keinen Abschnitt namens Abfragevariablen,
und alles, was ich hier tue, ist, dass ich eine geschweifte Klammer und ein grafisches Auto schreibe, vervollständigt mich und sagt, Nun, ich brauche eine Post-d-Variable und dann brauche ich kann diese Variablen hier geben. Ich kann sagen, dass der Wert von Post I d gleich drei ist, und dann ist es das. Wenn ich diese Abfrage erneut ausführe, werden
Sie sehen, dass sie genau die gleiche Antwort wie meine vorherige Abfrage hat. Aber im Moment verwende ich Abfragevariablen. Jetzt werden diese Variablen zusammen mit unseren Anfragen als,
zum Beispiel,
ein Post Brown gesendet zum Beispiel, . Jetzt durch die Verwendung von Variablen können
wir
durch die Verwendung von Variablendie Abfrage für alle Anfragen gleich halten. Auch hier wird
sich diese Abfrage hier nie ändern. Ich würde nur die Benutzereingabe zusammen mit der Anfrage senden, und dies wird als eine bewährte Vorgehensweise angesehen. Es wird nicht empfohlen, String-Interpolation zu verwenden, um eine neue Abfrage zu erstellen, da
dies wiederum ein potenzielles Sicherheitsproblem sein könnte. Das war also nicht für dieses Video. Im nächsten Video werden
wir einen Blick darauf werfen, was Mutationen sind und welche Unterschiede zwischen Untersuchungen und Mutationen bestehen.
7. Mutationen: Hi, alle. Mein Name ISC Savvier. Und in diesem Video werden
wir einen Blick auf die Unterschiede zwischen Abfragen und Mutationen werfen. In der Grafik, Sie alle Es gibt zwei Arten von Operationen Abfragen und Mutationen. Sie haben bereits viele Beispiele für Abfragen in den vorherigen Videos gesehen, denen Sie Daten vom Server abrufen können. Und dies ist in der Regel schreibgeschützte Abfragen sollten keine Daten auf Ihrem Server ändern, obwohl Sie sie technisch nicht dazu bringen konnten, dies zu tun. Um Daten auf Ihrem Server zu ändern, sollten
Sie stattdessen Mutationen verwenden. Nur ein Scurries. Mutationen können Objekte zurückgeben, und Sie können festlegen, welche Felder Sie als Antwort erhalten möchten. Im Falle eines Blocks könnte
das A P I eine Mutation haben, um neue Blockposts hinzuzufügen. Diese Mutation sollte ein Jason-Objekt mit dem Inhalt des neuen Beitrags akzeptieren. Lassen Sie uns also einen Blick darauf werfen, wie Sie das in der Grafik tun können. Nun, wir beginnen damit, dass wir eine Mutation durchführen wollen, also werde ich Mutation eingeben, Klammern
öffnen und Gerechtigkeit mit Abfragen. Ich kann ihm jetzt den Namen einer Mutation geben. Also habe ich bereits eine Mutation bei Post erstellt und dies, außer einer Post-Variablen, die benachbarte Objekt ist, die die Details meiner neuen Beiträge enthält. Das könnte also Titel sein. Mein neuer Block posten meinen Block. Post hat auch einige Inhalte und sollte Inhalte von meinen Blockbeiträgen sein. Es hat auch einen Autor, und dies ist ein Hinweis auf die Idee des Altars. Und in diesem Fall es nur einige zufällige Daten, die ich in einer Datenbank generiert habe. Das sind also die Daten, die wir an diese Mutation weitergeben. Und dann können wir auch sagen, welche Daten wir von der Grafik erhalten möchten Sie gut, und wir können Tasche den Titel aus unserem Block bietet erhalten. Und ich kann sogar nach dem Autor fragen. Und ich kann nach dem Namen des Autors fragen, der mit diesem I.
D.verbunden ist D. Genau hier. Nun, im vorherigen Video, habe ich Ihnen gesagt, dass es keine gute Idee ist, diese Daten direkt in die Abfrage zu setzen. Stattdessen sollten
wir Variablen verwenden, und das ist auch mit Mutationen möglich. Also nur das ist, was Abfragen beginnen, indem wir sagen, dass unsere Mutation eine Postvariable als
Eingabe nimmt . Also werde ich es hier nicht tun. Ich werde sagen, dass wir einen variablen Beitrag erhalten werden, und dies sollte vom Typ Post Eingabe sein. Nun, rühmen Eingabe ist ein Typ, den ich auf dem grafischen Ural Server definiert habe. Und später im Kurs zeige
ich Ihnen, wie Sie das selbst machen können. Jetzt ist diese Variable erforderlich. Also füge ich ein Ausrufezeichen hinzu. Nun, danach, kann
ich anfangen, diese Variable Insight oder Post-Feld zu verwenden. Also, anstatt ihm sofort die Objekte hier zu geben, werde
ich den Text wegschneiden und ich werde nur auf die Post-Variable verweisen. Und jetzt kann ich entlang unserer Post als Variable zu Grafik übergeben. - Sie? Nun, und hier kann ich das Objekt für unseren Block passieren. Beides. Das war also das Objekt, das ich
mit Titelinhalt und Autor erstellt habe . Aber wir sollten das in ein anderes Objekt einwickeln, genauso grafisch hier, schlagen Sie mir vor. Und das Objekt enthält ein Postfeld. Dieses Beitragsfeld enthält dieses Objekt. Dann sollte ich es schließen. In Ordnung? Und ich sollte hier ein paar Zitate hinzufügen und da gehen wir. So sieht eine Mutation aus. Wenn ich weiß, dass ausgeführt wird
dies einen neuen Blockpost in meine Datenbank einfügen. Und wie Sie sehen können, erhielten
wir den Titel und den Namen des Autors als Antwort, genau wie wir es hier gewünscht haben. Mutationen sehen also genau wie Clarice aus, und sie haben auch eine vorhersehbare Antwort. Was ist nun der eigentliche Unterschied zwischen Abfragen und Mutationen? Nun, zuerst können
Sie sofort sehen, ob eine grafische UL-Operation etwas auf dem Server ändert oder nicht . Nun, das ist zu unserer eigenen Bequemlichkeit. Abfragen lesen nur Daten vom Server, während Mutationen ändern oder neue Daten hinzufügen . Der andere große Unterschied besteht darin, dass Abfragen parallel ausgeführt werden, während Mutationen
in Siris nacheinander ausgeführt werden. Dies ist, um Race-Bedingungen zu verhindern, da eine Mutation Daten einfügen könnte, die für
die nächste Mutation erforderlich sind . Das war es also für dieses Video und auch für diesen Abschnitt. Im nächsten Abschnitt werden
wir uns bereit, ihre eigene Grafik zu schreiben Ihre l a p I Ich werde Ihnen zeigen, wie es von der Projektstruktur gesetzt ist, welche Abhängigkeiten wir verwenden und vieles mehr
8. Aufbereitung: Projektstruktur: Hi, alle. Mein Name ISC sowjetisch. Und in diesem Video werden
wir die Verzeichnisstruktur für unsere Grafik einrichten Sie l a p I Also hier habe ich ein leeres Verzeichnis in Visual Studio Code geöffnet, und wir werden beginnen, indem wir ein paar Verzeichnisse erstellen, die unser Projekt ausmachen werden. Ich werde damit beginnen, ein Verzeichnis für all unseren Quellcode zu erstellen. Ich werde anrufen. Das ist unser C. Nun, in diesem Verzeichnis, werde ich einen anderen Ordner für unsere Grafik erstellen, die Sie Schema werden. Was das ist etwas, das wir in späteren Videos besprechen werden. Nun, Schema, Augen aus Abfragen, Typen und Mutationen. Also werde ich für jeden von diesen ein Unterverzeichnis erstellen. Also eine für Abfragen, eine für Typen und eine für Mutationen. Nun lassen Sie uns auch einige Platzhalterdateien für unser Schema erstellen. Beginnen wir mit Abfragen und Mutationen. Ich werde eine Datei pro Abfrage und Permutation erstellen. Dadurch stellen
wir sicher, dass jede Datei nur einer Abfrage oder einer Mutation entspricht und
unsere Dateien kurz hält und unser Code überschaubar ist. Also, für Mutationen, möchte
ich, dass Kunden in der Lage sein, neue Blockbeiträge zu erstellen und Kommentare über unsere a p I zu posten . Also werde ich zwei Mutationen erstellen. Die erste 1 Ich werde hinzufügen Kommentare dot Js und ich werde eine zweite 1 erstellen, die Post hinzufügen
wird , dass Ja. Jetzt lasse ich diese Akten vorerst leer. Wird später in diesem Kurs für Abfragen an ihnen arbeiten. Ich möchte, dass Benutzer in der Lage sein, alle Beiträge auf dem Block zu erhalten, um Details zu einem bestimmten Beitrag zu erhalten und die Details über einen Autor zu erhalten. Also werde ich drei Dateien innerhalb von Abfragen erstellen. Ich werde eine Datei Beiträge erstellen, die ich dachte, Jazz, die alle Beiträge in unserem Blawg zurückgeben wird. Ich werde Post erstellen, dass Js, der
die Details über einen einzelnen Beitrag zurückgeben wird. Und dann werde ich eine Datei Autor Digests erstellen, die einige Informationen über Autor zurückgeben wird und wieder, wir werden diese Dateien später implementieren und auch wissen, dass Sie diese Dateien benennen können, aber Sie möchten. Ich suche hier nur etwas aus, das Sinn ergibt. Als Nächstes sind Typen. Nun, wenn Sie mit Objekt oder in die Programmierung vertraut sind, können Sie Typen in grafischen
UAL zu Schnittstelle vergleichen ist eine objektorientierte Programmiersprachen. Sie definieren, welche Felder ein Typ hat, z. B. ein Typ für Block rühmen könnte einen Titel, einen Inhalt und
ein Autorenfeld haben . Nun, für r E B I, wir haben drei große Typen. Wir haben Blockpfosten. Wir haben Autoren und wir haben Kommentare. Ich habe sie im ersten Abschnitt dieses Kurses ausführlich beschrieben. Also lassen Sie uns eine Datei für jeden einzelnen von denen erstellen, den ich Autor dachte ja erstellen werde , erstellen Sie Kommentare, die Jess und ich erstellen werden. Posten Sie das, Jess. Alles klar,
jetzt, da wir die einzelnen Bausteine für Schema haben, werde
ich in der nächsten RGS-Datei innerhalb des Schema-Verzeichnisses erstellen. Und in dieser Datei werden
wir alle anderen Dateien importieren und das komplette Scheming erstellen. Ich werde auch eine indizierte Datei im Stammverzeichnis unseres Quellverzeichnisses erstellen, und in diesem Herbst wird dafür verantwortlich sein, die Grafik zu laden, Sie eine Bibliothek zum Laden unseres Schemas und für die Ausführung von Abfragen jetzt zu beenden. Wir werden auch einen Dist-Ordner brauchen, den ich in die Wurzeln unseres Projekts setzen werde. Nun, dieser Ordner enthält optimierte Versionen von unserem Quellcode und es wird von
babble auf generiert werden Dies wird sicherstellen, dass unser Angebot läuft auf jeder Version aus. Keine Js. Also mit diesem Narren würde es an der Zeit, dieses Video zu beenden. Wir haben die Struktur für unser Projekt eingerichtet. Im nächsten Video werden
wir die externen Abhängigkeiten installieren, die unser A P I zum Leben erwecken müssen .
9. Abhängigkeiten installieren: Hi, alle. In diesem Video werden
wir die Abhängigkeiten installieren, die wir verwenden werden, um unsere Grafik Sie l
a p I jetzt zu Bill r a p Izu bauen a p I jetzt zu Bill r a p I .
Wir werden das Rad nicht neu erfinden. Stattdessen werden
wir uns auf Bibliotheken von Drittanbietern verlassen, die bereits erstellt wurden und im
Kampf getestet wurden , um Abhängigkeiten zu verwalten. Und nein, Jess, es ist ziemlich einfach, weil wir jetzt NPM haben, falls Sie es nicht wissen, NPM steht für Notiz-Paketmanager. Und dieses Tool ermöglicht es uns, alle Abhängigkeiten unseres Projekts in einer einzigen Datei aufzulisten
, und PM kann diese Datei nehmen, auslesen und alle Abhängigkeiten in unsere Projekte installieren. Also, am Anfang, werden
wir eine verpackte Jason-Datei erstellen. Dies ist die Datei, die in PM alles erzählen wird, was es jetzt über unser Projekt zu wissen gibt. Sie können eine manuell erstellen, aber wir können auch NPM bitten, eine für uns im Stammverzeichnis unseres Projekts zu generieren. Und das werde ich tun. Ich werde das Terminal öffnen, und ich werde NPM darin laufen lassen. Und dieses Dienstprogramm wird uns durch einige der Dinge führen, die in unserem Paket enthalten sein sollten. Dieser Jason und wir könnten ihn einfach in unser Terminal eingeben. Also fragte es uns, was ist ihr Paketname? Nun, ich werde sagen, grafische UAL ap. Ich Block würde sagen,, das ist der Name unseres Pakets. Wir werden es bei dieser Versionsnummer behalten. Wir können ihm eine Beschreibung geben, was ich jetzt nicht tun werde. Sie können ihm einen Einstiegspunkt geben. Ich werde das auch standardmäßig belassen. Lassen Sie den Schreibtisch ein Mann leer. Repository-Schlüsselwörter erhalten Autor. Wir werden das alles leer lassen. Und dann fragte es, das ist diese Akte in Ordnung? Ich werde ja sagen. Das ist in Ordnung. Und jetzt hat der Hocker ein Paket erstellt, das Jason Inside Art Verzeichnis ablegt. Also, jetzt, da wir diese Datei haben, können
wir anfangen zu installieren sind keine Abhängigkeiten. Wir werden nicht unsere eigene grafische Ural-Bibliothek schreiben. Das wird sinnlos sein. Stattdessen werden
wir die offizielle Transplantation ul Implementierung von Facebook verwenden, um es zu installieren. Ich werde einfach npm ausführen, dash
installieren, dash safe und dann grafisch Sie. Nun, hier bitte ich NPM, ein Paket zu installieren. Der Paketname ist grafisch Sie gut, Und indem Sie sagen, dass es diese Abhängigkeit speichern sollte, wird
es tatsächlich die Abhängigkeit zu unserem Paket hinzugefügt, die Jason-Datei. Also, wenn ich diese NPM ausführen wird ausgehen, wird
es Fatchett grafieren Sie. Nun, es wird alle Abhängigkeiten herunterladen, die grafische UAL hat, und es wird grafische UAL als Abhängigkeit speichern. Im Inneren sind Jason Fall verpackt. Wie Sie hier sehen können,hat
es diesem Objekt eine neue Eigenschaft hinzugefügt,
die Abhängigkeiten genannt wird. Wie Sie hier sehen können, hat
es diesem Objekt eine neue Eigenschaft hinzugefügt, Und hier steht, dass Graphic UL jetzt mit der Neigung unseres Projekts ist und dass wir mindestens Version $0.11.3
benötigen. Sie können auch sehen, dass NPM ein neues Verzeichnis in unserem Projekt erstellt hat und dies
Knotenmodule genannt wird . Nun, dieses Verzeichnis ist die Hauptspitze. Alle externen Abhängigkeiten von unserem Projekt. Wir sollten Notizmodule niemals an ein Versionskontrollsystem übergeben und wir sollten niemals
Dateien innerhalb dieses Verzeichnisses ändern . nun Wenn Sienunin das Verzeichnis schauen, sehen
wir, dass es einen Graph Corral Ordner gibt, sowie einen Ordner für alle Abhängigkeiten, die Ihre eigenen Bedürfnisse erstellen. Also in diesem Fall, Transplantation Sie brauchen es gut, rollen und dann ist es genau hier. Unnötig zu sagen, dass dieses Verzeichnis ziemlich groß werden kann, wenn Sie ein paar Abhängigkeiten hinzugefügt haben. Aber das ist einfach in Ordnung. Und wir werden es vorerst schließen. Und wir werden jetzt die nächste Abhängigkeit installieren, die wir brauchen werden. Und das ist Babel. Nun, während dieses Kurses, werde
ich einige der neuen Funktionen in JavaScript verwenden,
wie Klassen, wie Klassen, Pfeilfunktionen und Spread-Operatoren. Diese Funktionen sind
jedoch jedoch möglicherweise in älteren Java-Skript-Laufzeiten nicht verfügbar. Also plappern ist ein kleines Werkzeug, das unseren Code nehmen wird. Aber die ganze neue Syntax und es wird passieren. Ich werde es in Code, den jede Jazz-Laufzeitumgebung verstehen kann. Dies ist sehr nützlich, wenn Sie Ihren Code beispielsweise
für
einen Clouddienst bereitstellen möchten , der eine ältere Laufzeit verwendet. Ich werde den gleichen Befehl wie das letzte Mal verwenden. Eine kleine Abwechslung. Also werde ich sagen, npm installieren dash dash safe. Aber ich werde sagen, Tod retten und das wird NPM sagen, dass plappern Unabhängigkeit ist, die
nur während der Entwicklung benötigt wird . Wir brauchen in unseren Produktionsumgebungen nicht plappern, so dass NPM sicher dash taub und stumm zu sagen , dass es das Battle CLI-Tool installieren sollte. Es sollte die Standardvoreinstellung für Babble installieren. Dies ist die Standardkonfiguration von Bama. Und wir werden einen Plättchen brauchen, der unseren Spread-Operator in
etwas verwandelt , das alte Job-Skript-Laufzeit-Kenner-Stand steht. Also werde ich das ausführen und Sie werden sehen, dass es ein bisschen länger dauert, weil Babel viel
mehr Abhängigkeiten als Grafik hat . Du. Nun, jetzt, da es fertig ist, können
wir sehen, dass es einen weiteren Abschnitt in unser Paket hinzugefügt hat, dass Jason diese abgelegt hat oder
Entwicklungsabhängigkeiten wieder gemacht hat . Dies sind die Abhängigkeiten, die Sie nur während der Entwicklung benötigen, nicht in der Produktion. Und wenn ich das Notizmodulverzeichnis öffne und auf Refresh klicke, können
Sie sehen, dass in unserem Projekt viele neue Abhängigkeiten installiert sind. Und das ist die Macht, einen Paketmanager zu verwenden. Wir müssen das nicht selbst schaffen, mit genug, um
jedes einzelne dieser Projekte herunterzuladen . Nein, NPM wird dies automatisch für uns tun. Ich werde diese Mappe schließen. Ich sagte, es könnte ziemlich groß werden. Das ist überhaupt kein Problem. Und das war es für dieses Video. Wir haben alle Abhängigkeiten installiert, die wir verwenden werden, um unsere eigene Grafik zu erstellen. Du wirst ich jetzt im nächsten Video sein, ich werde dir zeigen, wie es eine gute Figur plappern ist.
10. Babel konfigurieren: Hallo, alle. Und willkommen zurück zu meinem Kurs auf Graphic You? Nun, im vorherigen Video haben wir eine notwendige Abhängigkeiten in unserem Projekt installiert. Und eine dieser Abhängigkeiten ist Babel. Jetzt werden wir babble verwenden, um sicherzustellen, dass wir alle neuen Funktionen in der Java-Skriptsprache sicher nutzen können , ohne sich um
die Kompatibilität kümmern zu müssen. Lassen Sie uns zuerst einen Blick darauf werfen, warum wir plappern müssen, indem wir einen Mantel schreiben. Ich werde die Indexpunkt-JS-Datei hier im Stammverzeichnis meines Quellverzeichnisses öffnen. Und sagen wir, ich möchte die Grafik-Bibliothek importieren und dann etwas damit machen . Nun, sie schreiben keinen Import. Ich möchte Grafik importieren Sie gut, und ich möchte es aus der Grafik Ihr Paket importieren. Danach werde
ich nur ein Konsul Log starten, das Hallo sagt, um zu beweisen, dass der Code erfolgreich ausgeführt wurde . Jetzt lassen Sie mich versuchen, das Skript auszuführen. Ich werde das Terminal öffnen und wenn Sie sagen, Knoten SRC in der nächsten, dass Ja, drücken Sie Enter. Und wie Sie sehen können, keine GS zurück und es sagt, dass es einen unerwarteten Token-Import gefunden hat, so dass niemand, den sie hat, diesen neuen Syntex hier nicht versteht, um Module zu importieren. Jetzt könnten
wir es beheben, indem wir die alte Syntax verwenden, aber das ist nicht sehr effizient. In vielen Fällen ist
der Schlinge Index viel kürzer und hat einige nette zusätzliche Funktionen. Das ist genau das, was Babel hier ist, um zu lösen. Babble verlässt sich auf eine Konfliktdatei, um ihm zu sagen, wie es transplantiert werden soll. Ihr Mantel babble kann diese Konfiguration aus dem Paket laden, das Jason Datei oder aus der Babel oder C Datei. Ich werde die zweite Option verwenden, und ich werde eine neue Datei in meinem Stammverzeichnis erstellen. Und ich werde dieses Punktplappern RC nennen. In dieser Datei werden
wir ein Jason-Objekt erstellen, und wir werden sagen, welche Voreinstellungen verfügbar sind. Im vorherigen Video haben
wir also die Endvoreinstellung installiert, die die Standardvoreinstellung ist, die von babble verwendet wird. Also werde ich das direkt dort setzen und dann können wir auch sagen, welche Plugins verfügbar sind und aufgefallen ist, dass der visuelle Studio-Code hier draußen hilft. Es weiß, dass diese Datei eine Babel Konfigurationsdatei ist und Geschenke sind all diese Nächte Hinweise. Also werde ich sagen, dass wir ein paar Plug Ins verwenden und wir werden die
Transformationsobjekte verwenden . Ausruhen, Blufgan. Das sind also ausgebreitet. Der Operator wird korrekt umgesetzt. Okay, jetzt weiß babble, welche Presets verfügbar sind und welche Plug Ins installiert sind. Und lassen Sie uns nicht überprüfen, ob es richtig erscheint. ALS sind Mantel. Also werde ich das Paket öffnen, das Jason Datei und in dieser Datei werde
ich ein neues Skript erstellen. Wenn Sie das Skript und MPM noch nie erstellt haben,
müssen Sie nur einen Namen und dann einen Befehl angeben, den es ausführen soll. Wenn Sie das Skript und MPM noch nie erstellt haben, Also hier hat es bereits ein Testskript. Ich füge nur eins hinzu. Ich rufe jetzt mein Drehbuch „Built“ an. Dies sollte plappert Frau angegriffen plappern ausführen, und dies akzeptiert eine Reihe von Parametern. Nun, die 1. 1 sagt Babel, wo unser Quellcode ist. In unserem Fall ist
es nur das Quellverzeichnis THSRC-Verzeichnis. Nun, danach müssen
wir auch angeben, wo Babble die durchgeführten Versionen unseres Mantels aufbewahren soll. In den vorherigen Videos haben
wir diesen Ordner nur für diesen Zweck erstellt. Also werde ich sagen, dass das Ausgabeverzeichnis, die da draußen ist dieser Ordner. Alles klar, jetzt werde ich diese Datei speichern, und wir werden dieses Skript ausführen und ein Terminal vom Typ NPM öffnen, der gebaut wurde. Ich werde Enter drücken. Und wie Sie sehen können, Babble alle unsere Quelldateien hier gefunden. Und es hat neue Dateien für sie in diesem volleren erzeugt. Also lassen Sie uns unser Original in nächster Punkt-Js-Datei öffnen. Sie können hier in Port Graphic UL aus dem grafischen UL-Paket sehen. Aber wenn ich jetzt zum besten Ordner gehe und die Indexdatei dort geöffnet habe,
dann können Sie sehen, dass unsere Importanweisung weg ist und bam,
Eine Liste verwendet jetzt die traditionelle Request-Syntax dann können Sie sehen, dass unsere Importanweisung weg ist und bam, ,
etwas, das mit älteren Versionen von Notiz. Und lasst uns das jetzt schreiben. Also, jetzt werde ich wieder bekannt laufen, und anstatt den nächsten Fall in unserem Quellverzeichnis auszuführen, werde
ich die nächste Datei in unserem DIS-Verzeichnis ausführen. Und da gehst du. Unser Drehbuch funktioniert. Es gibt keine Fehler mehr. Und es ist nur Prinz hoch auf unseren Konsul. Wenn du ein bisschen wie ich bist,wirst
du denken, dass
es sehr zeitaufwendig ist, diese Befehle immer wieder auszuführen, und du wirst Recht haben. Wenn du ein bisschen wie ich bist, wirst
du denken, dass
es sehr zeitaufwendig ist, diese Befehle immer wieder auszuführen Also lassen Sie uns unser Build-Skript ändern, so dass es babble läuft und dann automatisch unseren Code auf Ihrem Hintern indiziert wird, damit ich zurückgehen werde. Aber ich gehe zurück zu unserer verpackten Jason-Akte. Und hier haben wir plappern, die die Transplantationsversionen erzeugt. Und danach werde
ich sagen, dass es den Knoten in der nächsten Punkt-Js-Datei ausführen sollte. In Ordnung, also lasst es uns noch einmal laufen. Ich werde sagen, npm laufen gebaut. Und nun wird das Skript mit Babel als alles durchlaufen und dann
auch automatisch ausgeführt . Alles in einem Rutsch. Das war es also für dieses Video. Wir sind fast fertig mit den Vorbereitungen. Im nächsten Video zeigen
wir Ihnen die Dummy-Datenbank, die wir als Grundlage für unsere Grafik verwenden werden Sie l a P I
11. Dummy Datenbank: Hi, alle. Mein Name ist X Avi, und in diesem Video, werden
wir einen Blick auf die sehr einfache Datenbank nehmen, die Macht sind Grafik Sie l A p i.
Jetzt wollte ich Sie nicht mit einem Video von mir langweilen, das zeigt, wie ich erstellt all diese Dummy-Daten . Also habe ich eine winzige Datenbank vorbereitet und ich habe sie in unser Quellverzeichnis geschrieben und es heißt Fake-Datenbank. Also werfen wir einen Blick nach innen. Wie Sie sehen können, ist
es nur eine einfache Klasse, die eine Reihe von Eigenschaften enthält. Also haben Eigenschaften, die Autoren speichern, die Blockbeiträge speichern und die alle Kommentare speichern. Jetzt werden alle Daten in einem einfachen Bereich gespeichert. Es ist ein Bereich von Objekten, die Sie vergleichen können. Es ist zwei Tabellen in unregelmäßigen Datenbank, eine Tabelle für Autoren, eine Tabelle für Blockbeiträge an einer Tabelle für Kommentare. Ich habe auch einige Methoden gemacht, um auf diese Daten zuzugreifen, und hier ist eine einfache. Wenn ich nach unten scrolle, können
Sie sehen, dass es Block-Posts gibt und dieser ist sehr einfach. Es gibt nur alle Blockbeiträge in der Datenbank zurück. Nun, in meinem Beispiel, gibt
es die unsere A-Off-Block-Beiträge zurück. Was Captain Memory ist, natürlich. Aber in Wirklichkeit, anstatt es hier zurückzugeben, würden
Sie in die Datenbank gehen, Sie würden eine Verbindung herstellen, Sie würden die Datenbank abfragen und dann würden Sie die Daten von der Datenbank zurückgeben, so dass Sie würde nicht nur sagen, Rückkehr und dann ein Gebiet. Sie können sich diese Methoden als Datenbankzugriffsebene auf Lee vorstellen. Ein Teil Ihrer Anwendung sollte in der Lage sein, mit Ihrer Datenbank zu sprechen. Der Rest sollte Methoden verwenden, die der Datenbankzugriffsebene verfügbar gemacht hat. Also, wenn Sie Ihre eigene grafische L a p I für einen Block schreiben wollen, zum Beispiel, dass Sie alle diese Methoden behalten können, aber Sie müssen nur ihre Körper neu implementieren. Hier müssten Sie also wieder eine Verbindung zur Datenbank herstellen. Und jetzt habe ich auch einige Methoden, die einige unserer Daten herausfiltern. Also, zum Beispiel, erhalten Sie Blockbeiträge. Dieser holt die Details eines Blockposts mit einem bestimmten I D und hat das gleiche einen besonders Autor zu holen oder den Beitrag eines Autors zu holen oder alle
Kommentare zu holen , die Post haben. Ich habe jetzt eine Reihe von diesen Methoden. Ich habe auch eine Methode implementiert, die dafür verantwortlich ist, neue Daten in unseren Block hinzuzufügen. Und so hier gibt es Avenue Block Post
, der einen Parameter Beiträge nimmt, die wieder ein Objekt mit allen Eigenschaften des Post ist, und wir haben gerade dem Bereich hier hinzugefügt. Es ist alles sehr, sehr, sehr einfach, aber es kommt auf den Punkt. Also wieder, in Wirklichkeit, würden
Sie diese Methoden neu implementieren und Sie würden wahrscheinlich eine Verbindung zu einer Datenbank
wie meiner Fortsetzung unter Würden You Be , oder vielleicht einer Cloud-Version wie Dynamodb herstellen möchten. Was ist nun mit Beziehungen? Obwohl jedes dieser Objekte vollständig in sich enthalten ist, gibt es keine Referenzen von einem Objekt zum anderen. Aber wenn Sie genauer hinschauen und blockieren Post, zum Beispiel, können
Sie sehen, dass jeder Block Post hat eine Eigenschaft namens Autor, und darin speichern wir die Idee des Autors, der diese besonders Block Beiträge geschrieben hat. Also, wenn wir den Namen vom Autor eines Block-Post holen wollen, dass wir den
Blockpost nehmen sollten , sollten
wir die Autoreigenschaft nehmen und dann sollten wir die Datenbank für den Autor mit
diesem I d abfragen und dann können wir seinen Namen holen. Nun könnten
Sie denken, dass das Erstellen von Code, der all diese Beziehungen navigiert, sehr
zeitaufwändig sein wird , und Sie hätten Recht. Aber zum Glück brauchen
wir das nicht zu tun, denn Grafik Sie alle ist sehr klug. Sie müssen es nur beibringen, wie man jede Ressource einzeln abruft. Und dann können Sie es sagen, wie die Beziehungen gebildet werden. Sie müssen also keine komplexen Joint-Operationen wie in SQL verwenden. Alles klar, das war es für diesen Abschnitt wurden mit allen Vorbereitungen im nächsten Abschnitt getan, wir werden anfangen, unsere ganz eigene Grafik zu bauen Sie l A p i oben auf dieser kleinen Datenbank, Ich werde Ihnen zeigen, wie Erstellen eines Schemas. Damit diese Grafik werden Sie in der Lage sein, alle unsere Daten sinnvoll zu machen.
12. Objekttypen: Hey, jeder Bergbau MISC sowjetisch. Und in diesem Video werden wir die grafischen Objekttypen für Autorenkommentare und
Blockbeiträge implementieren . Jetzt ein Objekttyp und Grafik UL. Es ist wie eine klassen- und objektorientierte Programmierung. Es sagt im Grunde schlauen, Nun, welche Art von Objekten, die Ihr A p ich zurückkehren kann und welche Fehden sie haben. Also hier haben wir ein Beispiel Graphic ul Query. Alle diese Felder werden durch Objektzeiten definiert. Mit anderen Worten, wenn ein Objekttyp für Post keinen Titel enthält, können
Sie in Ihrer Abfrage nicht nach einem Titel fragen. Ziemlich unkompliziert. jedoch obersten Felder sindjedochunterschiedlich. Sie sind die Einstiegspunkte für Ihre Queries, und diese sind unterschiedlich definiert. Das sehen wir später in diesem Kurs. In diesem Video werden wir uns auf die Umsetzung der Objektzeiten konzentrieren. Okay, hier bin ich
also in Visual Studio-Code, und lasst uns damit beginnen, einen Objekttyp für den Autor zu implementieren. Nun, in den vorherigen Videos, haben
wir unsere Verzeichnisstruktur erstellt und der Objekttyp für Autor befindet sich unter dem
Typenverzeichnis unter Schema. Also werde ich mich von den Js öffnen und ich werde damit beginnen, eine neue
Konstante namens Autor zu erstellen oder zu exportieren . Und das wird von neuem graf que el Objekttyp jetzt in seiner Konstruktorregel sein, übergeben Sie Objekt. Und dieses Objekt wird alle Details über unsere Autoreneinheit enthalten. Bevor wir fortfahren,müssen
wir das notwendige Modul importieren. Bevor wir fortfahren, Also in diesem Fall wurden grafische ul-Objekttyp verwendet, aber Java-Skript weiß nicht, was das ist. Es ist nicht die Ordnung in unserer Datei, also müssen wir es zuerst aus dem Transplantat im gesamten Paket importieren. Also werde ich Import Graph que el Objekttyp aus der Grafik schreiben Ihr Paket. In Ordnung
, als nächstes können
wir dieses Objekt hier ausfüllen. Jeder Objekttyp sollte einen Namen und eine Beschreibung und einige Felder haben. Ich werde sie erschaffen. Jetzt. Ich werde diesen Objekttyp Autor nennen. Ich gebe ihm eine Beschreibung. Ich werde alle Details des Autors auf der Website sagen, und ich werde ihm ein paar Felder geben, was eine enge Funktion sein wird. Nun, Sie fragen sich vielleicht, warum Graft ul all das wissen muss. Das liegt daran, wenn Sie grafische verwenden, wird
es den Namen und die Beschreibung verwenden, um Menschen um Ihre A P zu führen. Ich nähe diese Stücke von Strings. Hier. Diese Texte erscheinen zwei Personen mit Ihrem A P I durch grafische. Es ist sehr einfach für sie, sich mit Ihren acht P vertraut zu machen. Also füllen wir die Felder aus. Lassen Sie uns nun einen Blick in große Datenbank werfen, um zu sehen, was Fields Autor dort hat. Hier können wir sehen, dass ein Autor eine Idee im Namen und eine E-Mail-Adresse hat. Jetzt wissen auch die Arten der Felder so Ideen. Ein String-Name ist eine Zeichenfolge, und auch E-Mail ist eine Stärke jetzt. Warum ist das wichtig? Nun, das ist, weil Grafik Sie eine statisch getippt werden. Und das bedeutet, dass wir angeben müssen, welchen Typ jeder furchtlos. Also gehen wir zurück zu ändern und lassen Sie uns auf den Feldern Gerade jetzt werde ich mit I D beginnen und ich werde sagen, dass i d vom Typ Grafik Sie gut, Stärke wieder. Diese Luft Spezialobjekte. Dies sind besondere Zeiten, in denen die Grafik normalerweise verwendet, um die Abfrage von
Benutzern zu validieren , aber auch vorher zu wissen, welche Art von Daten sie an den Benutzer zurückgibt. Also werden wir auch den Namen wenige hinzufügen, auch eine grafische UL-Zeichenfolge und die E-Mail-Felder ist, die auch Typ Graph-Schlüssel ist. Nun, Stärke jetzt, genau wie zuvor. Lassen Sie uns Graphic ul String importieren, bevor wir es vergessen. Also werde ich hier nur Import hinzugefügt, und ich werde sagen, wir werden auch Graphic UL-String aus dem schlauen kleinen
Paket importieren wollen . Alles klar, das ist alles, was wir tun müssen, um unser Autorenobjekt zu implementieren. Lassen Sie uns mit einem Typ für Kommentare fortfahren. Jetzt werde
ich damit beginnen, eine geschuldete Disc zu kopieren, weil viel davon nur Boilerplate-Code ist und wir es für Kommentare wiederverwenden können. Objekttyp. Also werde ich das gemeinsam eröffnen. Ja. Ich werde den ganzen Mantel hier reinkleben. Und ich werde offensichtlich ein paar Sachen ändern, also werde ich gemeinsame Variable exportieren. Ich werde den Namen ändern. Ich werde die Beschreibung ändern. Ich werde Details zu Kommentaren sagen. Und jetzt natürlich müssen
wir
natürlichauch einige dieser Bereiche ändern. Also werfen wir einen Blick auf Fig Datenbank. Welche Felder, die ein gemeinsames hat und hier sehen kann. Common hat eine Idee gepostet den Namen und einen Inhalt Felder Jetzt werden wir den Post I D ignorieren . Vorerst, weil dieses Feld eine Beziehung mit dem Post-Objekt erstellt. Aber das haben wir noch nicht erstellt, also werden wir das später umsetzen. Also gehen wir zurück zum gemeinsamen Typ hier. Ich werde diese Felder entfernen, weil wir sie neu implementieren müssen. Ich werde sagen, dass der Kommentar ein i D hat und dieses Mal ist es nicht vom Typ String. Es ist eigentlich Typ-Grafik, die Sie in bestimmte. Schau zurück, jetzt ist es ein Imager. Es ist keine Schnur mehr, also müssen wir das auch in unserer Zukunft reflektieren. Ein Kommentar hat auch den Namen der Person, die es geschrieben hat, die offensichtlich eine typografische Zeichenfolge ist. Und es hat den Inhalt von den Booten selbst, was auch von typographischer UAL-Stärke ist. Nun, bevor wir vergessen, lassen Sie uns bei den notwendigen Importen waren mit Grafiken, die Sie hier in, aber wir importieren es nicht. Also lasst uns das jetzt reparieren. Da gehen wir. Das ist die Umsetzung für Kommentar. Objekttyp. Nun gehen wir zum letzten Mal über, das wir brauchen, und das ist der Objekttyp für Block rühmt. Jetzt ist dieser etwas komplizierter, weil er zwei Beziehungen hat. Ah, Block Boast hat einen Autor und es könnte einige Kommentare haben. Und wir wollen definitiv auf diese beiden Beziehungen durch unser Handwerk zugreifen. Dein A p I. Also nochmal, ich werde damit anfangen, den Code von unserem gemeinsamen Typ hier zu kopieren, und ich werde ihn in unsere Post JS-Datei einfügen. Ich fange wieder an, indem ich einige dieser Dinge hier ändere. Also werden wir wertvolle Beiträge exportieren. Wir geben ihm die Namensbeiträge und die Beschreibung wird alle Details von einem
Blockposten sein . Also lassen Sie uns einen Blick und Fig Datenbank wieder zu sehen, was Fehds einen Block Post Hüte. Und hier können wir sehen, der Block Post hat ein I D. Das ist eine inter Jury. In diesem Fall hat
es auch einen Titelinhalt und einen Autor. nun auch Dieses Autorenfeld istnun
auchein Verweis auf einen Autor. Es ist es schafft eine Beziehung. Also müssen wir diesen Aziz Well definieren, also fügen wir unsere Felder hinzu. Gehen wir zurück zu Beiträgen s, damit wir i d behalten können. Wir werden den Namen in Titel ändern und wir werden auch Inhalte verlassen, und es Typen sind bereits korrekt. Alles klar, das sind die Grundlagen getan, aber zuletzt implementieren Sie jetzt die Beziehung, die ein Beitrag mit einem Autor hat. Also werden wir hier einen Feld-Autor hinzufügen, und dieses Feld wird etwas Besonderes sein. Also werden wir sagen, dass der Typ dieses Feldes vom Typ Autor ist, aber das ist nicht genug. Wir müssen auch Grafik Sie sagen. Nun, wie es die Details über diesen Autor bekommen kann und das erfordert einen weiteren Aufruf an unsere Datenbank . Also müssen wir eine Auflösungsfunktion
und diese Ergebnisfunktion hinzufügen . Ich werde hier auch in einer Pfeilfunktion verwenden, und es wird eine Kopie von unserem Post-Objekt erhalten, und dann können wir alles tun, was wir mit diesem Post-Objekt wollen. Aber wir sollten die Informationen über den Autor zurückgeben, der mit diesem Block Post verknüpft ist. Also in der Fig Datenbank habe ich eine Methode dafür. Es heißt „Autor holen“, und wir werden es hier zurückgeben. Wir werden sagen, zurück große Datenbank Punkt Get Autor, und wir werden ihm die Idee des Autors geben. Und das ist
natürlich Stort . Insiderbeitrag in den Autorenfeldern. Was wir also im Wesentlichen tun, ist diese Variable genau hier. In diesem Beitrag wird es eine vollständige Kopie von einem dieser Objekte erhalten. Und was brauchen wir, um den Autor zu bekommen? Was? Wir nehmen das Autorenfeld direkt hier mit nehmen seinen Wert, und dann übergeben wir das entlang, um Autorenmethode zu erhalten, um die Details über einen Autor zu erhalten. In Ordnung, also vergessen wir nicht, die notwendigen Importe zu machen. Also werde ich einen Import für den Autor hinzufügen. Ich werde den Autor vom Autortyp importieren, sich im selben Verzeichnis befindet. Und ich muss auch eine gefälschte Datenbank importieren, die an den Wurzeln unseres Quellverzeichnisses sitzt. In Ordnung, so. So können wir jetzt eine andere,
komplexere Beziehung implementieren . Ah, Block. Boast kann einen oder mehrere Kommentare haben. Also sagen wir, dass das gemeinsame Feld vom Typ Kommentar sein wird, aber es wird eine Liste von Kommentaren sein. Wie machen wir das? Nun, das ist ein weiteres Feld hier hinzufügen. Ich werde diese Kommentare nennen, und das ist eine Zeitkommentare, aber wieder, wir brauchen eine Liste von Kommentaren, also werden wir oder gemeinsamen Typ in ein neues graf Kuba Listenobjekt so einschließen. Und so jetzt Grafik Sie wissen gut, dass Sie nicht einen Kommentar zurückgeben, sondern dass Sie möglicherweise einen Arm oder Kommentare in diesem Feld
zurückgeben. Also nochmal, wir werden eine Ergebnisfunktion hinzufügen. Diese Ergebnisfunktion erhält unseren Beitrag erneut. Ich werde hier eine Pfeilfunktion verwenden, und wir möchten große Datenbank zurückgeben, keine Kommentare für Beiträge erhalten. Und wir werden das Id von der Post, die wir gerade benutzen, weiterleiten. Und vergessen wir noch einmal nicht, die notwendigen Importe zu machen. Offensichtlich, schlauer. Nun, listen Sie hier auf. Also müssen wir wichtig aus der Grafik Ihr Paket. Jetzt wissen wir, wie man diese Beziehungen macht. Gehen wir zurück zum Typ des Autors. Es wäre interessant, wenn Leute alle Blockbeiträge anfordern könnten, die von einem
bestimmten Autor geschrieben wurden . Also lassen Sie uns ein Postfeld zum Objekttyp für den Autor hinzufügen, also werde ich es Post nennen. Es wird ein Typ Post sein, aber es wird eine Liste von Beiträgen sein. Es ist also ein neues grafisches Ural List-Objekt mit unserem Posts Objekttyp. Und wir brauchen auch eine Ergebnisfunktion, die den aktuellen Autor erhält. Und was wir tun wollen, ist, dass wir gefälschte Datenbank Punkt zurückgeben wollen Holen Sie Beiträge aus, Autor, und wir werden entlang der Autor I d übergeben. Und wieder, vergessen
wir nicht, die notwendigen Importe zu machen. Ich verwende die Grafik, die Sie aus dem grafischen UL-Paket auflisten. Ich muss auch den Posts-Objekttyp aus dem aktuellen Verzeichnis importieren. Und ich muss die Feigendatenbank importieren, die wieder an den Wurzeln unseres Quellverzeichnisses sitzt. Alles klar, das war es für dieses Video, das wir alle grafischen Objekttypen wieder implementiert haben, diese telegraphischen UAL, die sich anfühlt, unseren Benutzern aussetzen zu wollen und wie es mit der Beziehung zwischen -Daten. Allerdings müssen
wir auch Telegraphen Schlüssel gut, wie es die Entitäten in erster Linie holen kann. Im Moment haben wir Graphic UL erzählt, welche Felder ein Blockpost hat, aber wir haben ihm nicht gesagt, wie man tatsächlich einen Block Post aus der Datenbank holen kann. Also im nächsten Video werden
wir das beheben. Wir werden Aquarius implementieren
13. Fragen: Hey, alle. Im vorherigen Video
haben wir die Objekttypen implementiert, die von Crafts UAL verwendet werden, um zu wissen, welche Felder eine Entität hat. Es hilft auch Grafik. Sie werden die Beziehung zwischen Objekten verstehen. Aber es gibt ein Problem. Hier ist Grafik Ihre Abfrage, die Details über einen Block Beiträge und über den Autor abruft
, der sie geschrieben hat. Nun, nach der vorherigen Videografik, UL ist in der Lage, die Details über einen Autor zu holen, da wir eine Auflösungsfunktion implementiert haben , die die Beziehung zwischen Post und Autor behandelt. Grafik UL weiß jedoch nicht, wie es das Routenfeld hier abrufen kann. Dafür müssen
wir einige Abfragen implementieren. Jetzt werden wir drei Abfragen implementieren. Eine, um alle Blockbeiträge zu
erhalten, Details über einen bestimmten Beitrag zu erhalten und einen bestimmten Autor zu erhalten. Jetzt werden die letzten beiden ein Argument erfordern. Also lasst uns anfangen. Also bin ich wieder in Visual Studio-Code und wir werden mit der Implementierung der Prahl-Abfrage beginnen . Also werde ich die Post-JS-Datei innerhalb unseres Abfrageverzeichnisses öffnen, und ich werde damit beginnen, ein Standardobjekt zu exportieren. Ich werde Standardwerte exportieren, und in diesem Objekt werde ich einen Property Kult Beiträge erstellen. Und das wird auch der Name unserer Anfrage sein. Also wählen Sie es mit Bedacht, weil Leute es verwenden werden, wenn sie Ihr A P verwenden. Ich Beiträge jetzt wieder ist ein Objekt, das die Details über unsere Abfrage enthält. Also zuerst müssen wir Grafik Sie sprechen Nun, welche Art von Daten dies in unserem Fall zurückgeben wird. Es wird eine Liste von Blockbeiträgen zurückgeben. Der Typ ist also neu. Graphic UL listet von Beiträgen auf, und wir müssen ihm auch eine Beschreibung geben. Also werde ich sagen, eine Liste der letzten Blockbeiträge
bekommen. Das ist eine ziemlich schöne Beschreibung. Auch hier wird
diese Beschreibung angezeigt, wenn Benutzer grafisch verwenden. So Reiten eine gute Beschreibung wird Ihren Benutzern helfen, Ihre A P I schneller zu übernehmen, weil sie
ein wenig Hilfe bekommen . Jetzt können
wir auch Argumente akzeptieren, wenn wir wollen oder wenn wir es brauchen. Aber in diesem Fall müssen
wir keine akzeptieren. Also werde ich dieses Objekt jetzt leer lassen. Schließlich brauchen
wir wieder eine Ergebnisfunktion, die tatsächlich in die Datenbank geht und die
Daten holt , die wir brauchen. Also werde ich Entschlossenheit schreiben. Ich werde ihm eine Funktion geben. Und dieses Mal werde ich nur die Feigendatenbank anrufen, und ich werde nur eine Liste von Blockposten bekommen. Also wieder, in unserem Fall, FIG-Datenbank ist eine Datenbank-Abstraktion Es Hamels die gesamte Kommunikation mit auf der tatsächlichen Datenbank. In Wirklichkeit können
Sie den gleichen Code verwenden, wie ich hier tue. Aber Sie müssen nur die Implementierung von der Gasblock-Post-Methode ändern. Okay, das war's
also für diese Abfrage. Es ist ziemlich einfach. Das einzige, was ich tun muss, ist, dass wir sicherstellen müssen, dass wir die notwendigen
Abhängigkeiten importieren . Also brauchen wir Grafik Sie Eine Liste aus dem Graph curole Paket. Wir brauchen den Post-Objekttyp aus unserem Types-Verzeichnis, und wir brauchen Fig Datenbank, die im Wurzelverzeichnis von unserem Quellverzeichnis sitzt. Also lassen Sie uns jetzt weitergehen und die Autorenabfrage implementieren. Also werde ich diesen Code kopieren und einfügen, denn wieder ist
ein Großteil dieses Codes für den Autor ähnlich, also werde ich die Autor-Dot-Js-Datei innerhalb unseres Abfrageverzeichnisses öffnen. Ich füge den ganzen Code hier ein, und ich werde damit beginnen, den Namen dieses Feldes hier zu ändern. Rufen Sie diesen Autor an und ich werde auch die Beschreibung ändern. Und ich werde sagen, dass diese Abfrage einen bestimmten Autor bekommt. Da gehen wir. Wir müssen auch den Typ ändern. Also jetzt werden wir keine Liste von Beiträgen mehr zurückgeben. Wir werden tatsächlich Details über den Autor zurückgeben. Und wir brauchen jetzt auch einige Argumente, denn wenn ich die Details über einen bestimmten
Autor als Grafik bekommen möchte , müssen
Sie wissen, über welchen Autor ich die Details erfahren möchte. Also werde ich sagen, dass diese Abfrage, außer auf Argument, I d
genannt wird und dieses Argument vom Typ graphische UAL-Stärke sein sollte. Aber wir können hier mehr tun. Diese Abfrage kann ohne Argument nicht funktionieren. Wenn Sie die Details über einen Autor wollen, müssen
Sie in a d angeben, ob das grafische Übel kein i d hat. Dann kann es keine Details über einen Autor abrufen, weil es nicht weiß, welchen Autor es holen
muss . Date on Damit wir diese Grafik einpacken können. Sie werden eine Zeichenkette innerhalb eines neuen grafischen UAL nicht kein Objekt und dies wird Ihnen die Grafik mitteilen. Nun, dass das Argument erforderlich ist und in der Tat, grafisch. Sie alle validieren Abfragen, bevor sie ausgeführt werden. Und wenn es sieht, dass das Ideenargument es fehlt, wird
es nicht einmal Ihre Abfrage ausführen. Und es wird nicht mit Ihrer Datenbank interagieren ziemlich praktisch. Und schließlich müssen
wir implementieren, was wir brauchen, um die Ergebnisfunktion besser zu ändern. Diese Funktion erhält nun zwei Parameter statt eines. Erstens erhält
es das übergeordnete Objekt, und zweitens erhält
es alle Argumente für diese Abfrage. Ich könnte so etwas schreiben. Ich könnte sagen, Eltern Argumente, und dann könnte ich die große Datenbank anrufen und ich kann sagen, get author. Und dann werde ich die Argumente nehmen, die im Grunde eine Kopie dieses Objekts sind, aber dann mit tatsächlichen Werten gefüllt, so dass ich sagen könnte, dass Argumente dachte ich d ,
aber ich kann auch direkt das i-D-Argument mit Atmos Skript sechs Zerstörungszuweisungen und was ich tun kann, ist, anstatt Argumente zu verwenden, kann
ich Syntex so verwenden, und was dies tun wird, wird das I-D-Feld aus dem Objekt extrahieren, das diese Funktion einen zweiten Parameter gefragt
wird, und dann könnte einfach ich d so verwenden. Es ist also eine etwas kürzere Syntax. Es ist auch eine neue Syntax, also lassen Sie uns das vorerst behalten. In Ordnung? Also, wieder, um diese Abfrage zu beenden, muss
ich unsere Importe reparieren. Wir brauchen keine Grafik. Du listet noch gut auf. Aber wir
brauchen
jedoch jedoch Graphic ul string, und wir brauchen graph que el non. Nein. Und wir müssen auch Autor importieren, und wir brauchen keine Post mehr. Also werde ich Autor aus dem Autorenbeitrag importieren, und wir können unseren Import für die gefälschte Datenbank behalten. In Ordnung, also gehen wir zur endgültigen Abfrage über. Ich werde diesen Code noch einmal kopieren, und dieses Mal werden wir unsere Beiträge implementieren. Abfrage. Also werde ich hier,
äh,
Mantel einfügen äh, . Und dies ermöglicht es Benutzern, die Details zu einem bestimmten Blockpost abzurufen. Also wieder, wir müssen es ein bisschen ändern. Ich werde dieses Curry nennen, einfach posten, es wird ein Post-Objekt zurückgeben, und wir geben ihm auch eine bessere Beschreibung. Wir werden sagen, bekommen Details über einen bestimmten Beitrag. Da gehen wir. Jetzt werden wir dieses Ideenargument hier behalten, weil der Benutzer es weiterleiten sollte wenn er Informationen über bestimmte Post erhalten möchte. jedoch Die Idee eines Postens istjedochkeine Stärke. Es ist ein Imager. Also müssen wir den Typ
auch hier ändern . Grafik werden Sie. Und jetzt ist die Ergebnisfunktion auch fast identisch. Also erhalten wir weiterhin das Elternobjekt, und wir extrahieren weiterhin die A-D-Lebensmittel aus den Argumenten. Aber wir müssen die Methode ändern, die wir in unserer Glaubensdatenbank verwenden, also brauchen wir nicht den Autor zu bekommen, den wir brauchen, um Blockbeiträge zu erhalten. Also, wie immer, lassen Sie uns ihre Importe reparieren. Wir brauchen den Import des Autors nicht mehr. Jetzt müssen wir Beiträge importieren und wir brauchen keine Grafik. Du wirst fadeln. Aber wir brauchen Graph que Nun, es ist in Ordnung. Ich werde die Datei speichern und das war's. Wir haben nun die Abfragen für R A P I implementiert. Im nächsten Fehler werden
wir einige Eingabe-Objekttypen implementieren, und dies wird die Grundlage für unsere Mutationen bilden, die wir im Video machen werden. Danach ein
14. Input: Hi, alle. In diesem Video werden
wir Eingabe-Objekttypen implementieren. Vor nur zwei Videos haben wir regelmäßige Objekttypen erstellt, die von Kunsthandwerk verwendet werden. Sie alle wissen, welche Felder es dem Benutzer zur Verfügung stellen kann. Nun, Eingabe-Objekttypen sind fast genau die gleichen, außer dass sie verwendet werden, wenn Benutzer Daten an Ihre A.
P I Eingabe-Objekttypen senden helfen Ihnen alle zu überprüfen, ob ein Benutzer ihm alle notwendigen gegeben hat -Feldern und wenn diese Felder nicht vom richtigen Typ sind. Zusammenfassend können
Sie sagen, dass Objekttypen Anfragen verwendet werden, wenn Personen Daten von
Ihren A P I-Eingaben anfordern . Objekttypen sind Houston-Mutationen, bei denen Menschen Daten an Ihr A P I senden Lassen Sie uns
also implementieren, um Objekttypen für unseren Block ein p I einzugeben. Ich möchte, dass Autoren in der Lage sein, neue Blockbeiträge zu erstellen, und ich möchte, dass Benutzer in der Lage sein, Kommentare durch unsere Grafik Ihr L a p I. Lassen Sie uns
also mit der Erstellung eines Eingabe-Objekttyps für den neuen Block Post beginnen. Ich werde diese Eingabe-Objekttypen in der gleichen Datei wie die regulären Typen speichern. Also werde ich die Pfosten-Dot-Js-Datei in unserem Typenverzeichnis öffnen, und ich werde eine neue Konstante namens Post-Eingabetyp exportieren. Und dies wird ein neuer grafischer UAL-Eingabe-Objekttyp sein. Und wieder, wir werden das Objekt in It-Konstruktor weitergeben. Kein Eingabe-Objekttyp ähnelt dem unregelmäßigen Eingabetyp in dem Sinne, dass sie auch einen Namen,
eine Beschreibung und einige Felder benötigen . Also werde ich ihm nur einen Namen geben. Ich werde es Post-Input nennen, und dann gebe ich ihm ein paar Felder. Welches Feld schließen wir hier ein? Nun, ich werde sagen, wenn ein Autor einen neuen Block Post erstellt, müssen
wir den Titel,
den Inhalt und den Autor kennen , ich werde sagen, wenn ein Autor einen neuen Block Post erstellt,müssen
wir den Titel,
den Inhalt und den Autor kennen,
also werde ich diesen Feld-Autor jetzt anrufen. Wir müssen auch den Typ jedes Feldes neu definieren. Der Titel wird also vom Typ Graphic UL-Zeichenfolge sein, und dasselbe gilt für den Inhalt. Und für den Autor, weil
wir in der Fed-Datenbank den Autor I d als Stärke implementiert haben. Aber es gibt noch mehr, nicht nur Saiten. Sie sind Pflichtstränge. Sie können nicht leer sein, da ein Blockbeitrag ohne Titel oder ohne Inhalt oder ohne Autor nicht existieren sollte. Daher müssen wir unsere Typen in ein grafisches UL-Nichtmetallobjekt einwickeln. Also werde ich sehen, dass dieser Typ neu ist. Graph que el non? Nein, und ich werde Grafik einpacken. Du wirst darin einreißen. Ich werde dasselbe für diese drei Felder tun. Nun, bevor wir vergessen, lassen Sie uns auch Importe für grafische Euro-Eingabe,
Objekttyp und Grafik hinzufügen . Sie werden jetzt an der Spitze unserer Datei wissen So Grafik werden Sie Objekttyp eingeben und Handwerk cura non. Nein, da gehen wir. Lassen Sie uns nun zum Eingabe-Objekttyp für Kommentare übergehen. Ich werde diesen Code hier kopieren, und ich werde unseren gemeinsamen Typ öffnen und den Code dort einfügen. Nun, natürlich, werden
wir den Namen dieser Variablen ändern. Wir sagen Kommentar, Eingabetyp, und wir geben ihm einen anderen Namen. Kommentare, Eingabe. Ich rufe das an und wir müssen die Felder wechseln. Aziz. Nun, wenn Sie
also einen Kommentar schreiben, müssen
wir Ihren Namen,
den Inhalt Ihres Kommentars und die Idee des Beitrags, auf dem Sie Ihren
Kommentar hinterlassen möchten, kennen den Inhalt Ihres Kommentars und die Idee des Beitrags, auf dem Sie Ihren
Kommentar hinterlassen möchten . Also werde ich das jetzt tun. Ich werde nach deinen Namensinhalten fragen, die wir behalten können. Und, natürlich, die Idee des Beitrags, dass Sie Ihren Kommentar machen möchten. Lassen Sie uns nun prüfen, ob die Typen korrekt sind. Name und Inhalt sollten nicht grafisch sein. Sie werden Stärke, aber post i d. Die Idee einer Post interfaith Datenbank ist ein Typ imager, so dass wir eine schlaue gut hier auch benötigen. Also noch einmal, lassen Sie uns ihre Importe reparieren. Wir müssen Grafik ul Eingabe-Objekttyp importieren. Wir müssen Handwerk importieren, Sie wissen,
kennen und transplantieren Kuba Ins. Und das war es für dieses Video wieder, wir haben die Eingabe-Objekttypen erstellt, die wir jetzt in unseren Mutationen verwenden werden. Handwerk. Sie wissen, welche Felder den Benutzern geben sollen, wenn er einen neuen Blockbeitrag erstellen möchte oder ob er neue Kommentare erstellen möchte. Grafik-UL weiß jedoch nicht, wie sie in die Datenbank schreiben sollen. Also im nächsten Video werden wir Mutationen implementieren, so dass wir diese Daten speichern können, um
Datenbankzu arbeiten Datenbank
15. Mutationen erstellen: Hallo, alle. Im vorherigen Video haben wir Eingabe-Objekttypen erstellt und ich habe Ihnen gesagt, dass diese die Grundlage für Mutationen waren. Nun, in diesem Video werden
wir zwei Mutationen für eine Grafik implementieren. Sie Nun,
wennSiesich nicht erinnern, was Mutationen sind, überprüfen Sie Abschnitt zwei der Partituren, um Ihr Gedächtnis zu aktualisieren. So sind die beiden Mutationen eine, die Autoren erlauben, neue Blockbeiträge in unserer Datenbank zu posten, und eine
andere, um Benutzern zu erlauben, Kommentare zu blockierten Beiträgen zu posten. Beginnen wir also mit den Anzeigen, die Mutationen veröffentlichen,
da Mutationen sehr ähnlich wie Abfragen sind. Alle beginnen, indem Sie den Code aus unserer Post Abfrage kopieren. Also werde ich auf dem Posten aufmachen. Hier beängstigend. Ich werde den ganzen Code auswählen und kopieren, und ich werde ihn in die Werbepostdatei JS in unserem Mutationsverzeichnis einfügen. Jetzt müssen
wir das ein bisschen anpassen. Für den Anfang werde
ich diese Mutation bei Post nennen, und diese Mutation wird einen neuen Block Post in die Datenbank schreiben. Aber es wird auch die neu erstellten Blockposts zurückgeben, so dass der Benutzer damit arbeiten kann, wenn er will. Also werde ich den Typ so halten, dass er hier posten soll. Wir geben ihm auch eine richtige Beschreibung. Wäre dabei zu sagen, dass dies einen neuen Block Post erstellt und es sollte auch ein Argument akzeptieren . nun einen neuen Block erstellen möchte, Wenn der Benutzernun einen neuen Block erstellen möchte,sollte er die Daten jetzt weiterleiten, könnte
ich ein Argument für jedes Feld für unseren Beitrag erstellen, so dass das ein Argument für den Titel wäre. Ein weiteres Argument für den Inhalt, Ein weiteres für die Autoren. Eine effizientere Möglichkeit besteht
jedoch darin,den Eingabe-Objekttyp zu verwenden, den wir im letzten Video erstellt haben. jedoch darin, Also werde ich nur ein Argument erstellen, und ich werde das entfernen, das wir
gerade haben . Und ich werde ein einzelnes Argument namens Post erstellen, und ich werde sagen, dass Post sein sollte, wenn Art von Posteingabetyp. Jetzt brauchen
wir auch eine Ergebnisfunktion, um Ihnen Grafik mitzuteilen. Nun, was es tun sollte, wenn es diese Daten von einem Benutzer erhält. Dies ist also eine Funktion, die es wieder unsere übergeordnete Variable erhält, und sie erhält alle Argumente, die an diese Mutation übergeben wurden. Also, was wir hier tun werden, ist, dass wir das Post-Argument für unsere Ergebnisfunktion extrahieren. Und das einzige, was wir tun müssen, ist, dass wir einen Anruf zur gefälschten Datenbank machen müssen und wir müssen einen neuen Block Post hinzufügen. Und ich habe diese Methode bereits bei New Block Post gemacht. Und natürlich werden
wir unser Post-Argument übergeben, das wir hier erhalten haben. Wir werden das an diese Methode weiterleiten. Jetzt wir dies auch zurück, weil
Sie in der Grafik viele Mutationen dasselbe Objekt zurückgeben, das Sie gerade erstellt haben. In unserem Fall, wenn Sie die Mutation bei der Post ausführen, wird
es tatsächlich die Daten zurückgeben, die sie tatsächlich an die Datenbank übermittelt hat. Und das könnte interessant sein. beispielsweise Wenn Siebeispielsweiseeinen neuen Beitrag erstellen und Ihren Autor gegeben haben, erhalten Sie diesen Beitrag zurück. Aber dann können Sie
zum Beispielnach dem Namen des Autors fragen zum Beispiel , der wiederum einige Beziehungen beinhaltet. Bevor wir fortfahren,müssen
wir unsere Importe noch einmal korrigieren, damit wir den Posten hier wichtig halten können. Bevor wir fortfahren, Aber wir brauchen einen Import für unseren Posteingabetyp. Also werde ich nur sagen, dass wir Beiträge von den Typen post importieren, und wir brauchen auch Post-Eingabetyp. Ordnung, also werde ich die Datei speichern und jetzt unsere zweite Mutation machen, und das ist Kommentar hinzufügen. Bevor wir das tun können,müssen
wir sicherstellen, dass unsere Datenbank-Obstruktion damit umgehen kann. Bevor wir das tun können, Und im Moment hat
es keine Methode, mit der Sie neue Kommentare erstellen können. Also lassen Sie uns diese Methode erstellen. Zuerst werde
ich hier eine Feigendatenbank öffnen, und ich werde den ganzen Weg nach unten scrollen. Und hier habe ich ein paar richtige Methoden. Und im Moment habe ich hier nur einen neuen Block-Boost hinzugefügt. Also werde ich eine Methode hinzufügen namens neue Kommentare hinzufügen und dies wird einen Kommentar erhalten. Objekte aus unserer Grafik lösen Sie Funktion und alles, was diese Methode tun sollte, ist Kommentare ein gültiges Ich schiebe es in den Bereich genau hier. Der Bereich, der den gesamten Inhalt enthält, kommentiert, und dann sollte es den neu erstellten Kommentar zurückgeben. Also lasst uns das jetzt machen. Wir werden anfangen, indem ich Kommentar in I d. So könnte ich es hier eine einzigartige Idee geben, aber ich werde nur sagen, dass diese Dokument-Kommentare nicht lang plus eins sind. Also, wenn sie fünf Kommentare in der Datenbank sind, dann wird die Idee des neuen Kommentars fünf
plus eins sein , und das wird sechs sein. Danach schieben
wir es auf die Gegend. Wir werden das sagen oder kommentieren. Drücken Sie. Wir werden diesen Kommentar dazu drängen, und dann kehren wir auch zurück, um zu kommentieren. So dass unsere Grafik Sie ausziehen. Ich kann es dem Benutzer präsentieren. In Ordnung, also lasst uns jetzt Mutation umsetzen. Ich werde die ungewöhnliche Datei öffnen, und ich werde zuerst alles von und Beiträge kopieren. Ich werde das in Tempo setzen. Sie werden den Namen ändern. Ich werde es anrufen. Fügen Sie einen Kommentar hinzu. Dies wird ein Kommentarobjekt zurückgeben. Wir geben ihm auch eine richtigere Beschreibung. Wir werden sagen, erstellt einen neuen Kommentar für einen Block Post. Dies wird ein Argument erhalten, aber es wird keinen Beitrag erhalten. Es wird einen Kommentar erhalten. Und das wird aus Kommentaren, Eingabetyp und in einem Ergebnis Funktion sein. Wir müssen uns unsere Kommentarargumente holen, dieses hier. Und dann müssen wir Fig Datenbank anrufen und wir müssen sagen, haben neue Kommentare und dann
werden wir weitergehen, um Argument direkt dort zu kommentieren. Also, um fertig zu werden, lassen Sie uns unsere Importe reparieren. Also müssen wir Kommentare importieren, die wir importieren müssen. Wir müssen Kommentar importieren, Eingabetyp, und wir importieren es aus Sind Kommentare Types Datei, die in unserem Types Verzeichnis befindet. In Ordnung, sagen
wir die Datei und das war es für dieses Video mit implementierten Mutationen, die es Menschen
ermöglichen, neue Daten in eine Grafik einzureichen. Sie l A p i. Jetzt sind wir fast bereit, ihre Grafik Ihre l a p I zu testen. Im nächsten Video werden
wir alles zusammen werfen, um unser Schema zu erstellen. Und dann sind wir fertig. Also lassen Sie uns mit dem nächsten Video fortfahren.
16. Ein Schema erstellen: Hi, alle. In den letzten Videos haben
wir alle Bausteine für unsere grafische UL-Implementierung erstellt. Wir haben Objekttypen, Abfragen, Eingaben, Objekttypen und Mutationen erstellt. Und jetzt ist es an der Zeit, all das in unserem Schema zusammenzubringen. Nun, ein Schema sagt im Grunde Grafik Sie Nun, wie es könnte Ihre Daten an Kunden aussetzen und wie Kunden neue Daten auf die A p I.
Das Schema zustimmen . Es definiert die Form von all diesen Daten. Jetzt wird unser Schema in der nächsten RGS-Datei innerhalb unseres Schemas ein Verzeichnis leben. Also werde ich zusammenbrechen, dass Fuller hier ist. Ich werde die nächste Stop-JS-Datei öffnen. Lassen Sie uns also beginnen, indem Sie eine Konstante namens Schema erstellen. Und das wird ein neues grafisches UAL-Schema und wieder in seinem Konstruktor sein. Wir werden leeres Objekt in diesem Objekt übergeben, wir werden zwei Eigenschaften definieren, eine Eigenschaft für Abfrage und eine Eigenschaft, vier Mutationen. Also werden wir sagen, crary, die ein neuer grafischer ul-Objekttyp ist, initialisieren Sie es mit einem leeren Objekt. Und es wird auch eine Imputation haben, die auch ein neuer grafischer UAL-Objekttyp ist. Also lassen Sie uns die Abfrage implementieren, weil dies ein Diagramm Curiel-Objekttyp ist. Es erfordert einen Namen und optional eine Beschreibung, genau wie wir es bei den Objekttypen für Post Kommentar und Autor getan haben. Also werde ich den Namen der Abfrage geben. Ich werde sagen, dass dies unsere Routenabfrage ist, und wir müssen ihm auch einige Felder Felder Felder geben, die der Benutzer anfordern kann. Und das sind die Felder der obersten Ebene. Dies sind die Stammfelder, mit denen Ihr Benutzer arbeiten kann. Also werde ich hier ein Eigenschaftsfeld hinzufügen, und wir werden eine Pfeilfunktion verwenden, die ein Objekt zurückgibt. Dies wird sicherstellen, dass wir unseren Umfang behalten, dass wir auf alle Variablen und Methoden zugreifen können , die wir in dieser Datei haben. In unserem Fallhaben
wir Abfragen und Mutationen in anderen Dateien definiert,
daher müssen wir sie zuerst importieren, bevor wir damit arbeiten können. In unserem Fall haben
wir Abfragen und Mutationen in anderen Dateien definiert, Also werden wir Beiträge aus unseren Abfrage-Ordner-Beiträgen importieren. Wir werden unsere Post-Abfrage auch von Abfragen Post importieren, Jess. Und dann werden wir die Autorenabfrage von Abfragen Schrägstrich Autor importieren. Während wir dabei sind, werden
wir auch Grafik ul Schema und Transplantationsschiene Objekttyp importieren. So importieren Grafik Sie Schema und Graph que el Objekttyp aus der Grafik, die Sie
packen werden . Da gehen wir hin. Und jetzt, da wir es wichtig haben, unsere Abfragen, können
wir sie einfach als Felder hier hinzufügen. Und um das zu tun, werde
ich verwenden, um Operatoren zu verbreiten. Ich werde sagen, Punkt Punkt Punkt nicht Beiträge Punkt, Punkt, Punkt Beiträge und Punkt, Punkt, Punkt Autor. Jetzt wird
der Spread-Operator den Inhalt von Beiträgen Autor und Post nehmen. Und es wird diesen Inhalt in diesem Objekt genau hier gefallen. Es ist also fast wie dort, außer dass wir sie aus einer anderen Datei importieren, um unser Projekt einfacher zu pflegen und leichter zu verstehen. Jetzt können wir dasselbe für Mutation tun, also werden wir sie auch importieren, um zu sagen, importieren Sie Beiträge von Mutationen, Schrägstrich auf Post, und wir werden importieren und Kommentare von Gedanken Schrägstrich, Mutation Schrägstrich und Kommentare. Und jetzt können wir sie hier einen Schwung hinzufügen. Also geben wir unserer Mutation einen Namen. Es wird die Wurzelmutation sein, und es wird einige Felder erhalten, die wiederum eine Pfeilfunktion ist, die ein
Objekt zurückgibt . Und wir werden den Spread-Operator verwenden, um den Inhalt für bei Post hinzuzufügen und Kommentar hinzuzufügen. In Ordnung, ich werde die Akte speichern. Und das war es für dieses Video. Wir haben alle unsere Bausteine,
unsere Anfragen und unsere Mutationen genommen , und wir haben sie in unser Schema aufgenommen. Und jetzt grafisch. Sie können es auch Schema verwenden, um unsere Abfragen und unsere Mutationen zu behandeln. Nun, im nächsten Video, sind
wir endlich bereit, das FBI zu testen und es in Aktion zu sehen.
17. Unsere GraphQL testen: Hi, alle. Im letzten Video haben wir unsere Grafik Sie Schema erstellt. Und das bedeutet, dass wir jetzt alles haben, was wir brauchen, um unsere MP zu verwenden I Also, in diesem Video, werden
wir testen, ob r p i richtig funktioniert. Jetzt werde ich dies in der nächsten Datei in unserem Quellverzeichnis implementieren. Und das enthält einige Tesco, die wir in einem der früheren Abschnitt verwendet haben. Also werde ich den Import zu grafisch halten Sie alle. Aber ich werde jetzt das Konsul Log hier entfernen. Neben Grafik, Sie Nun, wir müssen auch importieren sind Schema, weil Grafik ul Bedürfnisse Schema sind, um zu wissen, welche
Objekttypen wir in unseren ap Augen haben. Was für eine Abfrage? Sri erlaubt, welche Mutationen wir haben. Also werden wir die Hoffnung importieren, die nach oben scrollen. Das ist grausam. Wieder zurück. Also werden wir Schema aus dem Schemaverzeichnis importieren und wenn der Eintopf geladen ist, können
wir jetzt anfangen, eine Grafik zu schreiben. Na gut, Crary Also werde ich eine Konstante namens Abfrage erstellen und ich werde sie initialisieren. Und hier verwende ich ein Template-Literal, weil ich dann Zeilenumbrüche verwenden kann, ohne
sich um Zitate kümmern zu müssen . jedoch Sie könnenjedochauch regelmäßige Stärke verwenden. Es ist alles gleich. Unsere Abfrage wird also eine sehr einfache sein. Nehmen wir an, dass ich eine Liste von allen Block, Post und von jedem Block rühmen möchte ich den Titel. In der Grafik legen
Sie Wert auf erstellte Objekte. Dann sagst du, ich will die Post die Blockpfosten und fromage Block Post. Ich will diesen Titel sehr einfach. Also, jetzt, wo wir unsere Abfrage schwächen gegen unser Schema ausgeführt haben, also werde ich Sie
Grafik nennen , die wir hier importieren und ich werde Grafik geben. Du wirst ein Schema sein, das wir auch hier importiert haben. Und dann werden wir unsere Abfrage jetzt übergeben grafische UAL arbeitet synchron und das
bedeutet, dass hier ein Versprechen zurückgibt. Also müssen wir auf die Ausgabe warten, wenn Sie damit arbeiten möchten. Also, das zu tun verspricht, müssen Sie es hinzufügen, dann Methode, die die Ergebnisse von Grafik erhalten Sie Nun, dies wird eine Pfeilfunktion sein. Und dann können wir hier mit den Ergebnissen arbeiten. Also alles, was ich tun werde, ist, dass ich die Ergebnisse sperren werde, damit wir sehen können, was
drin ist . jedoch, Beachten Siejedoch,dass die Ergebnisdaten, die wir von der grafischen UL erhalten, alle JavaScript-Objekte sind. Und wenn du sehen willst, was sich in einem Objekt befindet, musst
du zuerst einen Kampf anlegen. Also werde ich Jason Dot String of fine auf unsere Ergebnisse nennen. Und ich möchte auch ein bisschen hübsch sein, es muss formatiert werden. Also werde ich es zusätzlichen Parametern geben. Die 1. 1, die ich wissen werde. Das ist, weil wir wollen, wenn ich alle Felder und dann werden wir die
Nummer zwei passieren . Und das bedeutet, dass es in Dellen unser Objekt hier, ein Ergebnis Objekt mit zwei Leerzeichen, und das wird es leichter zu lesen. Alles klar, noch
eine Sache, die hier zu tun haben muss. Wir behandeln das Versprechen damit, aber wir behandeln keinen Fehler. Also werden wir hier eine Fangmethode hinzufügen. Und wenn es jemals einen geben sollte, melden wir uns einfach an der Konsole an, damit wir über
mögliche Evers Bescheid wissen . Also werde ich die Datei speichern und ich werde dich testen oder grafisch testen. Ich öffne
das Terminal hier und ich werde zuerst unser Build-Skript ausführen. NPM Run Built erneut. Wir haben dieses eines der vorherigen Videos definiert. Dies wird babble laufen, und anscheinend haben wir ein bisschen ein Problem mit Siehe hier doppelte Deklarationsgrafik Sie in werden. Es scheint also, dass wir Transplantat UAL zweimal in unser Kommentarobjekt importiert haben. Also lassen Sie uns einen Blick auf Kommentare werfen und ja, da gehen wir. Lassen Sie uns das entfernen. Lass uns wieder lebensfähig laufen. Sehen Sie noch weitere Probleme in unseren Code-Tagen. Sie gibt es einige Stick Look jetzt Common ist nicht in unseren Post-Objekttypen definiert. Mal sehen. Ja, wir verwenden hier gemeinsam, aber wir haben es nicht importiert, also lasst uns das jetzt importieren. Importieren Sie Kommentare aus unserem Kommentar. Objekttyp. Da gehen wir. Lassen Sie es uns noch einmal laufen. Und jetzt sagt es, Schema muss eine Instanz des grafischen Ural-Schemas sein. Also stimmt etwas mit unserem Schema überein. Lass es uns öffnen. Und das Problem ist, ich habe vergessen, unser Schema zu exportieren. Also finden wir hier ein Schema, aber wir exportieren es nicht. Also alles, was wir tun müssen, ist zu sagen, Export-Standardwerte, Scheming, und jetzt sollte alles in Ordnung sein. Lass es uns nochmal laufen und da gehst du. Unsere Grafik. Deine Aly P. ich arbeite. Das ist also die Antwort, die wir auf unsere Anfrage bekommen. Also lassen Sie uns von der Abfrage hoffen. Also haben wir nach allen Beiträgen in unseren Blockbeiträgen gefragt, und wir haben nach dem Titel jedes dieser Blockposts gefragt. Und so bekommen wir Beiträge zurück, was ein Bereich ist, und es enthält ein Objekt pro Post in unserer Datenbank mit dem Titel aus dem Post. Lassen Sie uns also beenden, indem Sie eine erweiterte Abfrage testen, die auch Beziehungen verwendet. Nehmen wir an, ich möchte eine Liste aller Blockpost mit dem Namen des Autors, der sie geschrieben hat. Also wollen wir den Titel. Ich werde sagen, wir wollen auch den Autor und wir wollen den Namen des Autors. Also lassen Sie uns die Datei speichern. Lassen Sie uns das Skript erneut ausführen oder erstellen. Und sicher genug, jetzt bekommen wir eine Liste von Block Post mit ihrem Titel mit einem Autorenfeld und mit Namen aus dem Autor. Also, das war es für dieses Video und leisten diesen Abschnitt sind Grafik Sie l a p I Implementierung ist jetzt abgeschlossen und es funktioniert tatsächlich. Im nächsten Abschnitt. Ich werde Ihnen zeigen, wie Sie grafisch einrichten können, so dass Sie Ihre A p i mit einer sehr
schönen Waffe oder Gesicht bestreiten und sogar Funktionen wie Auto Vervollständigen als Ihren Typ in Ihrer Abfrage erhalten.
18. Einführung in GraphiQL: Hallo, jeder in diesem Abschnitt, wir werden unsere A p I mit grafischen testen. In diesem Video
werde ich erklären, was grafische ISS und warum es eine gute Idee sein könnte, es zu verwenden. Danach zeige
ich Ihnen, wie Sie grafische nur für P I installieren und einrichten. Und schließlich werde ich Ihnen zeigen, wie Sie grafische selbst verwenden. Lassen Sie uns damit beginnen, zu erklären, was grafisch ist. Ich habe den Stuhl in früheren Videos verwendet, um die Kernkonzepte aus Grafik zu erklären Sie jetzt um Ihre a p I zu testen .
Sie müssen Anfragen an einen Webserver stellen. Sie können dies tun, indem Sie einige kleine Skripte schreiben, oder Sie können APS verwenden, die speziell dafür im Falle einer Pause entwickelt wurden. AP Augen Es gibt viele Werkzeuge, um dies zu tun. Ich denke an Werkzeuge wie Postmen Paw, den eingebauten Rest-Client von Jet Brain, IDs und so weiter. Graphic ist genau wie diese Werkzeuge, außer dass es mit der Grafik u l e p i anstelle einer Pause a p i funktioniert. Aber es hört nicht auf. Grafisches ist viel intelligenter als jedes andere AP I-Tool. Es integriert sich in Ihre Grafik U L f b I, und es fragt es nach allen unterstützten Abfragen, Mutationen und Typen. Jetzt, mit diesen Informationen, grafische ist in der Lage, Ihnen Syntax bieten, Hervorhebung intelligenter, automatischer Abschluss Echtzeitfehler, Hervorhebung einer automatischen Abfragevervollständigung. Tatsächlich wird
grafisch als eine Idee für Grafik beschrieben. Sie gut, und das Beste von allem, es läuft vollständig in Ihrem Browser. Also lasst uns direkt eintauchen. Im nächsten Video werden
wir grafisch als Abhängigkeit hinzufügen und ein kleines bisschen Code schreiben, damit es tatsächlich ausgeführt wird .
19. Grafiken installieren und konfigurieren: He, alle. In diesem Video werden
wir installieren und konfigurieren grafische, so dass Sie beginnen können, es zu verwenden. Jetzt werden wir NPM verwenden, um grafische als Abhängigkeit für unser Projekt zu installieren. Nun, bevor wir grafische verwenden können, jedoch sicherstellen, müssen
wir
jedoch sicherstellen,dass unser A p I innerhalb http Aufruf zugänglich ist. Also müssen wir unseren Web-Server für das laufen Jetzt, ohne G s Welt, viele Leute verwenden Express. Es ist ein einfaches Replikations-Framework, und es gibt sogar ein Notiz-Paket, das grafische Sätze mit Express zu sammeln. Lassen Sie uns das also in unser Projekt installieren. Ich werde ein Terminal öffnen und ich werde NPM installieren Dash laufen,
Strich sicher zu telegraphen que gut, dass es diese Abhängigkeit innere verpackte Jason-Datei speichern sollte. Und dann werde ich sagen, dass es installieren,
ausdrücken und ausdrücken sollte Grafik Sie gut, und dieser letzte wird die Integration zwischen Grafik UAL und Express bieten, so dass wir das
nicht selbst schreiben müssen. Also lasst uns das jetzt laufen. Jetzt, mit denen installiert, brauchen
wir ein kleines Stück Java-Skript, das einen Express-Server startet und grafisch
darauf verweist , dass ich eine neue Datei in unserem Quellverzeichnis erstellen werde, und ich werde dies nennen Surf Dot Jazz. Ich werde das Terminal schließen, und ich werde mit dem Importieren beginnen. Unsere Abhängigkeiten beginnen mit dem Import von Express aus dem Express-Paket. Und wir werden auch Grafik ul http aus der Express-Grafik importieren Sie gut, Bibliothek. Und wieder, dies ist ein spezielles Paket, das Grafik,
ul und grafisch kompatibel mit Express macht . Nun, schließlich, weil wir Abfragen ausführen wollen, die wir importieren müssen, sind Schema, so dass Grafik böse weiß welche Daten wir haben und wie wir darauf zugreifen können. Also werde ich jetzt das Schema aus diesem Verzeichnis importieren, mit dem erledigt, können
wir einen neuen Webserver erstellen. Und so werde ich eine neue Konstante namens App erstellen, und ich werde hier ein neues Express-Objekt initialisieren. An diesem Punkt haben
wir einen Webserver, aber er hat noch keine Endpunkte, also werde ich es hinzufügen, indem ich nach der Verwendung sage und dies erfordert zwei Parameter. Die 1. 1 ist der Endpunkt, den Sie freigeben möchten. Und die 2. 1 ist eine Funktion, die auf eine Anfrage reagiert, also werde ich die Schrägstrickgrafik gut aussetzen und zeigen. Und jetzt müssen wir angeben, welche Funktion unsere Anfrage behandelt. Und wir werden Grafik Sie al h verwenden, um aus dem Paket zu sein, das wir gerade hier importiert haben. Also werde ich graphic ul http aufrufen und in seinem Konstruktor werde
ich ein leeres Objekt übergeben, und hier können wir die Optionen für Grafik weitergeben. Bist du draußen, Http? Also erster Stopp, wir gehen zu übergeben oder Schema, um es. Damit es weiß, welche Anfragen wir unterstützen und wie es mit unserer Datenbank sprechen soll. Und dann werden wir grafische aktivieren, aber nur die grafische Eigenschaft auf true setzen. Alles klar, wir sind fast fertig. Nun, das letzte, was wir tun müssen, ist, dass wir unseren Webserver starten müssen, indem wir sagen, dass unsere Aktion auf einen bestimmten Port hört. Also werde ich auf der Konsole sagen, starten Sie den Server, so dass wir ein bisschen Feedback haben und dass ich sagen werde, App Punkt Hören, und ich werde unsere glücklos und auf Port für 1000 jetzt machen,
denken Sie daran, denken Sie daran, Wenn wir das Skript ausführen wollen, müssen
wir zuerst babble ausführen, und dann müssen wir unser Skript ausführen. Lassen Sie uns das automatisieren, indem Sie ein neues Skript in unserem Paket von Jason Datei erstellen. Also werde ich hier das Paket der Jason-Datei öffnen,
und ich werde hier ein neues Skript erstellen, und ich werde das Skript servieren nennen. Und das erste, was es tun sollte, ist, dass es tatsächlich unser Projekt bauen sollte. Also werde ich sagen, plappern Quelle. Und dann ist das Ausgabeverzeichnis dies und der zweite Befehl, den es ausführen sollte, ist es sollte ausgeführt werden. Werden in Js-Datei mit No Jess serviert. Also werde ich diesen Knoten machen. Das diente dem Denk-Jazz. In Ordnung, also speichern wir die Datei und probieren wir sie aus. Ich werde Terminal öffnen und ich werde NPM Run surfen laufen. Und wie Sie sehen können, läuft
dieses Skript jetzt babble zu transpire sind Java-Skriptcode, wie Sie hier sehen können und dann läuft es auch ihren Webserver. Dies ist die Nachricht von unserer servierten JS-Datei und Sie können auch sehen, dass es meine
ewige Eingabeaufforderung beschäftigt hält , weil der Webserver tatsächlich läuft, so dass ich jetzt keinen
neuen Befehl in meinem Terminal eingeben kann , weil der Webserver noch läuft oder kein Jazz -Prozess auf eingehende Anfragen wartet. Also, das war es für dieses Video oder Web-Server ist auf und läuft. Es ist bereit, Anfragen zu erhalten, Also im nächsten Video, werden
wir grafische verwenden.
20. Verwendung von GraphiQL: Hi, alle. In diesem Video werden wir einen Blick darauf werfen, wie Sie grafische verwenden können und Sie werden sehen, warum es
so ein großartiges Werkzeug ist . Es ist ein weiterer Vorteil der Grafik Sie L a p s Hälfte über traditionelle ap Eis. Also, nur um das letzte Video zusammenzufassen, müssen
Sie unser Serve Skript ausführen, um Express Web-Anwendung zu starten, die grafische Host wird . Also werde ich das Terminal öffnen und in unserem Projekt genau hier. Ich werde nur npm laufen lassen, Sir. Und wieder, dies wird unseren Express-Server starten und lassen Sie uns jetzt Chrome öffnen und gehen Sie zu lokalen Hosts 4000. Das ist der Port, den wir Express konfiguriert, um auf Schrägstrich Grafik laufen Sie gut und wir sind jetzt von grafischen
begrüßt. Jetzt ist es die Schnittstelle ziemlich einfach. Auf der linken Seite sehen
Sie die Abfrage und Imitation, die Sie gerade ausführen. Sobald sie Transplantat ausgeführt werden, zeigen
Sie sie immer auf der rechten Seite des Bildschirms. Jetzt an der Spitze haben
Sie auch einige Werkzeuge, die Sie spielen Taste haben, die Ihren Code eine ziemlich fünf Schaltfläche ausführt um Ihre Anfragen richtig zu formatieren und zu erfinden hier. Und Sie haben eine Verlaufsschaltfläche, die sich in unserem Panel öffnet, in dem Sie kürzlich abgegebene Abfragen angezeigt werden. Lassen Sie uns also eine einfache Abfrage schreiben, die eine Liste von Blockbeiträgen mit dem Titel für jeden erhält. Nun nehmen wir auch an, dass ich ein neuer Benutzer bin, der sein FBI noch nicht benutzt hat und dass es
keine Dokumentation gibt , die jetzt verhaftet sei, ohne die richtige Dokumentation kann ein Albtraum sein. Aber wie wird es mit Grafik gehen? - Sie? Nun, lassen Sie uns damit beginnen, zu sagen, dass ich eine Abfrage schreiben möchte. Ich werde die geschweiften Klammern öffnen und als neuer Benutzer weiß
ich nicht, welche Routenfelder diese ap ich unterstütze. Also werde ich nur das Auto heraufbringen, komplett durch versteckten Kontrollraum. Nun, das ist die gleiche Abkürzung, die viele I d Ys auch verwenden. Also hier erhalten wir eine Liste der unterstützten Routenfelder und wir bekommen sogar eine schöne Beschreibung. Also hier sehen wir Beiträge und die Beschreibung ist eine Liste der letzten Block Post bekommen. , Denken Sie daran,dass wir diese Beschreibung im Schema definieren, jetzt könnte es ein wenig erzogen aussehen, um
sie im Schema zu definieren , aber hier kommen sie wirklich zum Tragen. Also lasst uns eine Liste von Blockbeiträgen bekommen, die ich treffen werde ,
Enter, und ich werde die geschweiften Klammern wieder öffnen. Und genau wie zuvor kann
ich jetzt grafisch nach den Feldern fragen, die ich anfordern kann. Und sicher genug, es gibt alle Felder, die wir anfordern können. So kann ich
zum BeispielTitel auswählen zum Beispiel und Tab drücken, und es wird sich in unserer Abfrage berechtigt fühlen. Also lassen Sie uns nun diese Abfrage testen und lassen Sie uns ausführen, indem Sie auf das Spiel klicken. Aber und wie Sie sehen können, erhalten
wir eine Liste von Blockbeiträgen auf der rechten Seite. Ziemlich einfach. Jetzt kann ich meine Abfrage weiter ändern. Mal sehen, was grafisch tut, wenn ich ihm keine vollständige Abfrage gebe. Nehmen wir an, ich möchte auch den Namen des Autors, aber dass ich hier nur nach dem Autorenfeld frage. Nehmen wir an, dass ich nicht weiß, dass ich den Namen oft Autor wählen muss. Jetzt sollte das nicht funktionieren, weil wir angeben müssen, welche Felder des Autors wir wollen. Aber lassen Sie es uns trotzdem laufen. Also, wenn ich auf Play klicke und wie Sie sehen können, grafisch darauf aufgenommen und es hat die I-D-Felder automatisch hinzugefügt, bevor Sie
unsere Abfrage ausführen . Es handelt sich also um Fehler, indem sie versuchen, sie vorher zu korrigieren, und in diesem Fall funktioniert
es ziemlich gut. Jetzt machen wir es ein bisschen schwieriger statt Titel, lassen Sie uns einen Tippfehler auf Lassen Sie uns jetzt nach einem Titel fragen. Wie Sie sehen können, Graphic Novel nicht fangen. Dieser Fehler fordert dies nicht auf. Es ist nicht warnen Sie uns, dass dies eine ungültige Abfrage ist, aber wenn ich dies ausführe, werden
Sie sehen, dass Graphic UL tut. Und es besagt, dass wir nicht nach einem Feldtitel fragen können, da dies auf unserem
Posttyp nicht verfügbar ist. Und es versucht auch, hilfreich zu sein. Und da steht: „ Haben Sie Titel gemeint? Und natürlich haben wir auch ziemlich handlich gemacht. Nun, endlich, möchte
ich Ihnen das Dokumentationspanel zeigen. Wenn Sie also hier in der rechten Ecke auf Docks klicken, öffnet sich
ein Panel mit der Dokumentation, die die grafische UAL aus unserem Schema extrahiert hat. So kann ich sehen, welche Chöre Luft möglich ist, zum Beispiel, Also lasst uns die Wurzelabfrage hier öffnen, um zu sehen, was Reed-Felder anfordern können. Und sicher genug, hier sind drei Routenfelder. Ich kann nach Beiträgen für einen einzelnen Beitrag oder nach Details über einen Autor fragen, und es zeigt sogar, welche Art von Daten er zurückgibt. Also post gibt einen Bereich von Post-Objekten und unseren Post-Feldern zurück, mit Ausnahme eines Arguments I d, das vom Typ imager sein sollte. Und dafür mussten wir nichts nochmal tun. Es hat dies aus den Beschreibungen in ihrem Schema und aus oder Rückgabezeiten extrahiert. Jetzt kann ich immer wieder auf Felder klicken. Also, wenn ich wissen möchte, wie ein Post-Objekt aussieht, klicke
ich einfach darauf und dann kann ich sehen, dass Opposed alle Details eines Block-Posts hat, und ich kann die Felder sehen, die es hat. Also, das war es für dieses Video. Hoffentlich merkt man, wie mächtig grafisches Böse ist. Der nächste Abschnitt wird zusammengefasst. Dieser Kurs wird über die Schlussfolgerung zu sprechen, und ich werde Ihnen einige interessante Ressource geben, ist Ihre Grafik Ihre Suche fortzusetzen
21. Schlussbemerkungen: Hey, alle,
vielen Dank, dass du die Partituren gekauft hast und sie bis zum Ende beobachtet hast. Ich hoffe, Sie genießen diese Videos und dass Sie viel von ihm gelernt haben. Graphic UAL ist ein erstaunliches Werkzeug. Und obwohl es noch sehr jung ist, wird
es bereits in großen Unternehmen wie Facebook eingesetzt. Steh auf Yelp und viele mehr. Und jetzt wissen Sie, wie Sie Ihre eigene Grafik erstellen können. Sie l e p I. Nun, wenn Sie Fragen oder Anregungen für zukünftige Kurse haben, auf jeden Fall lassen Sie es mich wissen. Ich schätze jede Rückmeldung, die Sie haben könnten. Ich habe auch den Quellcode veröffentlicht, der während dieses Kurses verwendet wurde, den Sie
als ZIP-Datei ausgegeben haben und ihn als Vorlage verwenden, um Ihre eigene Grafik zu erstellen. Sie, Aly p. Ich stelle auch sicher, um meine YouTube-Kanal für weitere Tutorials zu überprüfen oder meine
Website zu überprüfen . Das war's. Nochmals vielen Dank, dass Sie die Ergebnisse gesehen haben und ich hoffe, Sie auf meinem nächsten Kurs zu sehen