Ambientazione e Prerequisiti per Angular: Tuffiamoci nel Setup!
Prima di iniziare con Angular, è fondamentale avere una solida base di strumenti e conoscenze. In questo modulo, ti guideremo attraverso l’ambientazione e i prerequisiti essenziali per iniziare con sicurezza il tuo viaggio nel mondo di Angular.
Installazione di Node.js e npm
Cos’è Node.js?
Node.js è un runtime JavaScript che consente agli sviluppatori di eseguire JavaScript sul lato server. È alla base di molte applicazioni web moderne e fornisce le fondamenta su cui Angular opera.
E npm?
npm sta per “Node Package Manager”. È un sistema di gestione dei pacchetti che facilita l’installazione e la gestione delle librerie e degli strumenti necessari per i tuoi progetti JavaScript.
Procedura di installazione:
- Visita il sito ufficiale di Node.js.
- Scarica l’installer più recente per il tuo sistema operativo.
- Segui le istruzioni sull’installer. Una volta completata l’installazione, avrai sia Node.js che npm sul tuo computer.
Introduzione al CLI di Angular e Installazione
Cos’è il CLI di Angular?
Il CLI (Command Line Interface) di Angular è uno strumento potente che aiuta gli sviluppatori a creare, gestire e costruire applicazioni Angular con facilità.
Installazione del CLI di Angular:
- Apri il terminale o il prompt dei comandi.
- Digita
npm install -g @angular/cli
e premi invio. - Una volta completata l’installazione, puoi verificare la corretta installazione digitando
ng version
.
Creazione del Primo Progetto Angular
Ora che hai tutto il necessario, è il momento di creare la tua prima applicazione Angular!
Procedura:
- Nel terminale, digita
ng new nome-del-tuo-progetto
. - Il CLI ti farà alcune domande sulla configurazione. Se sei indeciso, puoi andare avanti con le opzioni predefinite.
- Una volta completata la creazione, spostati nella cartella del progetto con
cd nome-del-tuo-progetto
. - Avvia l’applicazione digitando
ng serve
. Dopo pochi secondi, dovresti vedere un messaggio che ti informa che il server sta girando e puoi visitarehttp://localhost:4200/
nel tuo browser per vedere la tua nuova applicazione Angular in azione!