Übung: Ausführen und Debuggen von Code

Abgeschlossen

Nach dem Herstellen der Verbindung zu Ihrem SSH-Server können Sie mit dem Programmieren beginnen! Sie müssen eine grundlegende Node-Anwendung erstellen, da Sie mit der Entwicklung einer Express-App für Ihre Agentur beauftragt sind.

In dieser Übung erstellen Sie ein grundlegendes Node-Projekt und führen den Projektcode aus und debuggen ihn, während Sie über SSH verbunden sind.

Erstellen und Ausführen einer Node.js Anwendung

Um Ihre Node.js Anwendung zu erstellen und auszuführen, müssen Sie eine Reihe von Befehlen im Terminal ausführen.

1. Öffnen Sie ein neues Terminal, indem Sie in der Taskleiste " Terminal>Neu" auswählen. Führen Sie über das Terminal die folgenden Befehle aus, um die Pakete in Ihrer Linux-VM zu aktualisieren und Node.jszu installieren:

   sudo apt-get update
   

   curl -sL https://deb.nodesource.com/setup_lts.x | sudo -E bash -
   

   sudo apt-get install nodejs -y
   

2. Führen Sie den folgenden Befehl aus, um den Express-Generator zu installieren:

   sudo npm install -g express-generator
   

3. Führen Sie den folgenden Befehl aus, um eine neue Express-Anwendung mit dem Namen „myExpressApp“ zu erstellen:

   express myExpressApp --view pug
   

4. Öffnen Sie die Anwendungsdateien, indem Sie in der Explorer-Ansicht " Ordner öffnen " auswählen. Wählen Sie "myExpressApp" in der Dropdownliste aus, um den Ordner in Ihrem Visual Studio Code-Fenster zu öffnen.

   

5. Wählen Sie in der nächsten Eingabeaufforderung "OK" aus, wodurch der Ordner geöffnet wird, der Ihre Anwendungsdateien enthält. Wenn Sie dazu aufgefordert werden, vertrauen Sie dem Arbeitsbereich.

   

6. Öffnen Sie das Terminal erneut, und führen Sie den folgenden Befehl aus, um alle Abhängigkeiten der Anwendung zu installieren:

   npm install
   

7. Führen Sie den folgenden Befehl aus, um die Anwendung auszuführen:

   npm start
   

   Die Anwendung wird auf dem virtuellen Computer http://localhost:3000 ausgeführt. Im nächsten Schritt erfahren Sie, wie Sie diese Anwendung auf Ihrem lokalen Computer durchsuchen können.

Durchsuchen der Anwendung

Nachdem die Anwendung ausgeführt wird, können Sie die Portweiterleitung verwenden, um die Webanwendung auf Ihrem lokalen Computer zu durchsuchen.

1. Wenn die App weiterhin ausgeführt wird, führen Sie den Befehl Ports: Focus on Ports View in der Befehlspalette aus.

   

2. Wählen Sie die Schaltfläche "Port weiterleiten " aus.

   

3. Geben Sie Port 3000 an, und drücken Sie dann die EINGABETASTE.

   

4. Der Server leitet nun den Datenverkehr auf Port 3000 an Ihren lokalen Rechner weiter; Sie können jetzt zu http://localhost:3000 gehen, um die laufende Web-App zu sehen.

5. Beenden Sie die App im Terminal, indem Sie STRG + C drücken.

Bearbeiten und Debuggen der Anwendung

Sie können die integrierten Features von Visual Studio Code verwenden, um die Anwendung zu bearbeiten und zu debuggen, die auf dem Remotecomputer ausgeführt wird.

1. Wählen Sie den Datei-Explorer im linken Menü in Visual Studio Code aus, und öffnen Sie die app.js Datei.

2. Legen Sie einen Haltepunkt in Zeile 10 der Datei fest, indem Sie links neben der Zeilennummer auf den Bundsteg klicken. Es wird ein roter Kreis angezeigt.

   

3. Wählen Sie in der Ansicht "Ausführen und Debuggen" die Option "Ausführen" und "Debuggen" aus. Wenn Sie dazu aufgefordert werden, wählen Sie Node.jsaus.

   

4. Wenn die App ausgeführt wird, erreichen Sie den Haltepunkt. In der Debugansicht in der Seitenleiste können Sie Variablen überprüfen, Überwachungen erstellen und durch den Aufrufstapel navigieren. Sie können Ihre Debugsitzung steuern, indem Sie zum Beispiel Zeile für Zeile vorgehen, mithilfe der Debug-Aktionsleiste oben.

   

5. Sie können die Datei auch genauso bearbeiten, als ob sich der Code auf Ihrem lokalen Rechner befände. Beginnen Sie mit der Eingabe app., die IntelliSense auslöst.

   

Congratulations! Sie haben erfolgreich Code ausgeführt, bearbeitet und gedebuggt, der nur auf dem Remotecomputer vorhanden war.