Esercitazione: Node.js per principianti

Se non hai familiarità con l'uso di Node.js, questa guida ti aiuterà a iniziare illustrandoti alcuni concetti di base.

• Provare a usare Node.js in Visual Studio Code
• Creare la prima app Web Node.js con Express
• Provare a usare un modulo Node.js

Prerequisiti

• Installazione in Node.js in Windows o nel sottosistema Windows per Linux

Provare NodeJS con Visual Studio Code

Se Visual Studio Code non è ancora stato installato, tornare alla sezione dei prerequisiti precedente e seguire la procedura di installazione collegata per Windows o WSL.

1. Aprire la riga di comando e creare una nuova directory: mkdir HelloNode, quindi immettere la directory: cd HelloNode

2. Crea un file JavaScript denominato "app.js" con una variabile denominata "msg" al suo interno: echo var msg > app.js

3. Aprire la directory e il file app.js in VS Code usando il comando: code .

4. Aggiungi una variabile di tipo stringa semplice ("Hello World"), quindi invia il contenuto della stringa alla console immettendo quando segue nel file "app.js":

   var msg = 'Hello World';
   console.log(msg);
   

5. Per eseguire il file "app.js" con Node.js, apri il terminale direttamente da VS Code selezionando Visualizza>Terminale (oppure selezionando CTRL+`, usando il carattere di apice inverso). Se devi modificare il terminale predefinito, seleziona il menu a discesa e scegli Seleziona shell predefinita.

6. Nel terminale immetti: node app.js. Verrà visualizzato l'output: "Hello World".

Creare la prima app Web NodeJS con Express

Express è un framework Node.js minimo, flessibile e semplificato che facilita lo sviluppo di un'app Web in grado di gestire più tipi di richieste, come GET, PUT, POST e DELETE. Express include un generatore di applicazioni che creerà automaticamente un'architettura di file per l'app.

Per creare un progetto con Express.js:

1. Apri la riga di comando (prompt dei comandi, PowerShell o quello che preferisci).

2. Crea una nuova cartella di progetto: mkdir ExpressProjects e passa alla directory in questione: cd ExpressProjects

3. Usa Express per creare un modello di progetto HelloWorld: npx express-generator HelloWorld --view=pug

   Nota

   In questo esempio stiamo usando il comando npx per eseguire il pacchetto del nodo Express.js senza installarlo effettivamente (oppure installandolo temporaneamente). Se tenti di usare il comando express o verifichi la versione di Express installata usando: express --version, riceverai una risposta che è impossibile trovare Express. Se vuoi installare globalmente Express per usarlo più volte, usa: npm install -g express-generator. Puoi visualizzare un elenco dei pacchetti installati da npm usando npm list. Verranno elencati in base alla profondità (numero di directory annidate). I pacchetti installati saranno a profondità 0. Le dipendenze del pacchetto saranno a profondità 1, le ulteriori dipendenze a profondità 2 e così via. Per altre informazioni, vedere Differenza tra npx e npm in StackOverflow.

4. Esamina i file e le cartelle inclusi da Express aprendo il progetto in VS Code, con: code .

   I file generati da Express creeranno un'app Web che usa un'architettura che all'inizio può sembrare un po' sovraccarica. Nella finestra di esplorazione di VS Code (CTRL+MAIUSC+E) vedrai che sono stati generati i file e le cartelle seguenti:

   • bin. Contiene il file eseguibile che avvia l'app. Genera un server (sulla porta 3000 se non vengono fornite alternative) e configura la gestione degli errori di base.
   • public. Contiene tutti i file a cui è possibile accedere pubblicamente, inclusi file JavaScript, fogli di stile CSS, file dei tipi di carattere, immagini e tutte le altre risorse di cui gli utenti necessitano per connettersi al tuo sito Web.
   • routes. Contiene tutti i gestori di route per l'applicazione. In questa cartella vengono generati automaticamente due file, index.js e users.js, che vengono usati come esempi di come separare la configurazione della route dell'applicazione.
   • views. Contiene i file usati dal motore del modello. Express è configurato per cercare in questa posizione una visualizzazione corrispondente quando viene chiamato il metodo di rendering. Il motore del modello predefinito è Jade, ma Jade è stato deprecato a favore di Pug, quindi è stato usato il flag --view per cambiare il motore (modello) di visualizzazione. Puoi visualizzare le opzioni del flag --view (e altre) usando express --help.
   • app.js. Punto iniziale dell'app. Carica tutti gli elementi e inizia a soddisfare le richieste degli utenti. Si tratta fondamentalmente del collante che tiene insieme tutte le parti.
   • package.json. Contiene la descrizione del progetto, il gestore degli script e il manifesto dell'app. Lo scopo principale è tenere traccia delle dipendenze dell'app e delle rispettive versioni.

5. Ora devi installare le dipendenze usate da Express per compilare ed eseguire l'app HelloWorld Express (i pacchetti usati per attività come l'esecuzione del server, come definito nel file package.json). All'interno VS Code apri il terminale selezionando Visualizza>Terminale (oppure CTRL+`, usando il carattere di apice inverso) e assicurati di trovarti ancora nella directory del progetto 'HelloWorld'. Installa le dipendenze del pacchetto Express con:

   npm install
   

