CONTATTACI

Guide per aspiranti programmatori

Lezione 18 / 23

JavaScript sul desktop, con Visual Studio Code

Questi esempi servivano per iniziare. Il pacchetto all’interno del browser è divertente ma non è una soluzione reale per programmare in JavaScript: per farlo correttamente, c’è bisogno di un editor di codice e di un motore di esecuzione (ovvero un server software).

Secondo un recente sondaggio degli sviluppatori di Stack Overflow, lo strumento di sviluppo più popolare in tutte le categorie è VS Code. Molti sviluppatori preferiscono altri editor come Atom. Entrambi hanno estensioni di terze parti: VS Code ha un numero piccolo ma significativo di estensioni e temi, mentre per Atom ne sono state pubblicate 11K-12K.

Sia Atom, sia VS Code, sono liberamente scaricabili. I nostri esempi utilizzeranno quest’ultimo.

Finora abbiamo introdotto le prime generalità: passiamo, ora, a vere strutture di programmazione JavaScript, in vista – per ora solo all’orizzonte – di mettere le mani su un esempio pratico che opera sul browser. È il momento di scaricare un ambiente di sviluppo!

Visual Studio Code e Live Server

Questo notebook è disponibile per Windows, Linux e Mac, gratuitamente, a questo indirizzo.

Una volta scaricato il software ed eseguita l’installazione, si può aprire una nuova pagina e scegliere il linguaggio che s’intende adottare. Ecco la parte della lista, più lunga, dove compare il linguaggio JavaScript.

  

Lista linguaggi

 

Si dovrà creare un directory nel quale registrare tutti i file generati. Lo si può fare all’inizio, oppure aspettare che sia lo stesso VS Code a chiederlo, come normalmente accade alla generazione delle prime linee di codice.

Inoltre, è comodo avere già pronto un file index.html. La creazione di questo file può essere fatta, tra gli altri modi, cliccando sulla prima icona a destra dell’indicazione del workspace.

 

 

Finestra di comando, in alto a sinistra

 

Una volta cliccato, l’area editor a destra si predispone all’aggiunta di codice. La base da cui partire viene generata automaticamente da VSC, premendo in successione il punto esclamativo e il tab. Ed ecco il risultato.

 

Prima versione di index.html

 

Osserva la riga 5:

<meta http-equiv="X-UA-compatible" content="IE=edge">

Questa riga di codice HTML indica che il sito web viene visualizzato in modalità di compatibilità con Internet Explorer, utilizzando la versione più recente (Edge).

Per indicare che un sito web deve essere visualizzato solo in modalità di compatibilità con Google Chrome, è possibile utilizzare questa riga di codice HTML:

<meta http-equiv="X-UA-Compatible" content="chrome=1">

Metterai il valore “IE=Edge,chrome=1” per ottenere i migliori risultati sia con Internet Explorer (Edge), sia con Google Chrome.

<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">

È, ora, opportuno installare anche il web server, ad esempio Live Server. Sempre con riferimento alla finestra di comando, la barra verticale di sinistra ospita alcune icone, tra le quali quella di un quadrato diviso in quarti, uno dei quali è staccato. È il pulsante che permette di accedere a package aggiuntivi. Cliccando lì si abilita la ricerca degli add-on, che in qualche secondo si completa. Scrivendo Live Server nella riga di ricerca, appaiono le varie versioni, ciascuna con il bottone “installa”.
Clicca sulla prima ed installa LS. Quindi, File>Exit da VBC e, infine, riapri VBC.

 

Cliccando su index.html con il tasto destro, dal menù a tendina seleziona “Open with Live Server”. Apparirà una pagina del tuo browser predefinito nella quale viene eseguito index.html: poiché in questo file non abbiamo messo niente, vedrai una pagina vuota!

L’azione nel linguaggio HTML avviene tra i due tag <body>, ora in riga 9 e 10. Se qui in mezzo aggiungiamo una riga di testo e ripetiamo il right-click su index.html, la pagina si aggiornerà, mostrando la scritta. Se inseriamo il testo tra il tag che indica un titolo (header) molto grande e aggiorniamo, la scritta sarà molto grande 😎

<body>
   <h1>Guida AULAB su JavaScript</h1>
</body>

