Corso Completo Web Developer

Impara le basi della command line.

Corso completo Web Developer - Parte 1 - 1.2

Nei precedenti articoli sulla preparazione del tuo computer ad un ambiente di Sviluppo e la configurazione di Git e Github abbiamo già visto alcune basi su come utilizzare il Terminale (o Git Bash se sei utente Windows).

So benissimo la sensazione che puoi provare quando apri il terminale e non sei molto sicura/o di ciò che stai facendo ma visto che questo è uno strumento fondamentale voglio fare chiarezza e spiegarti in parole semplici quali sono e come funzionano i comandi che vengono più comunemente utilizzati.

Ti spiegherò tutti i comandi di cui avrai bisogno per sopravvivere al terminale 😁

Introduzione

Senza scendere troppo nei dettagli tecnici e per l'amor della semplicità useremo due nomi intercambiabili che sono i più comunemente usati per riferirci al Terminale del Mac o Git Bash per utenti Windows ovvero Command Line (Linea di Comando) o appuntosemplicemente Terminale.

Perchè fare un articolo completamento dedicato alla command line?

La command line è un applicazione fondamentale per ogni tipo di developer.

Imparare ad utilizzarla ti renderà più facile comprendere le successive lezioni ma non solo infatti molto spesso ti ritroverai a dover eseguire comandi nella command line mentre stai programmando e quindi averne una buona comprensione ti beneficerà senza alcun ombra di dubbio.

Per fare un esempio analogo, pensa a quando studiavi lezioni di Matematica a scuola, non saresti stata/o capace di comprendere l'Algebra se non avessi avuto una buona comprensione delle moltiplicazioni. Ecco, questa è la stessa cosa.

Diventare esperti del Terminale non è assolutamente il nostro obiettivo qui. Iniziare ad usarlo, capirne le basi e superare quella paura iniziali è il nostro obiettivo.

Mac vs PC

Voglio subito farti una distinzione prima che ci immergiamo completamente nel nostro tutorial.

Si può programmare con un Mac , con un Linux o con un PC Windows. Nel 99% dei casi è la stessa cosa e nessuno di questi è superiore all'altro per questa disciplina.

Ci sono delle differenze tra questi sistemi operativi. Mac e Linux sono basasti su un sistema chiamato UNIX mentre Windows è basato su un sistema chiamato MS-DOS.

Le comunità dei programmatori molto spesso si basano sull'utilizzo di Mac o Linux quindi conoscere i comandi basati su UNIX è importante e sicuramente un grande vantaggio.

Data l'importanza di UNIX è stato sviluppato una sorta di emulatore UNIX per Windows, un software usato molto comunemente chiamato Git Bash che viene utilizzato al posto della Windows Power Shell e ci permette di azzerare queste differenze.

Abbiamo recentemente parlato di questo Software nell'articolo "preparazione del tuo computer ad un ambiente di Sviluppo" dove ti spiego come installarlo correttamente.

Detto ciò, se sei un utente Windows imparare i comandi nativi basati su MS-DOS è sicuramente cosa giusta e saggia ma io ti consiglio vivamente di iniziare con i comandi UNIX che sono (1) più semplici da imparare e (2) una volta imparati questi ti sarà molto più facile comprendere quelli basati su MS-DOS.

Che cos'è la Command line?

In parole semplici è uno strumento che risiede tra l'interfaccia grafica e l'hardware del computer. Tutto quello che puoi fare attraverso l'interfaccia grafica con il tuo mouse, le finestre, la crocettina rossa per chiudere una finestra, le icone sono semplicemente un modo che è stato sviluppato per rendere l'utilizzo del computer accessibile a tutti. Questa si chiama anche GUI ovvero Graphical User Interface.

Sono vari i motivi per cui i Developers tendono spesso ad usare la command line. Questa ti velocizza il tuo workflow e aiuta a fare determinate operazioni che non sono sempre disponibili attraverso la GUI.

Per aprire la Command Line sul Mac puoi utilizzare la combinazione dei comandi cmd + Barra Spaziatrice che avvierà la *Spotlight *quindi cerca Terminale e premi Invio per aprire l'applicazione.

