DAN ARMENDARIZ: Hallo und willkommen bei a CS50 Seminar über Customizing Cloud 9, und der CS50 IDE. Also heute werden wir zu gehen nur ein wenig sprechen über einige der technischen Informationen, geht hinter der Architektur von Cloud 9, und wie haben wir einige der Plug-ins implementiert haben als Teil der Cloud 9 bis CS50 IDE bereitzustellen. Also lassen Sie uns einfach direkt rechts in und sprechen über Plug-Ins. 

So Plug-Ins sind wirklich bei der Kern des Cloud 9 Erlebnis. Cloud 9 ist die zugrunde liegende Technologie dass bietet uns die IDE, und auch das Terminal-Fenster an die Unterseite, zusammen mit dem workspace-- die Ubuntu workspace--, dass wir verwenden, um alle unsere Projekte zu kompilieren und führen unser Problem-Sets, füllen Sie das Problem-Sets. Aber im Herzen von allen davon, die gesamte Technik ist wirklich nur ein Haufen von Plug-Ins. Alles ist ein Plug-in daß modifiziert werden kann, erweitert, die Sie erstellen können Ihre eigenen Plug-Ins, Sie können andere zu entfernen Plug-Ins, um wirklich zu verändern eine ganze Menge von der Funktionalität der bestehenden Cloud 9-IDE. 

Das ist also eine bestehende Cloud 9 Umfeld. Das ist wirklich nur die Standard Cloud 9 Umfeld. Und schauen Sie sich, wie es tatsächlich unterscheidet sich von der CS50 IDE. Das ist also der CS50 IDE. Beachten Sie, dass es einige visuelle Veränderungen zwischen der regulären Cloud 9 Umwelt und CS50 IDE. Genauer gesagt, werden Sie bemerken ein paar Veränderungen. Zunächst einmal gibt es weniger Menüpunkte zu beginnen. Es gibt tatsächlich ein Weg, dass Sie das ändern. Es heißt Simple Mode. 

Standardmäßig ist die Simple Mode aktiviert ist, und Das vereinfacht einige der Menüpunkte. Es beseitigt einige der fortgeschritteneren, denn ehrlich gesagt, eine Menge Studenten, die in kommen und müssen nicht über einige wissen, der erweiterten Funktionen nicht überfordert mit einer Reihe von Optionen. Aber wir bieten die Möglichkeit, nehmen Sie Aus diesen so genannten Stützräder und entfernen Sie, dass Gerüste, damit die Menschen kann mehr daran gewöhnt, zu werden Die erweiterten Funktionen der IDE. Sofort an den Rechts davon gibt es auch eine Debug-Taste, die in der Standard-Wolke 9 Umfeld heißt einfach laufen. Aber standardmäßig, die wir eingerichtet haben der Debug-Button in der CS50 IDE rufen Sie die Debugger, automatisch zu kompilieren den Quellcode, verbinden Sie den Debugger an der darunterliegenden GDB-- und seit dem läuft durchzuführen die debugging-- und einige andere Schritte auch. Auch das Terminal-Fenster an die very-- oder vielmehr das Terminal Registerkarte auf der Konsole Abschnitt am Fenster am unteren Rand des Bildschirms, umbenannt wurde, um einfach Terminal sein. Während im Standard- Cloud 9 Umfeld es tatsächlich zeigt die laufende Anwendung. Auf diese Weise vereinfacht sie, wieder die GUI, nur ein kleines bisschen. 

Wir haben auch noch ein paar Knöpfe an der oberen rechten Seite des IDE einige grundlegende Informationen zeigen über den zugrundeliegenden Beispiel. Und auch wir haben einen entfernt der Optionen auf den Artikel von der rechten Seite. Also all das ist nicht implementiert durch Modifizieren unbedingt der Cloud 9 Source-Code, aber statt durch ein paar von Plug-Ins, die wir umgesetzt haben, im gesamten vergangenen Jahr oder so. Und Cloud 9 hat gehostet und hat in der CS50-Arbeitsbereich läuft. Oder besser in den Arbeitsbereichen, die als CS50 IDEs bezeichnet. 

Also wirklich, das ist der Hauptunterschied zwischen der Cloud 9 und dem CS50 Arbeitsbereiche. Es gibt auch in der zugrunde liegenden Beispielsweise ist die primäre Änderung dass wir etwas zu installieren vorkonfigurierte Produkte wie GDB, und einige andere grundlegende Dinge, die wir haben geschaffen, wie aktualisieren 50, und ein paar andere Schritte, die machen die ganze Erfahrung ein bisschen mehr vereinheitlichte. Aber alles in allem, dies ist nur eine Modifikation eines bestehenden Systems dass Cloud 9 hat für uns geschaffen. Was wir zu gehen zeigen, ein wenig später ist, wie man tatsächlich schaffen ein etwas einfach Plug-in, ermöglicht es uns, etwas in den Einsatz Menü-System, und öffnen Sie einen Dialog. Und wenn wir genug Mal werden wir tatsächlich sehen, wie wir, dass bevöl Dialog mit einigen Informationen aus dem zugrundeliegenden Beispiel. Damit wir auf das zu bekommen Punkt, lassen Sie uns zuerst ein wenig sprechen über die Architektur der Cloud 9. 

So ist die Art, wie wir es gewohnt sind um die Interaktion mit Cloud 9 ist vollständig durch den Client. Wir eröffnen einen Web-Browser, wir im CS50.io. Typ Schließlich haben wir, nach der Authentifizierung, sind mit dem IDE dargestellt. Aber erkennen, dass es ein paar Schritte dass tatsächlich bekommen uns zu diesem Punkt. Das allererste, was ist, dass mein Mandant, der Web-Browser, Auf Anfrage und nach der Authentifizierung, lädt die GUI und die Plug-ins von einigen CDN, von einigen Content Delivery Network. Dies kann ehrlich gesagt überall sein. 

Und das ist eigentlich getrennte aus dem zugrundeliegenden Beispiel. Es ist wichtig zu erkennen, dass dies eigentlich nur ein Haufen von statischen Dateien. Es ist eine Reihe von JavaScript dass aus dem CDN heruntergeladen auf meiner Web-Browser, und alle von der GUI, die Sie siehe hier-- dies wirklich key-- alle von der GUI, die Sie hier sehen, wird auf der Clientseite ausgeführt. Alles, was Sie sehen, in der Cloud 9 Arbeitsbereich tatsächlich im Browser ausgeführt. Und alles, was Sie zu senden entlang der darunterliegenden Instanz ist mit der Instanz mitgeteilt entlang dieses zweiten separaten Kanal, und wird dann auf gespeicherte dass docker Instanz. 

Also der Grund, dass ich sage, dies ist ein Beispiel docker ist, dass die zugrunde liegende Technologie wird nicht mit virtuellen Maschinen, sondern wird unter Verwendung einer Technologie namens docker, die im Grunde allows-- der Nähe Analogie ist eine virtuelle Maschine. Aber es auf subtile Weise anders ist dadurch gekennzeichnet, dass es viele Möglichkeiten, um einen Lauf Kombination verschiedener docker Instanzen auf einer Maschine. Und sie können sich versponnen werden in sehr schneller Folge. Es ist nicht ganz so mehr strikte Unterscheidung zwischen verschiedenen Instanzen docker da es in virtuellen Maschinen, aber immer noch gibt es eine Menge von Differenzierung und Trennung zwischen diesen verschiedenen Instanzen. OK. So sind die beiden Schritte hier, dass es wichtig zu erkennen, ist, dass, wenn wir gehen, um CS50.io sind wir Herunterladen der GUI und die Plug-Ins, die in JavaScript geschrieben werden, an den Browser oder in an den Browser. Und das ist vielleicht ein paar Megabyte im Wert von Informationen. An diesem Punkt hat, sobald der GUI geladen und die Plug-Ins haben begonnen, dann zu kommunizieren beginnt sie die Hafenarbeiter etwa, die nicht der Fall ist notwendigerweise die gleichen Server sein. 

Jetzt gibt es eine Ausnahme. Wir können tatsächlich haben sowohl die Lieferung Mechanismus für die GUI selbst und die Hafenarbeiter etwa in alle aus dem gleichen Server, ist eigentlich etwas, was wir tun, für die Offline-Version von Cloud 9. Das ist nicht etwas, dass wir publizierte sehr in diesem Herbst, aber wir haben auch eine Offline-Version, gestattet Ihnen, ein verpacktes Version der all diese Dinge und ermöglicht es Ihnen, Wolke laufen 9 in einer Offline-Umgebung. 