È giunto il momento di scrivere del vero codice JavaScript. Il metodo che abbiamo ora è di usare index.html come contenitore che VSC esegue su LS e i cui risultati diventano visibili sul browser.

Manca un solo elemento: come si inserisce JavaScript in index? È, in realtà, molto semplice: occorre inserire il codice tra i tag script, ovvero

<script>
   – codice –
</script>

Il codice JavaScript verrà eseguito correttamente.

In generale, questa sezione si inserisce alla fine del corpo del codice html, ovvero subito prima del tag di chiusura </body>. Esistono altre opzioni, che hanno, però, usi specifici dei quali puoi non occuparti in questo momento.

Contattaci senza impegno per informazioni sul corso

Pagamento rateale

Valore della rata: A PARTIRE DA 115 €/mese.

Esempio di finanziamento 

Importo finanziato: € 2440 in 24 rate da € 115 – TAN fisso 9,55% TAEG 12,57% – importo totale del credito € 2841.

Il costo totale del credito comprende: interessi calcolati al TAN indicato, oneri fiscali (imposta di bollo sul contratto 16,00 euro*) addebitati sulla prima rata, costo mensile di gestione pratica € 3,90, spesa di istruttoria € 0,00, spesa per invio rendicontazione periodica cartacea € 0,98 (o spesa per invio rendicontazione periodica cartacea € 0,00), imposta di bollo su rendicontazione periodica € 0,00. Modalità di rimborso obbligatoria: addebito diretto su c/c. La scadenza delle rate è determinata dal giorno della liquidazione del contratto; la data di scadenza delle rate è prevista il giorno 15 del mese. L’importo di ciascuna rata comprende una quota di capitale crescente e interessi decrescente secondo un piano di ammortamento “alla francese”. Offerta valida dal 01/01/2024 al 31/12/2024.

Messaggio pubblicitario con finalità promozionale. Per le informazioni precontrattuali richiedere sul punto vendita il documento “Informazioni europee di base sul credito ai consumatori” (SECCI) e copia del testo contrattuale. Salvo approvazione di Sella Personal Credit S.p.A. Aulab S.r.l. opera quale intermediario del credito NON in esclusiva.

*In fase di richiesta del finanziamento verrà proposta la facoltà di selezionare, in alternativa all’imposta di bollo sul contratto di 16,00 euro, l’imposta sostitutiva, pari allo 0,25% dell’importo finanziato.

Pagamento rateale

Valore della rata: A PARTIRE DA 210 €/mese.

Esempio di finanziamento  

Importo finanziato: € 4500 in 24 rate da € 210,03 – TAN fisso 9,68% TAEG 11,97% – importo totale del credito € 5146,55.

Il costo totale del credito comprende: interessi calcolati al TAN indicato, oneri fiscali (imposta di bollo sul contratto 16,00 euro*) addebitati sulla prima rata, costo mensile di gestione pratica € 3,90, spesa di istruttoria € 0,00, spesa per invio rendicontazione periodica cartacea € 0,98 (o spesa per invio rendicontazione periodica cartacea € 0,00), imposta di bollo su rendicontazione periodica € 0,00. Modalità di rimborso obbligatoria: addebito diretto su c/c. La scadenza delle rate è determinata dal giorno della liquidazione del contratto; la data di scadenza delle rate è prevista il giorno 15 del mese. L’importo di ciascuna rata comprende una quota di capitale crescente e interessi decrescente secondo un piano di ammortamento “alla francese”. Offerta valida dal 01/01/2024 al 31/12/2024.

Messaggio pubblicitario con finalità promozionale. Per le informazioni precontrattuali richiedere sul punto vendita il documento “Informazioni europee di base sul credito ai consumatori” (SECCI) e copia del testo contrattuale. Salvo approvazione di Sella Personal Credit S.p.A. Aulab S.r.l. opera quale intermediario del credito NON in esclusiva.

* In fase di richiesta del finanziamento verrà proposta la facoltà di selezionare, in alternativa all’imposta di bollo sul contratto di 16,00 euro, l’imposta sostitutiva, pari allo 0,25% dell’importo finanziato.

Contattaci senza impegno per informazioni sul corso

Scopriamo insieme se i nostri corsi fanno per te. Compila il form e aspetta la chiamata di uno dei nostri consulenti.