Per aprire la Command Line che si basa sul sistema UNIX - lo stesso sistema che Mac utilizza - esegui Git Bash in modalità Amministratore.

Attenzione: La grafica per Windows è leggermente diversa ma il sistema funziona esattamente allo stesso modo.

Una volta che la command line si è aperta nella maggior parte dei casi questa si aprirà di default nella cartella home (la cartella "base") del tuo utente nel computer.

Questa viene indicata con il simbolo della tilde: ~

Si può utilizzare la command line per comandi super semplici come aprire una cartella fino a comandi più impattanti come eliminare file e cartelle di sistema.

Se cancellassimo un file dalla command line questo stesso cambiamento verrà riflesso anche dalla GUI. Quindi, se avessimo un file chiamato "tesi di laurea" sul Desktop e lo eliminassimo con il comando rm tesi di laurea questo verrà effettivamente eliminato dal Desktop.

Man mano che andremo avanti nel tutorial assicurati di ripetere i comandi che ti mostro cosí che puoi avere ricordarli e capirli meglio.

Ogni qual volta vedi un testo che inizia con il simbolo del dollaro $ significa che questo è un comando della command line e quando lo eseguirai non dovrai anche scrivere il $.

Per esempio se ti dicessi di eseguire il comando sottostante

  $ touch index.html

questo è quello che dovrai eseguire nella command line

Come avrai notato dall'immagine non ho scritto il simbolo del $ ma soltanto la parte che viene dopo ovvero touch index.html (il comando touch serve per creare un nuovo file e quello che scrivi dopo è il nome che vuoi dare al file).

Comandi nella Command Line

Listare i files in una cartella

