Esercizio - Eseguire il codice ed eseguirne il debug

Completato

Ora che si è connessi al server SSH, è possibile iniziare a scrivere codice. È necessario generare un'applicazione Node di base perché l'attività consiste nello sviluppo di un'app Express per l'agenzia.

In questo esercizio si creerà un progetto Node di base, si eseguirà il codice del progetto e se ne eseguirà il debug, il tutto mentre si è connessi tramite SSH.

Creare ed eseguire un'applicazione Node.js

Per creare ed eseguire l'applicazione Node.js, è necessario eseguire una serie di comandi nel terminale.

1. Aprire un nuovo terminale selezionando Terminale>Nuovo terminale nella barra delle applicazioni. Dal terminale eseguire i comandi seguenti per aggiornare i pacchetti nella macchina virtuale Linux e installare Node.js:

   sudo apt-get update
   

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

   sudo apt-get install nodejs -y
   

2. Eseguire il comando seguente per installare il generatore Express:

   sudo npm install -g express-generator
   

3. Eseguire il comando seguente per creare una nuova applicazione Express denominata myExpressApp:

   express myExpressApp --view pug
   

4. Aprire i file dell'applicazione selezionando Apri cartella nella visualizzazione Esplora risorse. Selezionare myExpressApp nell'elenco a discesa per aprire la cartella nella finestra di Visual Studio Code.

   

5. Nel prompt successivo selezionare OK, che apre la cartella contenente i file dell'applicazione. Se richiesto, considerare attendibile l'area di lavoro.

   

6. Aprire di nuovo il terminale ed eseguire il comando seguente per installare tutte le dipendenze dell'applicazione:

   npm install
   

7. Eseguire il comando seguente per eseguire l'applicazione:

   npm start
   

   L'applicazione verrà eseguita in http://localhost:3000 nella macchina virtuale. Il passaggio successivo illustra come esplorare questa applicazione nel computer locale.

Esplorare l'applicazione

Ora che l'applicazione è in esecuzione, è possibile usare Port forwarding per esplorare l'applicazione Web nel computer locale.

1. Con l'app ancora in esecuzione, eseguire il comando Ports: Focus on Ports View nel Command Palette.

   

2. Selezionare il pulsante Inoltra una porta .

   

3. Specificare la porta 3000, quindi premere INVIO.

   

4. Il server ora inoltra il traffico sulla porta 3000 alla tua macchina locale; puoi ora navigare su http://localhost:3000 per visualizzare l'applicazione web in esecuzione.

5. Nel terminale arrestare l'app premendo CTRL + C.

Modificare l'applicazione ed eseguirne il debug

È possibile usare le funzionalità predefinite di Visual Studio Code per modificare ed eseguire il debug dell'applicazione in esecuzione nel computer remoto.

1. Selezionare Esplora file nel menu a sinistra in Visual Studio Code e aprire il file app.js .

2. Impostare un punto di interruzione nella riga 10 del file facendo clic sulla barra a sinistra del numero di riga. Verrà visualizzato un cerchio rosso.

   

3. Nella visualizzazione Esegui e debug selezionare Esegui e debug. Se richiesto, scegliere Node.js.

   

4. Quando l'app viene eseguita, si raggiungerà il punto di interruzione. È possibile esaminare le variabili, creare espressioni di controllo e spostarsi nello stack di chiamate nella visualizzazione Debug della barra laterale. È possibile controllare la sessione di debug, ad esempio una riga per riga, usando la barra delle azioni Debug nella parte superiore.

   

5. È anche possibile modificare il file come si farebbe se il codice si trovasse nel computer locale. Iniziare a digitare app., che attiva IntelliSense.

   

Congratulations! Hai eseguito, modificato e sottoposto a debug con successo il codice che esisteva solo sul computer remoto.