Benvenuti nell’incantevole mondo della tecnologia web, dove stiamo per svelare i segreti di Connect! In questo post del blog, intraprendiamo un viaggio per esplorare l’affascinante universo di Angular, la forza trainante del successo di Connect. Questo articolo vi presenterà gli ultimi aggiornamenti di Angular e i miglioramenti che vi offriranno un’esperienza online più fluida, veloce e piacevole.
Che cos’è Angular?
Prima di tutto, immaginate il web come una vasta città piena di edifici incredibili, e Angular è come il maestro architetto che aiuta a creare queste incredibili strutture digitali. Angular, sviluppato e mantenuto da Google e da una comunità di sviluppatori, è uno strumento speciale che i costruttori di talento (sviluppatori) usano per costruire siti e applicazioni web, proprio come gli architetti usano i progetti per progettare gli edifici.
Angular rende interattive le pagine web, consentendo di fare clic su pulsanti, compilare moduli e visualizzare contenuti dinamici senza soluzione di continuità. È una sorta di procedura guidata dietro le quinte che fa funzionare il web nel modo in cui lo fa.
Angular v10
Ora, immergiamoci nel viaggio di Connect, a partire da Angular v10. Esploreremo i punti salienti di ciò che è cambiato e migliorato nel corso delle versioni, in modo che possiate avere un assaggio degli entusiasmanti miglioramenti che hanno plasmato Connect.
Nuovo selezionatore di intervalli di date
In questa versione, Angular Material ha introdotto un nuovo componente di selezione dell’intervallo di date. Abbiamo fatto buon uso di questa funzione in Connect. Permette agli utenti di scegliere facilmente una data di inizio e di fine del loro periodo di assenza dall’ufficio.
Ma non è tutto: lo usiamo anche in altre parti di Connect. Ad esempio, la usiamo per filtrare le date e trovare record specifici in un determinato arco di tempo.
Angular v11
Passando ad Angular v11, una delle caratteristiche principali è il miglioramento delle prestazioni del router.
Supporta il caricamento pigro con le uscite denominate
Non lasciatevi scioccare dal titolo: si tratta semplicemente di rendere le pagine web più efficienti! Nelle versioni precedenti di Angular, quando volevamo visualizzare contenuti specifici in punti diversi di una pagina web, potevamo assegnare a tali punti dei nomi. Tuttavia, questi punti denominati venivano sempre caricati subito, anche se non erano necessari. Ma a partire da questa versione, Angular 11, possiamo ora fare in modo che questi punti carichino il contenuto solo quando lo si vuole effettivamente vedere, il che può aiutarci a velocizzare il sito web.
Angular v12
Angular 12 ha portato grandi novità per gli sviluppatori con l’introduzione del Nullish Coalescing nei template HTML, che potrebbe non sembrare entusiasmante per i non addetti ai lavori, ma è un vero motivo per festeggiare in Connect!
Coalizione nullish
Per un po’ di tempo, l’operatore nullish coalescing (??) ha reso più facile per gli sviluppatori scrivere codice più ordinato nelle classi TypeScript. Notizie interessanti dal team di Angular: Nella versione 12, gli sviluppatori possono ora utilizzare questa utile funzione anche nei template di Angular!
Ora, nei template, gli sviluppatori possono usare la nuova sintassi per semplificare i condizionali complessi. Ad esempio:
{{ age !== null && age !== undefined ? age : calculateAge() }}
Diventa:
{{ age ?? calculateAge() }}
In parole povere, per noi sviluppatori il codice richiedeva di verificare se la variabile ‘age’ avesse valori come 11 o 22 prima di poter effettuare calcoli con essa. Ma con questa nuova funzione, non dobbiamo più preoccuparci di verificare la presenza di “null” e “undefined”. Possiamo usare il nuovo operatore (??) per assicurarci che ‘age’ abbia un valore e funziona allo stesso modo.
Angular v13
IE11 non è più supportato! Potreste pensare che si tratti di una brutta notizia, ma in realtà non è così.
Infatti Connect ha interrotto il supporto per IE11 già dal gennaio 2022.
Fine del supporto per IE11
Angular 13 ha deciso di interrompere il supporto a Internet Explorer 11 e questa è in realtà una buona cosa. Questo cambiamento rende il caricamento delle applicazioni web più veloce e l’utilizzo di meno dati. Inoltre, consente ad Angular 13 di utilizzare tutte le nuove funzionalità dei moderni browser web, come le animazioni e lo styling.
Con l’addio al codice speciale necessario solo per Internet Explorer, Connect è diventato più semplice da mantenere. Ci servirà meno tempo per progettare soluzioni complicate e non dovremo fare cose in più per farlo funzionare con i browser più vecchi, il che è positivo per noi sviluppatori. Di conseguenza, abbiamo anche più tempo a disposizione per implementare funzionalità ancora più sorprendenti per gli utenti della nostra app, che potranno sperimentare la nostra applicazione con funzionalità più impressionanti e prestazioni migliori. È un vantaggio per tutti!
Angular v14
La caratteristica principale di Angular 14 è la “sicurezza”, come si può notare dall’introduzione dei moduli Angular digitati, che aggiungono un ulteriore livello di protezione a Connect.
Moduli Angular digitati
I form senza digitazione rendono più difficile il debugging.
Tuttavia, l’uso di un modulo digitato è come avere un assistente super intelligente che non solo garantisce di fornire il giusto tipo di informazioni in Connect, ad esempio quando creiamo/programmiamo un post di notizie, un post di streaming, compiliamo un modulo di sondaggio, ecc.
ma aiuta anche gli sviluppatori a velocizzare il processo di individuazione e correzione degli errori. È come avere uno strumento pratico che non solo semplifica le cose, ma agisce anche come una spalla supereroistica per noi sviluppatori, rendendo il nostro lavoro più veloce ed efficiente.
Angular v15
Ultime notizie: Aggiornamento per una migliore interfaccia utente e un accesso più semplice, che portano a un’esperienza di sviluppo più fluida!
Migrare ai componenti basati su MDC
In Angular 15 sono stati apportati alcuni cambiamenti significativi, ristrutturando molti componenti per allinearli ai Material Design Components for the Web (MDC). Questi componenti basati su MDC non solo migliorano l’aspetto, ma migliorano anche l’accessibilità per tutti. Inoltre, poiché ora fanno parte dello standard Material Design, noto anche come linee guida che spiegano i principi importanti che ogni designer dovrebbe seguire quando progetta per iOS o Android, consentono agli sviluppatori di rimanere aggiornati senza sforzo con lo stile più recente e accurato.
Per esempio, il cursore nella nostra applicazione ha aggiunto un pollice che è un indicatore di posizione per presentare meglio il valore selezionato della sua posizione e una traccia più spessa del cursore potrebbe contribuire a migliorare l’esperienza dell’utente, rendendolo più facile da interagire e facendo risaltare visivamente di più la regolazione del valore.
Oltre allo slider, abbiamo migrato a componenti basati su MDC anche altri componenti, come le caselle di controllo e i pulsanti di opzione, che hanno ampliato le dimensioni dei loro target tattili (l’area con cui interagire) per rendere gli utenti più facili da usare e accessibili.
Sintesi
In conclusione, Angular ha subito un’evoluzione e un miglioramento continui, con ogni nuova versione che introduce miglioramenti adatti alle esigenze degli sviluppatori e alle richieste del moderno sviluppo web. Tra i punti salienti delle recenti versioni di Angular vi sono i miglioramenti delle prestazioni, l’accesso al codice più pulito per gli sviluppatori, il miglioramento della sicurezza, l’introduzione di nuovi componenti e la rimozione del supporto legacy per Internet Explorer 11.
Gli sviluppatori hanno ora accesso a un framework più efficiente e facile da sviluppare che sfrutta le caratteristiche dei browser moderni, rendendo più semplice la creazione di applicazioni web veloci, reattive e ricche di funzionalità. Con la sua continua evoluzione, Angular rimane uno strumento potente e versatile per creare applicazioni web robuste e rimanere all’avanguardia nelle tendenze dello sviluppo web.
