Sono un consulente freelance Angular/TypeScript fullstack

Front-end: Angular / TypeScript / Javascript | Back-end: ASP.NET MVC CORE C#

Mi chiamo Stefano Marchisio e sono di Torino, dal 2000 mi interesso a tutto cio' che ruota intorno al web. Sono un libero professionista che lavora come consulente freelance fullstack ed in questa pagina ti parlo della tecnologia principale che uso lato front-end.

Il mio obiettivo è quello di trovare collaborazioni come consulente freelance con nuove realtà. Per questo motivo se una software house ha dei lavori che desidera esternalizzare, piuttosto che cerca un supporto esterno in determinati momenti alto carico lavorativo, sono disponibile a valutare una collaborazione (contattatemi attraverso LinkedIn).

Sul mio sito troverete varie sezioni tra cui: Chi sono, Articoli, Progetti, Portfoglio, etc. Per alcuni articoli esistono anche delle live demo, ed il link al progetto su GitHub. Se interessa seguire i link: Vai alla demo del progetto, Vai al progetto su GitHub.

introduzione angular typescript

Una cosa che contraddistingue il web fin dalle origini è che ad ogni aggiornamento dei contenuti mostrati nel browser la pagina venga nuovamente ricaricata, con grande fastidio per l’utente. Con l’avvento della tecnologia AJAX lo scenario è cambiato, infatti la pagina viene scaricata solo una volta all’inizio, poi eventuali aggiornamenti di porzioni di pagina avvengono tramite chiamate JavaScript / JQuery. Questo ha fatto si che l’esperienza utente sia enormemente migliorata pur rimanendo in un contesto di “Multi-Page-Application”. Navigando su una nuova pagina è necessario ricaricare nuovamente la pagina desiderata.

L’evoluzione del web e la nascita di nuovi framework hanno portato alla nascita delle “Single-Page-Application”. Esiste un'unica pagina che contiene l’intera applicazione per cui viene scaricato tutto ciò che serve per funzionare. Poi attraverso un meccanismo di routing interno al browser si passa da una pagina all’altra senza richiedere più niente al server (o quasi). Infatti l’unica cosa che viene richiesta al server sono i dati da visualizzare che di solito vengono inviati al browser in formato json.

Le SPA stanno velocemente sostituendo le applicazioni desktop, infatti offrono molti vantaggi sia in termini di usabilità che di manutenibilità sebbene conservino le tipiche problematiche del web. Essendo erogata attraverso un browser una SPA non deve essere installata, il codice che viene eseguito nel browser può essere scritto con un linguaggio diverso dal codice che viene eseguito nel server.

Nello stesso tempo un’approccio simile richiede che la prima volta venga scaricata l’intera applicazione, per questo motivo il download potrebbe richiedere più tempo. Sul mercato esistono diversi framework per la creazione di applicazioni “Single-Page-Application” o SPA ed i più conosciuti sono: Angular, React, Vue. Io mi occupo di Angular per cui in questo breve articolo provo spiegare che cos’è Angular.

Angular (come già anticipato) è un framework per lo sviluppo di SPA a componenti. Quando si crea un applicazione (o anche un solo componente); il componente viene scritto in TypeScript, ed il relativo template in HTML utilizzando la template syntax (ngIf, ngFor, etc). All’interno del template possono poi essere presenti altri componenti / direttive piuttosto che tag speciali quali: ng-template, ng-container, ng-content, etc. Formando così una struttura ad albero.

Una cosa che non è pienamente evidente a molti sviluppatori è che questo codice HTML non arriverà mai al browser così come è stato scritto. Infatti tutti i bundle generati sono bundle JavaScript, non c’è traccia di file HTML (stesso discorso per i CSS). In Angular oltre al compilatore TypeScript è presente un altro compilatore che compila il template HTML in istruzioni JavaScript. Mediante queste istruzioni a runtime è possibile creare gli elementi del DOM; piuttosto che modificarli quando lo stato del componente cambia. Questo avviene grazie al meccanismo di binding che lega il templete HTML con il codice TypeScript presente nel file .ts.

In fase di progettazione è necessario quindi, scomporre la UI che desideriamo costruire in sotto componenti che svolgono una specifica funzione. Questo facilità in seguito eventuali modifiche oltre al riutilizzo del codice.

A questo link potete trovare i miei articoli su LinkedIn

A questo link potete trovare i miei articoli su Medium

Consulente freelance: Full-Stack
Linguaggi: C#, CSS, HTML, TypeScript / JavaScript, SQL
Framework: Angular, ASP.NET / WebForm, ASP.NET / MVC, JQuery, Knockout.js, rxjs
DataBase: Entity Framework, Microsoft SqlServer

Se desiderate contattarmi potete mandarmi un messaggio tramite LinkedIn