Umzug diese aus der Cloud und auf Ihre lokale Maschine hat einen gewissen Einfluss. Insbesondere können Sie keine die Fähigkeit mehr haben zu Ihrem Arbeitsbereich mit anderen teilen. Sie können nicht mehr von Cloud 9 zu öffnen, und der CS50 IDE, von einem beliebigen Computer und sehen die gleichen Dateien, Sie wurden mit vor der Arbeit. Sondern es funktioniert hundert auf Ihrem eigenen lokalen Rechner ohne Zugang zum Internet. Aber immer noch selbst in diesem Modell, auch obwohl wir eine virtuelle Maschine das ist im Wesentlichen laufen diese Dinge. 

Wir haben einen separaten Server, der ist liefert im Wesentlichen die Cloud 9 Inhalte, und dann werden wir haben eine docker Instanz das ist für die Kommunikation verantwortlich mit dieser IDE für die Back-End. OK. So dass die gesamte GUI geschrieben komplett in JavaScript Verwendung Node.js und die Cloud 9 SDK, die wir in nur einer Minute. Und alle Plug-ins werden auf der Client-Seite ausgeführt. Also lassen Sie konzentrieren die dann wenig unter der Annahme, daß dieser erste Schritt hat tatsächlich erfolgreich abgeschlossen ist, und suchen Sie nur an dieser docker Instanz. 

So dass in diesem Fall ist diese ist der normale Weg Denken über das Tun Cloud 9 Plug-In- Entwicklung ist, dass Sie gehen, zu werden, Code zu schreiben, dass Will in den Browser des Benutzers ausgeführt werden, und Sie haben die Möglichkeit, mit einigen APIs, um zu kommunizieren mit dem zugrunde liegenden docker Beispiel laufen einige Code gibt, und alles tun, dass Sie vielleicht wollen. Also das sein wird, der Zusammenhang, dass wir werden mit für den Rest dieses Vortrags. Und gerade zu halten dieses Modell im Auge. Dies wird sehr wichtig sein, in nur wenigen Minuten. Es gibt ein paar Links Ich möchte Ihnen zeigen. Zuerst von allen, hat Cloud 9 vorgesehen eine ganze Reihe von Unterlagen das ist ziemlich gut, das zeigt, wie um grundlegende Plug-in-Entwicklung zu tun. Also, wenn Sie zu dieser URL zu gehen, cloud9-sdk.readme.io, Sie werden die Dokumentation dort zu sehen. Und viele dieser Informationen dass Sie über zu sehen sind kann auch dort zu finden, plus mehr. Sie können auch die Open-Source zu finden Version von Cloud 9 unter dieser URL, github.com/c9/core, die wir als Teil der Offline-Version der IDE, so dass Sie in der Lage sein müssen das gleiche Cloud 9 Erfahrung, aber in einer Offline-Weise. Gut. Werfen wir also einen Blick auf ein Ist Cloud 9 Arbeitsbereich hier. Und wieder, möchte ich darauf hinweisen out ein paar Dinge. Dies ist direkt hier, eine normale CS50 IDE. Und ich habe eine weniger deaktiviert komfortable Modus unter dem Menü Ansicht so dass ich alle sehen der Menüoptionen. Was ich will, um Sie richtig zu zeigen ist jetzt ein paar Dinge. First off, wenn ich in zu gehen die Einstellungen und dann klicken Sie auf Plug-in-Manager, und in CS50 geben Sie hier Wir können sehen, dass es in der Tat, ein paar CS50 Plug-Ins, installiert und unsere laufenden zu ermöglichen die Änderungen, die wir für den CS50 IDE gesehen. 

Im Moment gibt es im wesentlichen zwei Plugins, die ausgeführt werden. Es gibt eine einfache genannt, die ist der vereinfachte Modus, Damit können Sie die Anzahl zu reduzieren, der Menü-Optionen am oberen Rand, und das sogenannte haben weniger komfortabel Modus. Und dann gibt es auch CS50 Stats, Das ist vielleicht nur geringfügig falsch benannt. Denn dies ist das, was zeigt Ihnen die Informationen über die zugrunde liegenden Arbeitsbereich. Es injiziert diese Tasten entlang der oberen rechten Seite. Es injiziert auch einen Menüpunkt in der Fenster Artikel, in dem Menü Fenster genau hier, CS50 IDE Info. Und es ist zum Instanziieren verantwortlich dieser Dialog, die wir hier gesehen habe, mit allen Informationen, die wir sind zu sehen, in einem CS50 IDE gewöhnt Arbeitsplatz. OK. Es gibt also tatsächlich noch ein Plug-in dass wir so gut entwickelt. Und es gibt noch ein paar andere, dass wir haben auch nicht öffentlich freigegeben. Aber eine von ihnen ist die Gesamt Plug-In, mit dem GDB zu funktionieren. Damit wird eines der Aspekte der Cloud 9 ist, dass sie bereits zur Verfügung gestellt haben Diese GUI, einen Debugger zu implementieren. Und eines der Plug-Ins, Wir haben im Grunde erstellt Haken GDB mit diesem GUI basierte Version von einem Debugger. Und ist für die Vermittlung all verantwortlich der Anträge, die ein Benutzer haben könnte, zwischen stieg über oder Erstellen von Breakpoints oder irgendetwas in diese Richtung, zu übersetzen, dass um Befehle, die GDB kann verstehen, die Ausstellung diese Befehle, um GDB. Und sobald GDB gibt eine Antwort, dann interpretieren wir das und aktualisieren Sie die GUI wie nötig. 

Das ist wahrscheinlich eine der Je komplizierter der Plug-Ins, so dass anstelle, was wir sind werde heute hervorheben ist in der Tat die Statistik-Plug-in, und wir reden ein wenig über einfache, wie auch. So erwähnte ich vorher, und ich wirklich will sehr, sehr klar, dass wieder zu machen, all dies, dass wir hier sehen, ist im wesentlichen die auf der Client-Seite. Wir sehen ein Terminalfenster unten, und das natürlich wenn wir geben Befehle in dass, die dann ausgegeben werden an der darunterliegenden Beispiel. Und falls wir eine neue Datei zu öffnen und Geben Sie ein paar Sachen in sie und speichern Sie es, wird diese Datei auf speichern das zugrundeliegende Instanz. 

Aber der Redakteur selbst, diese Terminal-Fenster selbst, ist alles in realisiert JavaScript und alles ist ein Plug-in dass wir mit zu interagieren, und deshalb zu ändern. Es gibt eine Menge an Dehnbarkeit hier. Ich empfehle einen Blick bei Cloud 9 von GitHub Account um die große Menge an zu sehen Plug-Ins, die verfügbar sind, und wie gut geschrieben viel des Codes für die Erweiterbarkeit. So gibt es etwas dass ich erwähnen möchte, über diese sowie, das ist, dass es eine Menge von-- es eine Menge von Funktionen, die es in den Einstellungen zur Verfügung gestellt Fenster, die wir gerade gesehen haben spielte auf gerade vor ein paar Minuten. 

Eines der Dinge, die wir als IDE tun können Entwickler oder als Cloud 9-Entwickler, ist, um tatsächlich zu injizieren einige Preference Panels unserer eigenen. So ist die Einfach-Modus, oder die weniger komfortabel Modus und auch die IDE Informationen oder die Statistiken Plug-in, hat jeder eine gewisse Präferenz Platten, die wir ändern können Das Verhalten von jedem von diesen. Sie werden bemerken, dass, wenn ich gehen, um die Einstellungen und gehen Sie zu Benutzereinstellungen, es gibt eine CS50 Registerkarte, einer das sagt IDE Informationen. Und ich kann das ändern Informationen Bildwiederholrate. 

Effektiv, was passiert in den Statistik-Plug-in ist, dass alle n-Sekunden, wobei n-Sekunden wird durch diese Einstellung festgelegt Panel, wird Informationen abgerufen aus dem zugrundeliegenden Beispiel gesendeten zurück zu der Client-Seite, das Plug-in ist dann Interpretation der Informationen von der zugrunde liegenden Instanz und Aktualisieren der GUI nach Bedarf. Wir können sehen, dass gerade jetzt diese gesetzt ist bis 30 Sekunden, und das ist die Standardeinstellung. Aber ich kann auf jeden Fall ändern wie schnell dies passiert einfach durch Modifizieren Sie diesen Wert. 