Proviamo a listare tutti i files nella cartella Home del computer (quella base che viene indicata con la tilde ~.

  $ ls

Il comando ls è l'abbreviazione di list ovvero. Questo comando lo puoi usare per vedere quali i files presenti nella cartella in cui ti trovi.

Listare i files nascosti in una cartella

Sapevi che nel computer esistono files e cartelle nascoste? Files e cartelle nascoste non sono visibili normalmente dall'interfaccia grafica e con il comando ls questi non vengono listati.

Per poter vedere anche questi file puoi aggiungere un cosiddetto "parametro" al tuo comando. I parametri (in inglese puoi chiamarli sia parametro che flag) vengono aggiunti con un trattino. Per esempio per listare tutti i file esegui il seguente comando

  $ ls -lA

Vedrai una lunga lista di files e cartelle nascoste. Se utilizzi Windows vedrai una schermata con una grafica leggermente diversa ma il comando sarà esattamente lo stesso.

Come facciamo a spostarci tra le cartelle quando utilizziamo la command line? Dalla cartella home contrassegnata con la tilde possiamo spostarci sul Desktop.

Esegui il seguente comando

  $ cd Desktop

Il comando cd è l'abbreviazione di change directory. Quello che specifichi dopo è il nome della cartella in cui vuoi spostarti.

Con il comando cd Desktop ci siamo spostati un passo in avanti dalla cartella *Home *alla cartella Desktop.

Come facciamo adesso se volessimo andare indietro tornando nella cartella Home?

Utilizziamo di nuovo il comando cd ma anizichè specificare il nome della cartella utilizzeremo due puntini .. per dire al computer di fare un passo indietro. Quindi eseguiamo il seguente comando

  $ cd ..

Visualizzare il percorso della cartella corrente

A volte può tornarti utile voler visualizzare il percorso nel computer della cartella in cui ti trovi.

Aspetta un attimo Emanuele, una cosa alla volta. Che cos'è il percorso nel computer della cartella in cui ti trovi?

Nel caso ti stia facendo questa domanda voglio subito farti chiarezza altrimenti complimenti per avere già buone conoscenze del Computer 👏

Il percorso di una cartella chiamato anche pathname o current path o semplicemente path è il termine utilizzato per indicare dove vive una specifica cartella all'interno del nostro computer.

Quando vogliamo spiegare dove si trova un luogo utilizziamo il nome di una strada ed il numero civico. Nel computer invece utilizziamo il pathname. Il percorso per arrivare in una determinata cartella.

L'organizzazione delle cartelle nel Computer è basata su una relazione *genitore-figlio *o in inglese parent-children.

Facciamo un esempio basato su tre cartelle:

  • cartella-x
  • cartella-y
  • cartella-z

La cartella-x contiene la cartella-y e la cartella-y contiene la cartella-z.

  • cartella-x è la cartella genitore di cartella-y
  • cartella-y è la cartella figlio di cartella-x ma è anche la cartella genitore di cartella-z
  • cartella-z è la cartella figlio di cartella-y

Immaginiamo che la cartella genitore cartella-x si trovasse sul Desktop, il pathname per raffigurare tutta questa situazione sarebbe quindi il seguente:

  ~/Desktop/cartella-x/cartella-y/cartella-z

Il simbolo della tilde corrisponde alla cartella base del nostro computer utente quindi il seguente pathname corrisponde all'esempio fatto sopra

  /Utenti/emanuelegorga/Desktop/cartella-x/cartella-y/cartella-z

su Windows invece:

  /c/Utenti/emanuelegorga/Desktop/cartella-x/cartella-y/cartella-z

Esempi in Mac e Windows:

L'organizzazione di queste cartelle è leggermente diversa tra Windows e Mac / Linux questo perchè Windows si basa su un sistema MS-DOS mentre Mac e Linux su un sistema UNIX.

In Windows si basa tutto sulla cartella genitore C mentre in Mac e Linux sulla cartella home.

In questa cartella principale troveremo una cartella figlio chiamata Users o Utenti nella quale saranno presenti una cartella per ogni utente nel computer.

Ogni qual volta vogliamo sapere il percorso della cartella in cui ci troviamo utilizziamo il comando pwd che è l'abbreviazione di path working directory ovvero il percorso della cartella corrente.

Prova i seguenti comandi. Scrivi un comando alla volta e premi Invio.

  cd ~
  cd Desktop
  pwd

Il primo ti serve per assicurarti che torni alla cartella principale del computer, secondo servirà a spostarti sul Desktop mentre il terzo servirà a visualizzare il percorso della cartella Desktop.

Visualizzare la data odierna

A volte potrebbe tornarci utile fare il display della data odierna sulla command line.

Semplicemente prova ad eseguire il comando date

  $ date

Creare un file

Se volessimo creare un file, per esempio chiamato tesi-di-laurea come potremmo fare?

Nota che non ho messo spazi nel nome del file. Quando si programma non si usano quasi mai spazi nei nomi dei files.

Esiste il comando touch per eseguire quest'operazione.

Assicuriamoci di trovarci sulla cartella principale del computer e proviamo a creare questo file.

  cd ~
  ls
  touch tesi-di-laurea
  ls

Il primo comando serve a tornare alla cartella principale, il secondo a listare i files che sono presenti in questo momento, il terzo a creare il file tesi-di-laurea ed in fine ripetiamo il comando per listare i files cosí che possiamo vedere il nostro nuovo tesi-di-laurea.

Eliminare un file

D'accordo, abbiamo creato questo file ma non vogliamo mica metterci a scrivere la tesi di laurea adesso?!

Esiste il comando rm che ci viene in aiuto quando vogliamo eliminare un file.

Procediamo quanto prima alla cancellazione di questo file tesi-di-laurea 😁

Esegui il seguente comando nella console. Se sei un utente Mac ti verrà chiesto di confermare e potrai inserire y che sta per yes e premere Invio. Il comando ls ci serve solo per controllare che abbiamo effettivamente eliminato il file tesi-di-laurea.

  rm tesi-di-laurea
  ls

Creare una cartella

Oltre ai files vogliamo ovviamente avere la possibilità di creare anche cartelle.

Quando crei una cartella con il Mouse attraverso l'interfaccia grafica faresti pulsante destro + Nuova cartella e poi inseriresti il nome della cartella.

Attraverso la command line ci viene in aiuto il comando mkdir che è l'abbreviazione di make directory.

Quindi eseguiamo il comando mkdir poi aggiungiamo uno spazio e specifichiamo il nome che vogliamo dare alla cartella.

  mkdir command-line-tutorial

Ora proviamo ad eseguire il comando ls per vedere che abbiamo effettivamente creato la cartella command-line-tutorial.

Eliminare una cartella

Come facciamo ad eliminare una cartella, per esempio command-line-tutorial che abbiamo appena creato?

Utilizzeremo il comando rm ma questa volta con un parametro -r altrimenti ci tornerà un errore dicendo che command-line-tutorial è una cartella e non può essere eliminata.

Se sei utente Mac ti chiederà anche di confermare di cancellare tutti i files al suo interno ed un'ulteriore conferma. Semplicemente inserisci y e premi Invio ad entrambe le domande come nell'immagine sottostante

Copiare e spostare i files

Come facciamo a fare la copia di un file? Con il mouse e l'interfaccia grafica cliccheremo con il pulsante destro sul file > Copia > Incolla. Con il terminale si utilizza il comando cp che è l'abbreviazione di copy.

Per prima cosa creiamo una cartella con un qualsiasi nome, io la chiamerò gorgatech, spostiamoci all'interno di questa cartella e creiamo un file, ad esempio chiamato command-line-tutorial.

  cd ~
  mkdir gorgatech
  cd gorgatech
  touch command-line-tutorial
  ls

A questo punto se volessimo duplicare il file command-line-tutorial in un nuovo file chiamato nuovo-command-line-tutorial eseguiremo il seguente comando

  cp command-line-tutorial nuovo-command-line-tutorial

Come puoi notare abbiamo dato due parametri al comando cp: il primo è il nome del file che vogliamo copiare ed il secondo è il nome del nuovo file che creeremo.

Per spostare il nuovo file nuovo-command-line-tutorial in un'altra cartella possiamo usare il comando mv che è l'abbreviazione di move.

Per spostare questo file dalla cartella gorgatech alla cartella precedente nel pathname ovvero la cartella principale possiamo eseguire il seguente comando

  mv nuovo-command-line-tutorial ../nuovo-command-line-tutorial

Poi controlliamo il contenuto della cartella gorgatech con il comando ls e vedremo che il file non è più nella cartella. Dopodichè spostiamoci nella cartella precedente con il comando cd .. e listiamo i files in questa cartella con il comando ls e vedremo che il file adesso si trova qui.

Il secondo parametro che abbiamo dato al comando mv ovvero ../command-line-tutorial è composto da due parti: (1) è il percorso dove spostare il file ed il (2) è il nome che vogliamo dare a questo file una volta spostato.

Come? Non hai detto che il comando mv serve a spostare un file?

Esattamente! Oltre a poter spostare un file questo comando ci permette anche di rinominare un file e possiamo rinominare un file anche senza dover necessariamente spostarlo, esattamente come faremmo con pulsante destro del mouse > Rinomina.

Rinominiamo il file *nuovo-command-line-tutorial, *io per esempio lo chiamerò test-rename-file.

  mv nuovo-command-line-tutorial test-rename-file

Ed ora listiamo i files nella cartella e notiamo che il file ha cambiato nome.

Comando echo

A volte potrebbe tornarci utile dover fare il display di un testo. Per esempio se volessimo far comparire nella command line la frase Hello World come possiamo fare?

Qui ci viene in aiuto il comando echo. Proviamolo subito in azione nella command line. Fai attenzione alle virgolette all'inizio ed alla fine della frase. Durante la parte di JavaScript studierai che questa frase si definisce Stringa nella programmazione e che le virgolette servono a dire al computer l'inizio e la fine di una Stringa.

  $ echo "Hello World"

Brava/o! E se adesso volessimo scrivere la frase Hello World all'interno di un file? Anche questo è possibile con il comando echo!

Scriviamo Hello World all'interno del file test-rename-file

  echo "Hello World" > test-rename-file

Altri tre comandi prima della fine e avrai appreso tutte le basi della command line.

Se sei riuscita/o a seguire tutti i comandi finora ti faccio i miei complimenti...grande! 👏

Nel caso non ci fossi riuscita/o rileggi lentamente. Fare danni al computer con i comandi basici è davvero difficile quindi non preoccuparti 🙂 Fai solo attenzione al comando rm col quale potresti cancellare involontariamente files o cartelle che non vuoi/devi.  

Aprire un file con l'applicazione Note (Blocco note per Windows)

Per aprire un file di testo con l'applicazione Note di Mac o Blocco Note di Windows è molto semplice.

Se sei utente Mac utilizza il comando open . Nell'immagine non fare caso al comando cat. È il prossimo comando che sto per spiegarti.

  open test-rename-file

Se sei utente Windows utilizza il comando notepad

  notepad test-rename-file

Visualizzare il contenuto di un file senza aprirlo

Per visualizzare il testo di un file senza doverlo aprire possiamo utilizzare il comando cat. Proviamolo subito con il file test-rename-file. Non abbiamo più bisogno dell'applicazione delle Note quindi puoi anche chiuderla.

  cat test-rename-file

Text Editor VIM

Se la command line ti ha fatto minimamente sentire di essere in Matrix non hai ancora visto VIM! 😎

Se hai seguito l'articolo in cui ti spiego i Software che consiglio per avere un ambiente di sviluppo nel tuo computer avrai notato che ti ho suggerito VS Code come text editor per programmare.

È un text editor fenomenale che continuano a migliorarlo costantemente ma devi sapere anche dell'esistenza di VIM, un text editor la cui interfaccia è interamente incorporata con la command line.

Ma scusa, se VS Code è cosi fenomenale perchè dovrei stare a spendere tempo per capire VIM adesso?

Domanda lecita. Risposta semplice. Alle volte potremmo trovarci in situazioni dove non abbiamo il lusso di poter usare un Software esterno alla command line e dobbiamo arrangiarci con VIM. Questo non vuole assolutamente sminuire VIM, anzi. È un text editor che io stesso spesso utilizzo ed è amato dalla maggioranza dei programmatori ma ha una linea d'apprendimento molto più ripida rispetto a VS Code o qualsiasi altro text editor con un'interfaccia grafica.

Ultima cosa da sapere prima di andarlo a provare. VI e VIM sono molto simili. VIM significa Vi iMproved ovvero una versione di VI migliorata. Questo è bene che tu lo sappia nel caso in cui dovessi ritrovarti a leggere VI anzichè VIM da qualche parte.

Passiamo quindi all'azione!

Per aprire un file con vim basta chiamare il comando vim e specificare il nome del file.

  vim test-rename-file

Ti si aprirà una finestra come la seguente

Nel momento in cui ti si aprirà VIM non potrai ancora scrivere. Questo text editor si basa su delle modalità che tu devi azionare o abilitare prima di poter continuare.

La modalità per scrivere si abilita con la lettera i che sta per insert. Quando premi la lettera i vedrai che in basso comparirà la scritta INSERT

Quindi all'interno di VIM premi la lettera i e vedi che si attiva la modalità INSERT.

La funzione del mouse è disabilitata all'interno di questo text editor quindi dovrai spostarti soltanto con la tastiera e le frecce.

Ora con l'aiuto delle frecce vai alla fine della frase Hello World che abbiamo scritto precedentemente e prova a scrivere qualcosa, vedrai che le lettere inizieranno a comparire sulla pagina.

Fatto ciò vogliamo salvare le modifiche ed uscire dal file. Per questo dobbiamo uscire dalla modalità INSERT con il tasto ESC della tastiera e vedrai che la parola INSERT in basso andrà via.

Una volta che sei fuori dalla modalità INSERT, per salvare ed uscire da VIM premi la combinazione dei tasti due punti + w + q + Invio. Guarda nell'immagine di seguito

A questo punto VIM dovrebbe chiudersi e la schermata della command line riapparire.

Conclusione

Sei arrivata/o alla fine di questo tutorial, complimenti 💪

Ovviamente non aspettarti di ricordare tutto ciò che hai visto e praticato oggi.

La ripetizione è la madre di tutte le discipline e la programmazione non fa eccezione. Ripeterai questi programmi nei giorni, settimane, mesi ed anni a venire e man mano li comprenderai sempre meglio.

Un anticipo a che cosa andremo a vedere nel prossimo articolo:

  • Come funziona il Web - che cosa succede quando scriviamo un URL nella barra degli indirizzi di un browser?

Tieniti pronta/o! 🚀