6. A questo punto hai configurato il framework per un'app Web con più pagine che ha accesso a una vasta gamma di API e metodi di utilità HTTP e middleware, semplificando la creazione di un'API affidabile. Avvia l'app Express in un server virtuale immettendo:

   npx cross-env DEBUG=HelloWorld:* npm start
   

   Suggerimento

   La parte DEBUG=myapp:* del comando sopra riportato indica a Node.js che vuoi attivare la registrazione a scopo di debug. Ricordati di sostituire 'myapp' con il nome della tua app. Puoi trovare il nome dell'app nel file package.json sotto la proprietà "name". L'uso di npx cross-env imposta la variabile di ambiente DEBUG in qualsiasi terminale, ma puoi anche impostarla usando la modalità specifica per il tuo terminale. Il comando npm start indica a npm di eseguire gli script nel file package.json.

7. Ora puoi visualizzare l'app in esecuzione aprendo un Web browser e passando a: localhost:3000

   

8. Ora che l'app Express HelloWorld viene eseguita localmente nel browser, prova ad apportare una modifica aprendo la cartella 'views' nella directory del progetto e selezionando il file 'index.pug'. Una volta aperto, cambia h1= title in h1= "Hello World!" e seleziona Salva (CTRL+S). Per visualizzare la modifica, aggiorna l'URL localhost:3000 nel Web browser.

9. Per arrestare l'esecuzione dell'app Express, nel terminale immettere: Ctrl+C

Provare a usare un modulo Node.js

Node.js include strumenti che ti consentono di sviluppare app Web sul lato server, alcune integrate e molte altre disponibili tramite npm. Questi moduli possono essere utili per molte attività:

Useremo il modulo del sistema operativo predefinito per ottenere alcune informazioni sul sistema operativo del computer:

1. Nella riga di comando apri l'interfaccia della riga di comando di Node.js. Verrà visualizzato il prompt > che informa che stai usando Node.js dopo aver immesso: node

2. Per identificare il sistema operativo attualmente in uso (che dovrebbe restituire una risposta che informa che sei in Windows), immetti: os.platform()

3. Per controllare l'architettura della CPU, immetti: os.arch()

4. Per visualizzare le CPU disponibili nel sistema, immettere: os.cpus()

5. Esci dall'interfaccia della riga di comando di Node.js immettendo .exit o selezionando due volte CTRL+C.

   Suggerimento

   È possibile usare il modulo del sistema operativo Node.js per eseguire operazioni come controllare la piattaforma e restituire una variabile specifica della piattaforma: Win32/.bat per lo sviluppo di Windows, darwin/.sh per Mac/unix, Linux, SunOS e così via (ad esempio, var isWin = process.platform === "win32";).