Jetzt ist einer der interessantesten Dinge ist, dass diese Einstellungsfenster, GUI, ist eigentlich nur eine GUI-Version von vielen zugrunde liegenden Einstellungen die in JSON präsentiert werden. Also, wenn ich gehe, die beispielsweise unter der CS50 IDE-Menü oder das Cloud 9 Menü je nachdem, welche Version, die Sie gerade sehen, und gehen Sie zu einer dieser settings-- in diesem Fall das Projekt settings-- die Projekteinstellungen in diesem Fall gilt für alle Einstellungen für diesen einen Arbeitsbereich. Der Erwägung, dass Benutzereinstellungen gelten um alle Arbeitsbereiche dass Sie auf Ihrem Konto haben könnte. 

Also nur nebenbei hier, um ein extra klar sein, gibt es eine Trennung zwischen dem zwei, denn obwohl wir standardmäßig haben ein Arbeitsbereich, der ist der CS50 IDE, wenn Sie waren, um deine kleine klicken avatar Sie sich hier ein und gehen Sie zu Dashboard Sie, dass Sie tatsächlich finden werden schaffen zusätzliche Arbeitsbereiche auch. Hier können Sie sehen, dass ich haben ein IDE-50-Arbeitsbereich, aber auch für die Zwecke dieser Seminar, ein Arbeitsbereich genannte Arbeitsbereich, der hier ist. Wie auch immer, ich habe unterschiedliche Präferenzen. Jeder von diesen haben könnten separates Projekt Vorlieben, aber die Benutzereinstellungen sind unter all meine Arbeitsbereiche geteilt. Übrigens ist das auch sehr praktisch, wenn Sie wollen einen Arbeitsbereich mit erstellen verschiedene Anpassungsoptionen. Und es ist sehr praktisch, erstellen Sie einen neuen Arbeitsbereich. Und wählen Sie eine, die sein könnte sonstwie vorkonfiguriert vielleicht für PHP gesagt, oder Django spezifisch. Oder auch nur benutzerdefinierte. Das CS50-Arbeitsbereich Vorlage ist der, dass wir benutzen, die automatisch installiert Update 50 und alle Einstellungen dass wir dort, darunter alle Plug-Ins, die wir für den CS50 IDE haben. OK. Aber lassen Sie uns zurückkommen. Also noch einmal, es gibt Projekte Einstellungen und das sind diejenigen, dass wir hier sehen. Und feststellen, dass es gibt eine Reihe von Einstellungen, zu bevorzugen viele von ihnen entsprechen Platten, aber nicht alle von ihnen. Aber wir, dass Sie hier sehen können, in this-- oh Nein, habe ich es in den Benutzereinstellungen? Vielleicht habe ich es in den Benutzereinstellungen. Und dies, hier gehen wir. In den Benutzereinstellungen, können wir sehen, dass wir eine CS50 Schnitt haben, und dies geschrieben von diesen Cloud 9-Plug-Ins dass wir umgesetzt. Es ist die einfache man entsprechen mit dieser einfachen Plug-in, und die Statistiken einer davon entspricht dem GUI-basierte Version der Einstellungsfenster. Die Aktualisierungsrate, in diesem Dabei wird auf 20 Sekunden eingestellt. 

Das ist alles, hoffentlich, die Anfänge einiger Informationen dass wir tatsächlich in einem kleinen zu sehen wenig genauer, kurzzeitig. OK. Also lassen Sie uns sagen, wir wollen tatsächlich zur Sache. Wir verstehen, dass alle von dem Zeug das ist auf der Clientseite geschieht ist eigentlich auf den Browser, was getan bedeutet, dass alle Plug-Ins, die ich schreibe gehen zu geschrieben werden mit dem Browser im Auge. Und wenn ich wirklich tun möchte, Gegenstände auf der Arbeitsfläche, Ich werde vielleicht haben zu initiieren eine Art der Kommunikation zwischen dem Browser und der Arbeitsbereich sicher zu sein, dass diese tatsächlich erreicht. Aber lassen Sie uns sagen, dass jetzt Ich möchte nach unten um es zu bekommen und tatsächlich meine erste Plug-in erstellen. Nun, die Art und Weise, dass Sie der Lage wäre, das zu tun, ist eigentlich recht einfach. Es ist in der Cloud 9 SDK angegeben. Aber es ist zu nehmen Sie Ihre vorhandenen Arbeitsbereich Name, der ist die URL, die Sie an der Spitze haben, Ihre Bar, und fügen Sie die folgenden, um es. ? Sdk = 1 & Debub = 2. Nun, was das wird ermöglichen, ist dass das SDK = 1 tatsächlich setzen die SDK Modus, um wahr, die es ermöglichen ein paar zusätzliche Dinge. Und debug = 2 Fehlermeldungen ermöglichen zu sein, ein wenig ausführlicher. 

Und so, wenn Sie die JavaScript bringen Konsole in Ihrem Chrome-Entwickler-Registerkarte, werden Sie tatsächlich in der Lage zu sein, sehen viel mehr Informationen als üblich. So empfehle ich drehen beides auf zur gleichen Zeit, weil es wirklich ist nützlich, um all dies zusätzliche Information. Es ist wichtig zu beachten Sie jedoch, dass Einschalten Debug auf den Wert 2 bedeutet, dass es sehr verbose, und es tatsächlich wird etwas spürbar verlangsamen Ihre IDE, vor allem, wenn Lade oder wenn Sie dabei schwere Aufgaben. So einfach sollte man nicht vergessen. Es ist nützlich für die Entwicklung, aber Sie können nicht wollen, um es auf die ganze Zeit haben. 

Lassen Sie uns also wirklich tun. Aber in diesem Fall, habe ich eigentlich bereits einen Arbeitsbereich mit diesem Set. Also mal sehen, sdk = 1 & debug = 2. Mit ein paar Plug-Ins hoffentlich bereits installiert. Gut. Also jetzt, dass ich auf dem SDK debug aktiviert haben Modus bemerken, dass wir im Debug-Modus sind, so dass wir an den Entwickler-Tools, um zu sehen Fehler, die ich tun, außerhalb des Bildschirms. Wir können sehen, dass es ein Haufen Fehler hier. Jetzt ist es eigentlich ziemlich üblich, Cloud 9, ein paar Fehler haben, und ich würde keine Sorgen über sie, bis Sie etwas sehen, was könnte spezifisch an das Plug-in dass Sie geschehen, zu schaffen. 

So, hier, zum Beispiel, erhalten wir ein paar 404s-- nicht gefunden. Wir sehen, wir sind nicht in der Lage, einige laden Informationen aus dem zugrundeliegenden Beispiel selbst. Und es gibt eine Reihe von zusätzlichen Informationen, aber die meisten davon sind wir eigentlich los, um für jetzt zu ignorieren. Da es sich um recht gemeinsam für einen Arbeitsbereich um nur ein paar Störungen haben. OK. Ich werde dies aus bewegen die Art und Weise und wieder hierher kommen. Und nun die einfache Möglichkeit, das schöne Sache über mit diesem Entwickler Modus aktiviert ist, dass es mir erlaubt das einfache Erstellen eines neuen Plug-in. 

Während also bevor ich eigentlich nicht haben diese neue Plug-In-Option zur Verfügung, was wir sehen, wenn ich wieder nach meine Nicht-Entwickler-Modus hierher, es gibt kein neues Plug-in. Durch Aktivierung der SDK-Modus I haben ein neues Plug-In zur Verfügung und ich können sehr einfach ein. In diesem Fall gibt es ein paar von verschiedenen Optionen, einfach, ein leerer Plug-in, ein Full-Plug-in, Installer, Cloud 9 Bundle. Lassen Sie uns einfach ein wählen empty-Plug-In für jetzt so dass wir einen sehr sehen einfache Version von einem. 

Jetzt bemerken, dass entlang der linke Seite, das heißt es gibt jetzt etwas unter Favoriten, die listet ein paar Plug-Ins , die jetzt stehen mir zur Verfügung. Wenn ich zu erweitern, dass, werden wir der Lage, diese zu sehen. Nun möchte ich Sie zu bemerken, hier etwas, das ist, dass diese nicht tatsächlich enthaltenen im Arbeitsbereich-Verzeichnis auf meinem Ubuntu-Instanz zugrunde liegenden, aber es auf dem Festplattenlaufwerk enthalten ist. Und wo diese sich befindet, weil dies ist sehr nützlich zu wissen, besonders wenn Sie zu gehen werden nichts mit Git zu tun, wo diese befindet, ist in einem .C9 Ordner / plugins. Also, wenn ich dorthin zu gehen, können wir sehen, dass jetzt die Liste der Plug-Ins, die hier sind stimmt mit der Liste der Plug-Ins, die ich sah auf der linken Seite meiner Arbeitsbereich. 

