Rilasciato · in miglioramento
Framework · Dal 2016
Angular è un framework web basato su TypeScript e guidato da Google, con routing, form e HTTP integrati per creare applicazioni grandi e manutenibili.
Angular è un framework front-end per sviluppare applicazioni web in TypeScript. È stato pubblicato per la prima volta nel 2016 ed è sviluppato come progetto open source dal team Angular di Google. Nonostante il nome, è un framework diverso da AngularJS, uscito nel 2010. L'interfaccia è composta da componenti formati da un template e da una classe TypeScript, lo stato che cambia viene seguito con i signal e la logica condivisa si trova in servizi forniti tramite dependency injection.
Poiché router, form, HttpClient, internazionalizzazione e strumenti di test fanno parte dei pacchetti ufficiali, Angular è molto diffuso nelle grandi applicazioni aziendali e nei pannelli di amministrazione che più team mantengono per anni. La struttura uniforme e i generatori di codice rendono i progetti simili fra loro, così i nuovi sviluppatori si orientano in fretta. Il rendering lato server e la generazione di siti statici si gestiscono con gli stessi strumenti.
Il modo più rapido per iniziare è installare Node.js, creare un progetto con Angular CLI e avviare il server di sviluppo con ng serve. Il sito ufficiale angular.dev offre un tutorial interattivo che gira nel browser e guide approfondite per ogni argomento. Conoscere le basi di TypeScript aiuta molto, perché il codice Angular si basa su classi, tipi e decoratori.
Ogni componente importa direttamente i componenti e le direttive che usa, così l'interfaccia si divide in parti piccole e autonome senza moduli aggiuntivi.
Con signal, computed ed effect si dichiarano stato e valori derivati; Angular sa esattamente cosa è cambiato e aggiorna solo le parti interessate.
Router, form reattivi, HttpClient, internazionalizzazione e rendering lato server sono pacchetti ufficiali, quindi non serve scegliere le librerie di base.
Angular CLI gestisce creazione dei progetti, generazione del codice, server di sviluppo, test e build di produzione ottimizzate con un unico flusso.
Angular CLI funziona su Node.js. Installa una versione LTS da nodejs.org e verifica che node e npm mostrino la loro versione. Le versioni di Node.js supportate sono indicate nella tabella di compatibilità su angular.dev.
node --version && npm --versionInstalla Angular CLI a livello globale con npm. In questo modo avrai il comando ng; ng version mostra la versione installata.
npm install -g @angular/cliCrea un nuovo progetto con ng new e avvia il server di sviluppo. Dopo aver risposto alle domande sul formato dei fogli di stile e su SSR, l'app si apre su http://localhost:4200.
ng new my-app && cd my-app && ng serve --openIl decoratore @Component trasforma una classe in un componente, cioè una parte dell'interfaccia. Il selector è il nome del tag usato nell'HTML, {{ }} nel template mostra un valore e (click) collega un evento a un metodo. Un signal si legge chiamandolo come una funzione e si modifica con update; quando cambia, Angular aggiorna la vista in automatico.
src/app/app.ts
import { Component, signal } from '@angular/core';
@Component({
selector: 'app-root',
template: `
<h1>Hello, {{ name() }}!</h1>
<button (click)="increment()">Clicked {{ count() }} times</button>
`,
})
export class App {
protected readonly name = signal('Angular');
protected readonly count = signal(0);
increment() {
this.count.update((value) => value + 1);
}
}
npm install -g @angular/cli
ng new hello-angular
cd hello-angular
ng serve --openSei capitoli che ti accompagnano dall'installazione ai concetti chiave di Angular.
Fai domande, condividi la tua esperienza e scambia opinioni su Angular.
Ancora nessuna discussione. Avvia la prima.
0 commenti
Accedi · Accedi per lasciare un commento.
Scrivi tu il primo commento.