1 Angular

Per installare Angular cli via npm utilizzare il seguente comando:

npm install -g @angular/cli

Per creare un nuovo progetto angular digitare nel percorso scelto :

ng new nomeprogetto

a questo punto per far partire la nostra nuova app angular, basterà entrare nella cartella appena creata e lanciare il server con

ng serve -o

Di default il nostro progetto si aprirà sulla porta 4200, quindi all’indirizzo localhost:4200.

La pagina che si apre è contenuta nel file app.component.html. Se apriamo il componente, quindi il file app.component.ts possiamo aggiungere una proprietà nell’esportazione della classe

export class AppComponent {
  title = 'Faghy';
}

a questo punto possiamo avere accesso a questa proprietà anche dal nostro file app.component.html tramite le doppie graffe

{{  title }}

Se durante la creazione del progetto, angular mostra qualche errore riguardante git, allora bisogna configurare l’utente e la email di git

git config --global user.email latuaemail@dominio.com
git config --global user.name qualunqueUserNameOEmail

Se non vuoi che il progetto venga versionato, allora aggiungi

ng new nomeapp --skip-git

Struttura di angular

Dalla versione 6 in poi il file di configurazione globale è angular.json che contiene nella chiave projects il nome del nostro progetto che contiene diverse configurazioni, per esempio la builder che usa il devkit, la cartella di uscita dell’app, il fil principale di ingresso, le configurazioni sui fogli di stile e gli script.

La maggior parte di quello che ci interessa si trova all’ interno della cartella src all’interno della quale troveremo la cartella sulla quale lavoreremo chiamata app .

Il file richiamato all’avvio è src/index.html, all’interno del quale troviamo nel body un tag HTML custom di angular, di default

<app-root></app-root>

Questo tag particolare viene dichiarato dal componente che corrisponde al file src/app/app.module.ts il quale si appoggia al file src/app/app.component.ts e nella direttiva selector specifica il nostro custom tag.