Jetzt standardmäßig, und Das ist irgendwie seltsam, standardmäßig, wenn ich eine neue Plug-In in einem Arbeitsbereich, Sie dieses Plug-in, dass durch erstellt Standardmäßig hat einen Namen von einem Unterstrich. Im Allgemeinen, dass vielleicht einige Probleme verursachen. So sehr der nächste Schritt dass ich in der Regel durchführen ist nur, dass zu entfernen Insbesondere Plug-in und lassen Sie nur die einfache Plug-in, war es zunächst, plugin.simple. Und das ist das einzige, das es gibt. OK. 

Was bedeutet dies konkret aussehen? Nun, das ist wieder einen JavaScript-Paket das schließt einige Dateien, einschließlich einer plugin.js Datei, wobei der Hauptinhalt meine Plug-in befindet, a package.json-Datei, die eigentlich spezifiziert einige Metadaten über dieses Plug-in, wie, wer der Autor ist, alle zusätzlichen Informationen über sie, ein Beschreibung der Steckverbindung, und so weiter. Und standardmäßig, es erstellt ein leeres Readme-Datei, und eine leere Testdatei für Sie erstellen einige zusätzliche Dokumentation, und ein Testbaum, wenn Sie möchten, dass zu tun. 

Lassen Sie uns also nur einen Blick zuerst auf, sehr schnell, am package.json Datei. Es ist einfach genug, nur durchgehen und füllen in den Bereichen dieses dass Sie möchten, um in zu füllen, wie bieten Sie ihm einen Namen, eine Beschreibung, durchlaufen die Versionsnummer jeder so oft, bereitzustellen ein Autor für jeden Person, die trägt, fügen Sie sie zu den Künstlern, Abschnitt, und der Rest der Sie kann ziemlich einfach lassen wie es ist für den Moment. 

Es gibt eine Sache, die ist wichtig zu bemerken, dass im Rahmen der Plug-Ins Abschnitt, gibt es einen Schlüssel namens Plug-in. Und dies wird an den Namen der übereinstimm die JavaScript-Datei namens plugin.js. Das ist also, wie Cloud 9 kennt, wenn es liest diese package.json-Datei, die der JS-Dateien, um tatsächlich zu laden. Wenn ich schaffen zusätzliche js Dateien oder wollen , dass die JS-Datei von Plug-In umzubenennen, Ich habe auch, es zu ändern im package.json Datei. 

Alle Fragen aus dem Publikum? Nein. Dass einer Person, die Folgende zusammen mit mir so weit. 

OK. Also habe ich tatsächlich geschaffen haben ein Einige Plug-ins bereits, Ich denke, in diesem Arbeitsbereich. Lassen Sie uns also an einige von diesen zu entfernen, fügen Sie sdk = 1 & debug = 2, laden Sie diese Arbeitsbereich, und lassen Sie uns sehen, ob wir haben jetzt diese Plug-Ins. c9 / plugins. Auf geht's. Wir können jetzt in meinem c9 / plugins davon zu sehen einer, haben wir plugin.1 und plugin.2. So werden wir nur Schritt bis the-- nur die Menge der Schwierigkeit zu erhöhen in jedem dieser Plug-Ins. Aber hier, wenn ich in Steck erstellen Sie eine neue, Ich kann es zu Favoriten hinzufügen. Und ich werde einfach löschen solche aus das darunterliegende Dateisystem. 

Lassen Sie uns zu entfernen, dass. Nun, wenn ich mein erstes öffnen Plug-in, und offene plugin.js, wir hier sehen, kann die zugrunde liegende einfache Version eines Plug-in. Lassen Sie mich eigentlich zurück auf diese anderen Arbeitsbereich weil Sie zumindest, hier sehen können, was eine leere Plug-in tatsächlich aussieht. So unter der Haube, das sieht sehr ähnlich Technologie namens, Ich denke, es ist RequireJS. Beachten Sie, dass dies nicht wirklich aussehen, vielleicht, die gleichen wie eine andere JavaScript Dateien, die wir gesehen haben könnte. Stattdessen gibt es ein paar gerade Grundlinien, die es tatsächlich. 

All dieses Zeug ist zuerst vom IDE interpretiert aber es ist nicht wirklich laufen, bis festgelegt. Und ich werde Ihnen sagen, dass, wenn zu bedeutet eigentlich in nur einem Augenblick. Aber beachten Sie, dass hier gibt es eine main.consumes Zeile in Zeile 2, und dies listet alle Plug-ins dass dieses Plug-in abhängt. So standardmäßig, die wir vielleicht nicht zu haben, alle Abhängigkeiten von anderen Plug-Ins, aber wenn wir tatsächlich benötigen, um hängen von Merkmalen versorgt von anderen Plug-Ins in der IDE, wir brauchen, um diese Plug-Ins aufzulisten im main.consumes Linie. Und dann müssen wir verknüpfen Sie sie mit dem Code unten, was ich dir in nur zeigen einen Moment darüber, wie wir das tun. 

Main.provides verleiht ein Namen diesem Plug-in dass andere Plug-Ins konnten verwenden in ihrer verbraucht Linie. Also in diesem Fall, mein Plug-in ist einfach nur da standardmäßig festgelegt, und wir sollten das ändern zu sein für unsere eigene Plug-in, wie wir in nur gleich sehen werden. Jetzt ist hier in der Funktion Haupt, diese Funktion Haupt tatsächlich laufen und zu interpretieren, aber es nicht wirklich viel zu tun. Es wird immer alles eingerichtet, aber es nicht wirklich starten Sie die Plug-in, trotz allem, was der Name klingt. Dass tatsächlich durch passiert eine Folge von Methoden, werden in diesem Plug-in enthalten. 

Also, wenn ich nach unten scrollen, können wir sehen, dass wir einen Lebenszyklus, wo auf ein Ereignis namens Last, oder eine Veranstaltung namens Entladen, einige Ereignisse tatsächlich geschehen. Es ist wirklich in hier, wo wie die Plug-in- beginnt, dass diese Methoden aufgerufen werden. Also lassen Sie uns ein bisschen konkreter über diese und uns ein Beispiel. Also hier für plugin.1, was wir sind im Grunde tun ist um einen Menüpunkt zu erstellen genannt CS50 Seminar Dialog 1-- weil wir zwei haben them-- und wir werden um es in das Menü Fenster zu injizieren. Und wenn wir darauf klicken, sind wir gehen zu eröffnen einen Dialog, zeigt uns einige sehr grundlegende Informationen. 

In diesem Fall wird nur ein Hallo Welt. Das ist also eine sehr einfache Hallo Welt Dialog dass wir umsetzen können als Plug-in in der Cloud 9. Also mal sehen, wie diese tatsächlich aussieht. Wir werden durch sie Schritt, nur relativ schnell, so dass wir kann bei der nächsten Plug-in als gut aussehen. Beachten Sie, dass Sie hier sind wir verbrauchen eine Vielzahl von Plug-Ins. Wir verbrauchen eine Dialog Plug-in Befehle, Menüs und UI. Sieht aus wie ich eigentlich bin raub Dialog zweimal, so dass ich, dass zu entfernen. 

Und beachten Sie, dass die Art und Weise dass ich sie verbindenden Dies ist eine Art von Metadaten, die erzählt das Plug-in-System, welche Anforderungen tatsächlich erforderlich für dieses Plug-In zu laden. Es ist auch wichtig zu beachten, dass die Reihenfolge, dass Plug-Ins geladen werden, nicht gewährleistet. Aber was ist gewährleistet ist, dass, wenn ich Geben Sie einen beliebigen Plug-in als Voraussetzung, , dass Plug-in geladen werden vor diesem geladen wird. 

Das heißt also, dass, wenn Ihr Plug-in erfordert auf manche Funktionalitäten bereitgestellt durch etwas anderes in der IDE, sollten Sie sicher sein, dass Sie Ihren Plug-in verbraucht , dass Plug-in, so dass die Abhängigkeiten sind sicher, Ihren Plug-in erstellen, oder instanziieren Ihren Plug-in, nur nach, dass bestehende Rahmen existiert. Also hier habe ich erwähnt das Metadaten, um das Plug-In-Manager, , welche ich werde zu konsumieren. Und in der Hauptfunktion hier, Ich werde dann eine Verbindung meinen Code zu jenen importierten Plug-Ins. 

Also ich werde einfach erstellen Sie einige Variablen, mit den Namen jedes dieser so dass ich sehr schnell auf sie verweisen in meinem Code. Der Grund, warum ich den Import Dialog ist, weil ich möchte, dass meine Plug-in als einen Dialog Plug-in zu handeln. Und die Art und Weise, die ich bin in der Lage das zu tun, ist es natürlich verbinden meinen Code für den Dialog Plug-in durch Importieren und dann durch die Angabe von die Schaffung eines neuen Dialogs variable und verbinden dass importierte Plug-in. Und dann durch Definieren meiner Plug-in als neuer Dialog. 

So in der Initialisierung I möchte meine Plug-in zu definieren. Und diese Variable Plug-in-Sie werden sehen, liegt nur häufig verwendete im gesamten Cloud 9 Plug-Ins. Ich werde instanziieren eine neue Dialog mit einigen Attributen, geben Sie ihm einen bestimmten Namen, sagen, dass es für Benutzer möglich ist, um es zu schließen. Dass es dann ein wenig in x zeigen der oberen rechten Ecke, oder ein wenig-Button in der unten rechts. Ob ich kann Text aus wählen es, was der Titel dieses Dialogs wäre, und so weiter. Nun ist dies nur definiert den Dialog, aber es muss noch nicht zeigen. Ich habe eigentlich um eine Definition Aktion damit es dargestellt wird. 

Und wieder, ermutige ich Sie, einen Blick auf die Cloud 9 SDK, denn es gibt eine Vielzahl Dialoge und sie sind sehr gut dokumentiert. Sie können die verschiedenen Arten zu sehen dass es, und nutzen sie, in welcher Plug-in Sie im Sinn haben. Nun, es geht um eine sein Lastabschnitt und diese Belastung Funktion wie Sie sich erinnern ist von der Plug-in-Lebenszyklus verwendet eigentlich alles instanziieren und erhalten Sie alles bereit zu gehen. Nun, wenn dieses Plug-in geladen wird, weiß ich nicht wollen, dass es sofort zeigen einen Dialog, weil dieses Plug-In zu laden zusammen mit dem Rest des IDE. Und wenn ich diese IDE laden, ich will nicht der Dialog automatisch angezeigt. Ich möchte nur, um zu zeigen, wenn ich klicken Sie auf der Menüpunkt in meinem Menüpunkt Fenster dass ich, um es vorübergehend hinzuzufügen. 

Es gibt also zwei verschiedene Schritte hier, die geschehen müssen. Ich muss ein erstellen Befehl und die Befehls wird für die tatsächlich verantwortlich sein , die den Dialog über die Cloud 9-IDE. Und dann habe ich eine Verbindung herstellen, I haben ein neues Fenster-Menü erstellen Artikel, läuft, dass diesen Befehl. So dass, wenn ich an diesem Fenster klicken Menüpunkt, dh Befehl dann laufen und damit meine Dialog wird dann angezeigt. Und so ist dies eigentlich ein ziemlich schöne Art, darüber nachzudenken. 

Denn erstens kann ich einen Befehl zu erstellen dessen Name CS50 Seminar Dialog 1, dass bietet einige allgemeinen Kontext für sie. Und die wichtige Bit ist hier, beachten Sie die EXEC-Attribut, das listet eine Funktion, die aufgerufen wird in meiner Plug-in, wenn dieser Befehl ausgeführt wird. Also dieser Befehl ist so etwas wie a-- es ist nur eine beliebige Cloud 9 Befehl, der verfügbar ist zu jeder Cloud 9 Plug-in. Aber die eigentliche Funktion, dass es gehen zu nennen, wenn dieser Befehl ausgeführt wird ist die Show Dialogfunktion in meinem plugin.js Datei. 

Und wir tatsächlich sehen können Diese Plug-ins und die Liste von Befehlen, die in verfügbar sind zu uns Einstellungen, blättern Sie ganz down-- mal sehen, eigentlich machen wir das jetzt? Plug-in Manager, Nein, ich glaube, es ist ich-- auf jeden Fall hier irgendwo. Nun, es gibt eine Liste von Befehlen irgendwo, aber ich muss, Ich habe vergessen, wo es ist. So OK, wir werden weitermachen. Gut. So haben wir eine Liste der Befehle , die uns zur Verfügung stehen, und jene Befehle dies sind nur willkürliche Cloud 9 Befehle, die spezifischen Code ausführen. So einfach sollte man nicht vergessen, dass wir gehen, um die Show laufen Dialog vorübergehend funktionieren. Nun, wenn ich wirklich wollen, um ein Menü hinzufügen Artikel kann dieses Objekt durch Pfad hinzufügen, und nur genau, wo ich möchten es zu sein, Window / CS50 Seminar Dialog 1. Und an diesem Punkt möchte ich um ein neues Element zu erstellen, dass wird einen Befehl ausführen, CS50 Seminar Dialog 1. Beachten Sie, dass einmal, das ist die Wolke 9 Befehls Ich habe gerade oben erstellt. 

Jetzt möchte ich auch erstellen ein wenig Teiler, und so kann ich das gleiche zu tun in der nachfolgenden Zeile. Nun werden Sie vielleicht feststellen, dass Teil der diesen Menüpunkt definieren, Es gibt eine Reihe zugeordnet welcher tatsächlich sagt, wo genau, Ich möchte, dass Menüpunkt zu sein in der Liste der Menüs befindet. Aber Sie vielleicht feststellen, dass ich nicht wirklich sehen keine Zahlen mit Diese Menüs standardmäßig. Also gibt es etwas versteckt, was was wir tun können, eine kleine Änderung an unsere URL. Also zusätzlich SDK = 1 & debug = 2, Ich werde Menü auf 1-- und hoffentlich ist es im Menü nicht die Menüs. Oh, es ist Menüs = 1. Warten Sie mal. 

Und was wir sehen, dass beim Nachladen IDE ist, dass ich noch immer im Debug-Modus, aber jetzt gibt es Zahlen mit allen Menüs zugeordnet ist. Und das Ihnen sagt, genau das, was die Anzahl ist, wenn Sie versuchen, zu injizieren sind etwas überall in diesem Menüsystem. So in dem Menü Fenster, kann ich sehen, dass Artikel 45 zusammenarbeiten, und Artikel 38, bevor es Installateur. Also, wenn ich will, um zu injizieren ein Element zwischen den beiden, Ich möchte nur eine Nummer auszuwählen zwischen diesen beiden Positionen. Also wählte ich 41 und mein Seminar eingeführt Dialog 1 Menüpunkt an dieser Stelle. 

Und deshalb ist diese Zahl das scheint hier ist die Nummer 41. Das ist der Ort, dass Menüpunkt in der Cloud 9-Menü. Jetzt ähnlich, ich wollte einen Teiler zu schaffen und fügen Sie es so, dass es gibt ein nettes Trennung zwischen jedem dieser Menü Artikel. So fügte ich, dass an der Stelle 43. So weit, so gut, ich hoffe? So, jetzt wollen wir eigentlich betrachten der spezifische Code in Dialog Show Das ist eigentlich verantwortlich für dieses Dialogfenster zu öffnen. 

Scrollen nach unten, ich sehe, dass ich will um diese Funktion zu zeigen Dialog haben, und es ist extrem einfach. Ich werde die Show laufen Methode für das Plug-in-Variablen. Und denken Sie daran, dass wir diese definiert Plug-in-variable oben als Dialog. So bar Plug-in, in diesem Fall, das ist Objekt, das wir intern definiert haben. Und es wird ein neuer Dialog sein innerhalb dieses Plug-in enthalten. Und so haben wir eigentlich diese referenziert Plug-in-variable vielerorts in einem typischen Cloud 9 Entwicklungsumgebung. 

Wir werden es hier zu sehen. Beachten Sie, dass, als wir nach unten scrollen, gibt es zusätzliche Lebenszyklen. So bemerken, dass diese respond auf Ereignisse, die ausgelöst werden von diesem Objekt, diesen Dialog Objekt. Standardmäßig gibt es Be- und Entladen, die sind für alle Cloud 9 Plug-Ins. Wobei im Falle von dieser Dialog, gibt es Ein weiteres Ereignis, kann Feuer als auch genannt Zu zeichnen, das ausgelöst wird, wenn das ist im Begriff, auf dem Bildschirm gezogen werden, in der ersten Instanz des Dialogs zeigt. 

Also, wenn es tatsächlich gehen zu zeigen, es wird gehen uns zur Verfügung stellen einige HTML. Und mit nur Standard HTML-Praktiken können wir injizieren einige sehr einfache Informationen, unsere Hallo Welt, in diesem Dialog. Wenn wir dann nach oben, können wir dann sehen die Prozession der Dinge dass es auftritt. Zuerst werden wir eine Cloud 9 Befehl erstellt , dass, wenn sie von Cloud 9 ausgeführt, wird diese Funktion ausgelöst. Es geht um diese Funktion zu starten genannt Show Dialog, dass ich in meinem Code geschrieben. 

I einen Menüeintrag erstellt und dafür, dass derselbe Befehl angebracht dass, wenn das Einzelteil in geklickt das Menü, das wird dann Befehl ausgeführt werden soll und diese Funktion wird dann ausgeführt. Und innerhalb der Funktion Ich bin gerade dabei, rufen the-- Ich bin nur gehen, um die Show ausführen Verfahren dieses Plug-in, das ist mit dem ersten Anruf gehen das Draw-Verfahren, und gehen diese Methode unten, das Feuer nach unten ziehen Event-Handler, in unserer Lebenszyklus. Und dann wird es tatsächlich zeigen den Dialog. 

Es gibt auch ein hide Methode, so dass wenn ich die Gelegenheit, um sich zu verstecken meinem Dialog, kann ich das Gleiche zu tun. Also das ist so ziemlich alles um all dies an die Arbeit. Beachten Sie, dass es, wenn wir nach unten scrollen weiter gibt es ein Einfrieren der öffentlichen API. Diese im Grunde nur sagt, dass ich diese Methoden, um effektiv zu wollen ist öffentlich, aber nicht überschreibbar außerhalb der Rahmen dieses Plug-in. Und darunter, am unteren Ende, ist vielleicht das letzte, was, dass wir wirklich brauchen, um zu zahlen viel Aufmerksamkeit auf sich hier, die ist, dass wir gehen, um zu registrieren, unseren Plug-in mit dem Namen C9 Seminar 1, und das Objekt-Plug-in. 

Die, wie Sie sich erinnern werden, ist , dass Plug-in Plug-in Objekt, das wir seit der Definition über die Gesamtheit der Quelle Code. Und C9 Seminar 1 ist die Zeichenfolge, die wir versprochen an der Spitze zu bieten dieser Definition. OK. Lassen Sie uns also Rampe it up ein wenig und sehen, ob wir etwas tun, ein wenig interessanter. Nun ist dies nur so groß. Ich meine, das ist, es ist eigentlich ziemlich cool, dass in so wenigen Zeilen Code, können wir die vorhandenen IDE ändern und fügen Sie eine vorhandene Menüpunkt oder fügen Sie einen neuen Menüpunkt, fügen Sie ein Befehl ein, und zeigen einen Dialog, und nur ein Haufen von Funktionalität, die existiert. Es ist wirklich ziemlich gut. 

Aber es bedeutet nicht viel zu tun, da es nicht mit dem zugrunde liegenden Ubuntu kommunizieren Beispiel. Also lassen Sie uns sagen, dass ich wirklich wollen, um herauszufinden, einige Informationen über den Ubuntu Instanz zugrunde liegenden, wie die Statistiken Plug-in funktioniert. Werfen wir also einen Blick auf ein etwas mehr Informationen darüber, wie die Statistik-Plug-in funktioniert. Und in der Tat ist es sehr ähnlich wie diese. Sie erinnern sich vielleicht, dass gibt es einen Dialog. Sie erinnern sich vielleicht, dass es einige Informationen, die ist nur entlang der Menüleiste entlang gezeigt der obere, die hoffentlich Sie jetzt sind bekommen einen Eindruck davon, wie wir das umgesetzt, nur durch Einfügen Menüpunkte zu bestimmten Punkte und durch Instantiieren eines Dialogs und Anzeigen, dass der Dialog. 

Aber wir noch nicht gezeigt haben, Sie, wie wir es zu verbinden auf einen Befehl in die zugrunde liegenden Ubuntu-Instanz. Werfen wir also einen Blick dann bei plugin.2, was tut genau dieses Ding. Wir werden zu öffnen plugin.js, Das ist der Code für diese. Aber unter dem Menü Fenster wenn ich auf Dialog 2 klicken, können wir sehen, dass er sagt, dass dies statt, hallo CS50, die sieht nicht alles, was verlockend, nicht wahr? Außer, beobachten diese. Lassen Sie mich hier etwas ändern, nach unten. 

Ich werde zu gehen meine Arbeitsbereich und Veränderung Seminar um etwas anderes, wie Hallo, Dan sagen. Ich werde es zu schließen und zu speichern. Und jetzt werde ich erneut ausgeführt meinem Dialog Menüpunkt. Und beachten Sie, dass es jetzt geändert, was es sagt. Hallo, Dan. Ich scheine etwas nach unten getan haben hier in der zugrunde liegenden Ubuntu-Instanz ohne jede manipuliert Code, wieder allein laufen auf der Client-Seite. Es gibt also offensichtlich eine Art von Kommunikation, die hier passiert. 

Nun, das ist, wo viele der Macht der Cloud 9 SDK kommt, ist, dass in diesem plugin.2, wir tatsächlich dazu führen kann ein Aufruf an die passieren zugrunde liegenden Beispiel und führen Sie eine beliebige Kommando. Also in diesem Fall, ich habe tatsächlich erstellt ein sehr einfaches Bash-Skript in meinem Arbeitsbereich genannt Seminar. Also lassen Sie mich zu öffnen, dass bis. Und wir können sehen, dass es so aussieht. Es ist nur ein sehr einfaches Bash- script, deren einziger Zweck im Leben sein wird, um echo aus diesem Text, Hallo, Dan. Oder bevor sie, sagte, es Hallo, CS50. Und das ist alles, es wird zu tun. 

Denn dies ist nun ein Befehl, dass ich laufen kann. Ich kann tatsächlich führen Sie es hier unten. Wir können sehen, dass es tatsächlich nur ein Befehl, den ich laufen natürlich. Ich kann meine Plug-in bitten, dies auszuführen, Befehl von der zugrundeliegenden Arbeits und analysieren die Informationen das wurde von ihm zurückkehrte, und etwas zu tun mit ihm, und ändern meine Plug-in und das Verhalten, das ich habe in meiner Plug-in als Ergebnis. OK. Also mal sehen, wie dies geschieht. Wir sahen diese sehr einfach Seminar Batch-Skript, das ich [Unverständlich], dass es tatsächlich auszuführen. 

Und jetzt sehen Sie die Änderungen lassen , die erforderlich sind, um diese miteinander zu verbinden sind, mit dem Dialogfenster, und führen Sie es. Also hier werden wir recht tun viel die gleiche Sache wie wir schon gesehen haben. Aber beachten Sie, dass unter den Dinge, die ich now-- verbraucht zusätzlich zu dem Dialog, der wieder ich zufällig zweimal getan haben, die nicht zusätzlich necessary-- wird auf den Dialog und die Befehle und die Menüs Plug-Ins, die waren in der ersten für mich notwendig, um einen neuen Befehl definieren und injizieren ein Element in den Menüs, Ich habe auch diesen proc-Plug-in. 

Und das proc Plug-in erlaubt uns, Prozesse zu manipulieren auf dem darunterliegenden Beispiel. Ich habe es angeschlossen, nachdem ich sagte, dass meine Plug-In erfordert. Ich habe dann verbunden ist, um Code, wie wir sahen in der Hauptfunktion. Auch hier bin ich zu gehen initialisieren meinem Dialog. Und wenn wir jetzt nach unten zu bewegen, haben wir kann sehen, wie ist das anders. Die Last ist die gleiche Funktion, so dass ist es nur geht, um einen Befehl zu erstellen und erstellen Sie einen Menüpunkt und verbinden dass Menüpunkt, um diesen Befehl. Aber wenn wir jetzt blättern unten, um den Dialog zu zeigen, wir beginnen können, um zu sehen, wo Die Unterschiede ergeben. 

Wir haben Funktion Show Dialog, der ist gerade dabei, den Dialog zu zeigen. Aber wenn ich diesen Dialog zu zeigen, und wenn die Show-Methode aufgerufen wird, Es feuert die Zeichenfunktion. Und ich werde Sie dann einige Inhalte innerhalb davon. Also ich werde einfach erstellen Sie einen div, auszustatten, einige grundlegende Text, Hallo, Welt. Aber beachten Sie, dass ich hier bin werde, um es eine ID zu befestigen. Und schon am nächsten Linie werde ich , dass die ID zu finden mit Hilfe von JavaScript, und speichern Sie das Objekt in einen anderen Variablen dass ich werde einfach Inhalte aufrufen. 

So, jetzt, wenn ich Inhalte, alles, was ich tun müssen, Nur Innen HTML dieses Objekts zu ändern. Und der Dialog HTML wird dann auch modifiziert werden. So, wenn dieses Plug-in ist dann gezeigt, was passieren kann, und dies ist ein neues Event das ist neu in diesem Plug-in, aber passiert in jedem Plug-in mit der Dialog, wenn dies nun gezeigt, Ich gehe, um einen Anruf Funktion namens Fetch Info. Und diese Funktion das Fleisch von hier. Ich werde diesen proc-Plug-in verwenden, wir zuvor beschrieben, die durch die Art und Weise, ist wirklich nur ein Node.js Bibliothek dass Cloud 9 ist mit hier. 

Kann man so eigentlich sehen, wie dieses funktioniert, wenn Sie in der go Node.js Dokumentation und suchen Sie die exec-Datei Verfahren für Prozesse gibt. Ich werde dieses spezielle laufen Befehl, zu Hause Ubuntu-Arbeitsbereich Seminar, das das gleiche ist, dass gleichen Befehl, den ich vor erstellt. Geben Sie es zu einem Strom Arbeitsverzeichnis, nur um extrem sicher in Bezug auf das sein, Rahmen, wo dieser läuft. Und einmal, dass ist ausgefüllt und zurückgeschickt, Ich werde dies ausführen Funktion namens Parse-Ausgang. OK. Also diese dann wird die Ausführung ein Befehl auf dem lokalen oder vielmehr dem fernen Ubuntu-Instanz. Wenn ich wieder einige Informationen, ich bin dann gehen, um eine separate Funktion aufrufen genannte Parsing-Ausgabe, dass hat diese Unterschrift hier, äh, stdout, stderr, und führen eine Berechnung zu diesem Thema. Also, wenn ich eine Fehlermeldung erhalten von einer Art überhaupt, Ich werde wirklich zu überprüfen, um zu sehen, wenn Fehler tatsächlich einige Daten. Und wenn ja, dann werde ich die innere ändern HTML dieses Inhaltsobjekt, das Sie ist, wir erinnern uns zum Dialog verbunden am instantiattion davon Dialog, oder bei der ersten Zeichnung dieses Dialogs. Ich werde einfach sagen, dass einige Fehler passiert ist. 

Nun, das ist zu einfach. Der Fehlerwert wird in der Regel enthalten etwas, das nützlich war, vielleicht eine Fehlernummer und eine Fehler vom Skript selbst. Oder, wenn das Skript schrieb, etwas, Standardfehler, dass überhaupt Daten bevölkert in diesem Parameter als auch. Und ich könnte etwas sein, mehr darauf achten, was Fehler Eigentlich bin ich, die Menschen. Aber dieses einfache Beispiel ist gut genug für jetzt zumindest zu sehen, wie das alles funktioniert. Andernfalls, wenn es kein Fehler, dann bin ich einfach nur gehen, um die rohen liefern Ausgang dieses Funktions in die innere HTML dieser Inhalte Element, und dann meine Plug-in aktualisieren und zeigen Sie es hier. Und das ist so ziemlich alles, was notwendig, um dies zu laufen. Und so lassen Sie uns über dann denken wie diese tätig ist, insgesamt. Als ich das erste Plug-in geladen wird dieses, ebenso wie die erste Steckverbindung, Ich werde einen Befehl, ist hinzuzufügen, zur Verfügung, alles, zu jeder Plug-in in Cloud 9, genannt CS50 Seminar Dialog 2, dessen Verantwortung wird es sein, diese Show zu laufen Dialog, der Sie sich erinnern wird, tatsächlich zeigen den Dialog dass ich unter angefordert. 

Dann werde ich hinzufügen, dass Befehl in ein Fenstermenü so dass ich Zugriff auf das. Und wenn dieser Dialog aufgefordert wird, angezeigt werden können, Ich werde ein paar Informationen von fetch die zugrunde liegende Ubuntu-Instanz unter Verwendung der exec Befehl file. Entschuldigen Sie. Sobald dies zurück und ich erhalte einige Informationen dann auf der Client-Seite wieder, ich in der Lage zu analysieren die Ausgabe dieses Befehls und aktualisieren Sie die Innen HTML-Elemente dass wir früher verbunden war. 

Und damit, so haben wir Diese voll funktionsfähige Plug-in dass mir erlaubt, Informationen zu holen von dieser beliebigen Script- dass wir am erstellt unsere zugrunde liegenden Instanz. Aber noch einmal, es ist wirklich wichtig und wirklich Schlüssel zu trennen, wo jedes diese Dinge passiert, dass wir alle von diesem Client-Seite Code, der im Browser ausgeführt wird, und für die noch kein Zugang zu dem zugrunde liegenden Dateisystem bis wir tatsächlich laufen einige von ihnen Befehle, die von der Wolke vorgesehen sind 9 SDK wie proc, und einige andere, die dass es uns ermöglichen, einige Daten zu lesen, oder lesen Sie einige Dateien, wenn wir brauchen, um etwas Derartiges zu tun. 

Nun ist dies eine etwas einfaches Beispiel. Es gibt andere Dinge, die wir wäre vielleicht wollen auch. Zum Beispiel, vielleicht haben wir tatsächlich wollen einige Informationen zu speichern den Präferenzen. Oder vielleicht wollen wir fügen Sie eine neue Einstellungsfenster oder etwas in diese Richtung. Dann ist das etwas, was Sie können Sie einen Blick auf der Cloud 9 SDK nehmen um weitere Informationen zu erhalten. Aber das ist wirklich genug, um loszulegen. Also, nur um etwas konkreter zu werden über die Art und Weise, dass einige dieser Dinge, Funktion, ich wollte nur zeigen, ein weiteres Beispiel, das nur einige ist der Code von der Statistik 50 Plug-in. 

Und dieser Code ist im Grunde auf der Grundlage dieser Beispiele dass Sie tatsächlich gesehen haben, hat aber einige weitere Sicherheitsvorkehrungen und hat etwas mehr Aufwand, um um einige der zusätzlichen Dinge zu erreichen dass wir erreichen wollen. Zum Beispiel, wenn ich sein will Deshalb sind einige Einstellungen zu speichern, dann muss ich Zugriff haben Um die Einstellungen zu Plug-in, und jedesmal, wenn ich will einige Einstellungen zu lesen, I kann beispielsweise an verschiedene befestigen Veranstaltungen in den Einstellungen-Plug-in. Also jedes Mal die Einstellungen ist rot, beispielsweise in meinem eigenen Plug-in, wenn ich werde einige lesen Einstellungen aus der gespeicherten Speicher Präferenzen des Benutzers, dann kann ich Standardeinstellungen für einen bestimmten Ort, für spezifische Präferenz, dadurch gekennzeichnet, dass JSON Style-Optionen-Datei, die wir zuvor gespeichert haben, dass wir früher gesehen haben. 

Und wenn ich werde schreiben einige Einstellungen, um es, dann habe ich can-- oder sobald wir erkennen, dass die Einstellungen wurden geschrieben zu-- weil beispielsweise solche, Einstellungen durch den Benutzer modifiziert wurde entweder direkt in ihre Einstellungen Datei oder das Einstellungsfenster hat sich die Einstellungen verändert Datei direkt, dann Ich kann tatsächlich ein Teil des Codes zu aktualisieren oder aktualisieren Sie das Verhalten meines Plug-in auf der Grundlage dieser Änderungen, haben trat auf der Einstellungsdatei sowie. Aber wirklich, der Rest ist ziemlich sehr diese, die Sie bereits gesehen haben. 

Wir fügen einige, vielleicht etwas, das neu ist. Also haben wir eine Präferenz-Datei hinzufügen, oder vielmehr eine Systemeinstellung, auf den Präferenzen Fenster, was wiederum finden Sie weitere Informationen in der Cloud 9 SDK las mir. Aber alles andere ist so ziemlich, ziemlich ähnlich dem, was wir zuvor gesehen haben, gerade mit einigen zusätzlichen Fehlerprüfung und einige zusätzliche Schutzmaßnahmen und einige zusätzliche Funktionen alle verschiedene Feature Dinge, die wir gesehen haben. Wenn Sie nicht wirklich es noch nicht gesehen, könnte man werden sich fragen, was die zugrunde liegende Befehl ist in der Statistik 50 Fenster. Es ist eigentlich Funktion. Nun, ist-- es oh, verdammt. Eine Sekunde. Warten Sie mal. OK. Lassen Sie mich diese nach oben, so können wir tatsächlich sehen, was passiert, wenn ich schreibe Stats 50. Beachten Sie, dass in diesem Fall das Befehl, den ich aus setzen ist wirklich wieder, nur das Skript, das ist geht die Ausgabe einer Reihe von Informationen im JSON-Format. Und der Grund dafür, dass wir es zu tun auf diese Weise ist, dass, weil wir in Betrieb sind, weil wir geschrieben haben, die Client-Seite Code in JavaScript, wir können sehr leicht gerade analysieren JavaScript-Objekte, und wirklich in der Lage zu manipulieren diese Objekte genau wie wir würden andere JavaScript-Objekt. 

Und so ist dies ein sehr bequemer Art der Bereitstellung einige Informationen von der zugrunde liegenden Ubuntu Beispiel wie die Versionsnummer der Host zu nennen, ob ein Server empfangsbereit ist, was der Server ist, so weiter und so fort, und analysieren, dass sehr einfach und sehr schnell in der Plug-in, dann gehen um uns zu zeigen, all diese Informationen. Also noch einmal, die wichtige Einblicke hier im Auge zu behalten ist dies der Abstand zwischen das zugrundeliegende Beispiel und auch, wo der Code geladen. Dass, wenn Ich habe einen Klienten, seinen ersten Belastung. Nur diese statischen JavaScript-Datei aus irgendwo, vielleicht CDN in irgendeiner Form. Wir haben nicht wirklich zu kümmern zu viel über diesen ersten Schritt. 

Wir wissen nur, dass es auf der Clientseite ausgeführt wird und das ist, wenn ich mit gehen kommunizieren mit diesem docker Instanz. Dass wir gehen, dies zu tun durch die Cloud 9 SDK. Wir haben nicht wirklich die Fähigkeit haben, mit Hilfe von JavaScript oder Node.js, direkt an sie zu schreiben. Wir jene vorhandenen SDK verwenden nur APIs, um diese Handlung für uns tun. Und wieder, eine der wirklich wichtigen Dinge ist, dass, wenn ich diese erstellt, wenn ich dieses Plug-in erstellt, und wie ich arbeite daran, ein der wichtigsten Dinge zu tun ist es, rufen Sie die JavaScript-Konsole. 

Denn seit das ist alles die auf der JavaScript, Auf der Client-Seite, wenn ich a console.log method-- so einfach um ein Beispiel hier zeigen. Lassen Sie uns versuchen, diese einfache Modifikation Plug-in, um auch einige Daten zu protokollieren. Und wir werden die Standardausgabe hinzuzufügen. Lassen Sie uns so ändern, dass zu Recht hier zu sein. Nun, wenn ich ausführen console.log, bedenken Sie, dass seit diesem ausgeführt wird Auf der Client-Seite, Ich werde das in meinem eigenen zu sehen JavaScript-Konsole, die So habe ich dann in der Lage, versuchen, zu beheben und zu debuggen einige der Probleme, die ich habe. 

Beachten Sie, dass, weil Ich bin in der SDK-Modus Ich bin dann in der Lage zu manipulieren Plug-Ins für diese Instanz. Also auch wenn es auf dieser Instanz gespeichert, dies ist das ein Beispiel für die vorangegangene Regel verletzt werden, in dem die Cloud 9 SDK Plug-Ins von der tatsächlich zu ziehen zugrunde liegenden Instanz und führen Sie sie. So dass auf diese Weise, ich bin dann in der Lage, zu manipulieren und zu konstruieren, Einige Plug-Ins Sie hier. Aber um für mich zu sehen Bei Neuigkeiten zu diesem Plug-in, weil es auf der Client-Seite, Ich brauche, um diese Plug-in sparen und laden Sie dann den gesamten Arbeitsbereich, so dass das neue Plug-in ist dann auf meinen Client heruntergeladen, auf mein Web-Browser, und dann verwendet wird. 

So, jetzt, wenn ich an diesem Seminar klicken Dialog 2, noch sehen wir dies. Aber jetzt hoffentlich in meinem JavaScript Dialog, sollten wir sehen, my-- warten, warten Sie mal. Ich hätte den Dialog frischen öffnen. Wir sollten meiner empfangenen Daten finden Sie hier. Empfangenen Daten, Hallo, Dan, die Sie sich erinnern, ist, war ein console.log Betrieb, dass die in der Steck angefordert. Also diese Beschreibung dann dass ich schon erwähnt, dieser Dialog, oder diese Diagramm vielmehr, dass ich erwähnt ist, was passiert. Aber es ist eine wichtige Ausnahme nur für die Entwicklung, nämlich dass die Steck selbst könnte in der Tat auf der Hafenarbeiter-Instanz gespeichert werden vorübergehend, da vermutlich Cloud 9 will uns nicht in der Lage zu sein, Objekte auf ihre CDN manipulieren. 

Und die Cloud 9-Clients, bei Belastung, werden diese Plug-Ins, dass zu finden. C9-Plug-in-Ordner, und laden Sie diese. Aber das sind noch geschieht nur auf der Client-Seite. Also das ist nur die eine Ausnahme, die nur auftritt, für die Entwicklung von Cloud 9 Plug-Ins. Aber der Rest der Zeit-- und der Grund, dass wir wollen wirklich hämmern diese home-- ist, weil die meiste Zeit ist gehen, um von der CDN ausgeführt werden, und gerade dabei, ausgeführt werden, rein aus der Client-Seite. 

Normalerweise werden keine sein Interaktion mit der Steckverbindung, oder es muss nicht einmal zu einem sein Grund dafür, dass die Plug-Ins selbst tatsächlich auf die gespeicherte docker Instanz zugrunde liegenden, außer im Fall von Dieses SDK Entwicklung. Also noch einmal, ändert dies nur leicht aufgrund der Tatsache dass wir laufen SDK-Modus. Es wird dann zu laden diejenigen, Plug-Ins von der Entwicklung, und der einzige Zweck ist hier so, dass Ich kann Cloud 9 verwenden, um Entwicklung zu tun für Cloud 9 Plugins. Aber auch so, dies nicht zu ändern wieder, wie jeder das funktioniert. Es ist immer noch laufen vollständig auf der Client-Seite. 

Es bedeutet nur, dass, wann immer ich will erstellen Cloud 9-Plug-Ins in Cloud 9, Ich erstelle diese Plug-Ins, steckte sie in meine. C9 Ordner / plugins in meinem Haus Verzeichnis, stellen Sie sicher, ich bin in SDK-Modus, laden Sie die Seite jedes Mal, wenn ich tatsächlich Änderungen an diesem Plug-in, und sehen, was passiert, in meine JavaScript-Konsole. Just my JavaScript verwalten trösten, um sicherzustellen, dass jeder Fehlerbehebung Informationen, die ich setzen, um zu trösten, oder irgendetwas anderes, die auftreten können wegen der Fehler, die ich geschrieben habe, in meinem Code oder dergleichen, scheint es. 

Und damit ist es wirklich genug, um zu beginnen, ich glaube, mit den Cloud 9 Plug-Ins. Vor allem, einen Blick auf den SDK Dokumentation, die Cloud 9 bietet. Es ist eine großartige Möglichkeit, um gestartet wird und sehr einfach erstellen Sie einige Plug-Ins für Cloud 9. Und damit möchte ich danken, Ihnen allen sehr für den Beitritt mich. Ich hoffe, Sie haben Spaß Schreiben von Plug-Ins für Cloud 9. Vielleicht ist die Verbesserung der Plug-ins dass wir jetzt, oder vielleicht sogar Hinzufügen einige Funktionen des eigenen. Wir freuen uns auf Ihren Besuch was es ist, die Sie erstellen. Bis dahin, bye.