Chi sono
Entusiasmo, tecnologia e innovazione rispecchiano la mia personalità. Svolgo l'attivita' di sviluppatore web freelance / programmatore web freelance: Angular, .Net, C#. Dal 2000 mi interesso a tutto cio' che ruota intorno al web, prima con asp poi con asp.net (ASP.NET WebForm / ASP.NET MVC). Utilizzo ASP.NET MVC CORE fin dalla prima versione. Sono di Torino ma opero da remoto in qualsiasi luogo in Italia.

La mia attenzione e' principalmente rivolta ad asp.net mvc ed ai vari modi di poter integrare con esso: ajax, html5, css3, bootstrap, javascript, typescript, jquery, knockout.js, etc... Attualmente mi sto dedicando allo sviluppo di SPA utilizzando Angular e TypeScript. Essendo uno sviluppatore web fullstack (frontend / backend) ai seguenti link provo ad introdurre le tecnologie che maggiormente uso lato client e lato server: Introduzione ad Angular - Introduzione ad ASP.NET MVC Core.

Ho sviluppato sia applicazioni-web che portali di e-commerce in una logica full responsive utilizzando bootstrap, considerando anche l'aspetto delle webperformance e del tempo di caricamento delle pagine. In particolar modo degli ultimi anni mi sono occupato della realizzazione di e-commerce di pneumatici per auto, del relativo back-end per l'elaborazione degli ordini e di applicazioni di vario genere di supporto per questo settore. Ho realizzato anche e-commerce di autoricambi / motoricambi (da veicoli in demolizione). Nel settore dell'Editoria ho realizzato estensioni web al gestionale (contabilità, magazzino, diritti d'autore, volumi), oltre ad applicazioni web per agenti e distributori.

Se non lavoro all'interno di un team, mi occupo dell'analisi, dell'architettura e dello sviluppo, cercando di utilizzare le tecnologie più adatte al progetto. Valuto inoltre i benefici dei design patterns per ottenere codice disaccoppiato (solid principles).

Oggi le tecnologie sono così presenti e pervasive nella vita di tutti noi, che l’esercizio di individuazione delle tendenze diventa non solo naturale e intrigante, ma necessario. Essendo di Torino partecipo inoltre alle attivita' di Torino Technologies Group; la community locale che organizza incontri per chi sviluppa soluzioni usando tecnologie Microsoft (e non solo).

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).

Su questo sito troverete varie sezioni tra cui: articoli, progetti, portfolio, 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.

Maggiori informazioni nel mio profilo su LinkedIn (click qui)
Sviluppatore freelance: Full-Stack (Front-End / Back-End)
Linguaggi: C#, CSS, HTML, TypeScript / JavaScript, SQL
Framework: Angular, Blazor, ASP.NET WebForm, ASP.NET MVC, JQuery, Knockout.js, rxjs
DataBase: Entity Framework, Microsoft SqlServer





 
Articoli
In questa sezione troverete alcuni articoli scritti da me. Alcuni di essi hanno anche un progetto GitHub associato che è possibile scaricare al seguente link (clicca qui) oppure guardare nella sezione progetti sottostante.

Angular è un framework per lo sviluppo di SPA a componenti. Di solito un componente è composto da 3 files: un file .ts , un file .css e un file .html che contiene il template HTML del componente, ma volendo è anche possibile definire tutto in un unico file .ts, sarà responsabilità dello sviluppatore scegliere l’approccio che preferisce.

Nella prima parte di quest’articolo abbiamo introdotto il concetto di data binding e dei modi che abbiamo di implementarlo in Angular: Iterpolation, Property binding, Event binding, TwoWay binding. In questa seconda parte continuiamo il discorso sul’ “Angular Component Communication” e parleremo dei decoratori di

Una “Template Reference Variable” è una referenza ad un elemento all’interno in un template HTML, e con elemento si intende sia un semplice elemento HTML che un altro componente o direttiva presente nel template HTML. Nel primo caso avremo una referenza ad un elemento del DOM (ed il tipo associato è ElementRef) nel secondo

Angular è un framework per sviluppare SPA a componenti. Ogni elemento che vediamo nella UI è un componente ed un componente a sua volta può essere inserito all’interno di un altro componente formando una struttura ad albero. Le projection sono un concetto molto importante in Angular, e servono a creare componenti scalabili

In un ottica web un developer è abituato a manipolare il DOM in un certo modo. Per esempio, creando lato client del codice HTML per poi inserirlo nel DOM tramite delle API JQuery, piuttosto che fare una chiamata AJAX che ci restituisca del codice HTML. Esiste poi l’opzione di far ritornare dati in formato JSON che verranno

Nell’articolo “Come manipolare il DOM da un applicazione Angular” abbiamo visto come è possibile inserire / rimuovere elementi dal DOM in modo sicuro da un’applicazione Angular. In quest’articolo continuiamo il discorso iniziato allora, e vedremo come creare un “overlay”.

In Angular esistono diverse tecniche per la gestione dello stato; Redux è una di queste ma non è però adatto a tutti gli scenari, infatti semplifica il lavoro nel caso ci troviamo ad operare con architetture complesse, ma lo complica nel caso ci troviamo ad operare con architetture semplici.

Supponiamo ora di voler sviluppare un applicazione Angular che riceva delle notifiche in tempo reale dal server; i dati utilizzati dal server per fare il push ai client potranno poi arrivare da svariate fonti (per esempio device IOT). In un architettura simile il server invierà i dati sotto forma di notifiche push al client

JavaScript è un linguaggio di scripting orientato agli oggetti ed è presente in tutti i browser. Il problema è che non tutti i browser utilizzano (o sono allineati) con la stessa versione di JavaScript, per questo motivo alcune feature introdotte di recente possono non essere presenti.

In Angular, 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

In Angular, oltre agli errori di compilazione abbiamo anche gli errori runtime che possiamo vedere all’interno della console del browser (tanto per capirci quella a cui si accede tramite F12).Tra gli errori possibili ne esiste uno che è difficile da interpretare, in particolar

Un volta pensavo che fosse difficile fare WebPerformance per avere tutti gli indicatori in verde con un buon punteggio. Poi mi sono trovato a studiare AMP (Accelerated Mobile Pages), il framework di Google per rendere veloce un sito web (anche se non è oggetto di

In Angular o più in generale nel web, con Lazy Loading (caricamento pigro) si intende il download di uno script on demand, ovvero solamente quando è effettivamente necessario per il prosieguo dell’applicazione, per esempio quando viene richiamata una determinata

ASP.NET Core è la nuova versione del framework di Microsoft. Ciò che lo differenzia dal predecessore è che ora non è più legato ad un server Windows, ma bensì può anche essere installato su macchine Linux o Mac. Per questo motivo è stata necessaria una completa

In ASP.NET MVC ogni richiesta è indirizzata ad un appropriato controller / action, tuttavia ci sono circostanze in cui vogliamo eseguire qualche logica prima e dopo che una action venga invocata. I filtri forniscono appunto questa possibilità! Prima di continuare è doveroso

L’obiettivo del presente articolo e spiegare la differenza tra l’injectors “providers” e l’injectors “viewProviders”, pertanto si presuppone che il lettore abbia già una conoscenza di base del meccanismo di dependency injection presente in Angular. Tramite la dependency

HTML5 è uno standard e il W3C ne finalizza le specifiche, l’ HTML5 rappresenta inoltre la base per l’Open Web Platform e si propone come uno strumento riconosciuto da tutti i produttori software e di device. Grazie a questo non è più necessario identificare il device

Angular è un framework a 360 gradi, per questo motivo al suo interno ha tutto ciò che serve per creare un applicazione, al contrario di altre librerie in cui per fare una determinata cosa è necessario installare un package di terze parti. Per questo motivo tra i vari

Da che mondo è mondo qualsiasi applicazione in determinate circostanze può scatenare degli errori, in sviluppo non ci sono problemi perché il developer li vede e provvede, al contrario se l’applicazione è in produzione abbiamo la certezza che fallisca silenziosamente.

Il “sottosistema Windows per Linux” (o wsl) consente agli sviluppatori di eseguire un ambiente Linux all’interno di Windows, questo ambiente include la maggior parte delle applicazioni e degli strumenti da riga di comando presenti in Linux, il tutto senza il sovraccarico

Spesso ci troviamo a dover visualizzare un elenco di dati, indipendentemente dal fatto che ciò avvenga in un contesto web piuttosto che in un applicazione mobile nativa potremmo incorrere in questo problema. “finchè i dati sono pochi l’applicazione riesce a visualizzarli

Nel precedente articolo abbiamo visto come creare un virtual scroll utilizzando i componenti “cdk-virtual-scroll-viewport” e “*cdkVirtualFor” presenti nell’ “Angular Material CDK”. In questo articolo vedremo come estendere la cosa in modo da ottenere un “infinite”

Lo scopo del pattern MVC è separare un’applicazione in tre macro aree principali : Model, View e Controller. Utilizzando questa architettura le richieste degli utenti vengono instradate ad un Controller (in base alle regole di routing) ,il quale è responsabile

In quest’articolo vedremo alcuni metodi per annullare l'iscrizione ad un Observable in un applicazione Angular. Prima di continuare però, facciamo un piccolo recall sul funzionamento degli Observable. Nella programmazione “reattiva” vengono usati termini quali

Quando abbiamo la necessità di visualizzare i dati emessi da un Observable all’interno di un template HTML abbiamo 2 possibilità. 1) Effettuare il Subscribe() dell’Observable e memorizzare il risultato all’interno di una variabile che verrà poi messa in binding nel template HTML.

Blazor è il nuovo framework sviluppato da Microsoft per la creazione di single page application, la cosa che lo contraddistingue rispetto agli altri framework è che non utilizza TypeScript/JavaScript, ma WASM ed i WebAssembly (la versione server invece utilizza SignalR).

Angular mette a disposizione 3 controlli mediante i quali è possibile definire un form: FormGroup, FormArray, FormControl. A seconda poi che stiamo lavorando con un "template driven form" piuttosto che un "reactive form", Angular fornisce delle direttive opportune

Angular è un “framework per lo sviluppo di applicazioni web” più comunemente dette SPA; ed in rete è possibile trovare molto materiale al riguardo, tra cui tutorial e video corsi. Con questo materiale, oltre ad apprendere i concetti base del framework e delle API, un developer trova piccoli esempi di codice tramite i quali può

Nel precedente articolo abbiamo visto che sono presenti 3 componenti principali: app-calendar”, “app-calendarnavbar”, “app-reservation”. “App-calendar” è il contenitore del calendario, ed al suo interno troviamo “app-calendarnavbar” che implementa la barra di navigazione con i bottoni e le combobox. Sotto alla barra di navigazione,

Nel precedenti articolo abbiamo visto che sono presenti 3 componenti principali: app-calendar”, “app-calendarnavbar”, “app-reservation”. “App-calendar” è il contenitore del calendario, ed al suo interno troviamo “app-calendarnavbar” che implementa la barra di navigazione con i bottoni e le combobox. Sotto alla barra di navigazione, nel

Angular è un framework per lo sviluppo di SPA a componenti, inoltre se utilizzato con IONIC sarà possibile sviluppare anche applicazioni mobile cross-platform. Quando ci apprestiamo a realizzare un applicazione di questo tipo dobbiamo innanzi tutto chiederci cosa vogliamo fare, dopodiché abbiamo bisogno di dati.

Alzi la mano chi tra voi si é imbattuto per lo meno una volta in quest’errore? Un nome così lungo, quando arrivi al fondo non ti ricordi più cosa c’era scritto all’inizio. A quel punto hai pensato: “Cosa caspita è successo?” Bene, l’ obbiettivo del presente articolo è spiegare le cause del famigerato errore

In un applicazione Angular il rilevamento delle modifiche rappresenta uno dei pilastri fondamentali; essendo poi Angular un framework a componenti, ogni componente avrà la propria “change-detection” formando così una struttura ad albero. Il rilevamento delle modifiche (o change-detection) viaggia

ASP.NET MVC Core è la nuova versione del framework di Microsoft. Visto che l’obbiettivo principale di Microsoft creare un prodotto che non fosse più legato a un server Windows, è stata necessaria una completa riscrittura per eliminare ogni dipendenza dal server sottostante.

JavaScript è un linguaggio single-thread, per questo motivo siamo costretti a fare certe operazioni in modo asincrono per non bloccare la UI, un esempio fra tutti le operazioni Ajax. Infatti in tutti questi casi come parametro ad un metodo viene anche passata una

Con la versione ES8 sono state introdotte le keywords “async” e “await”, queste keywords rendono ancora più semplice la gestione di operazioni asincrone utilizzando le Promise di JavaScript.Ma procediamo per gradi. Prima dell’avvento delle Promise le

Angular Ivy ha portato con se molte novità e miglioramenti; tra questi possiamo trovare: minore peso dei bundle generati ed un uso maggiore del tree-shaking, ottimizzazioni nel processo di compilazione, nuovi modi per effettuare il debug.

ASP.NET MVC Core è la nuova versione del framework di Microsoft per costruire applicazioni usando il design pattern Model-View-Controller. Lo scopo di questo pattern è separare un’applicazione in tre macro aree principali : Model, View e Controller.

 
Progetti
E' possibile scaricare tutti i progetti in questa sezione andando su GitHub al seguente link (clicca qui) oppure guardare il corrispondente link sotto l'imagine del progetto.

Angular calendar appointments

Questo è un progetto demo che mostra come creare un Angular component per appuntamenti (è posibile guardare un video su youtube che scaricare il progetto da GitHub - vedi i link sotto)

Angular hotel bookings

Questo è un progetto demo che mostra come creare un Angular component per hotel bookings (è posibile guardare un video su youtube che scaricare il progetto da GitHub - vedi i link sotto)

Applicazione Angular che utilizza gli OpenData forniti dal Comune di Torino

Questo è un progetto demo che illustra come creare un applicazione di mappe che utilizza gli OpenData forniti dal geoportale del Comune di Torino. In particolare vengono utilizzati servizi WMS o WFS che forniscono: 1) Catasto urbano 2) Particelle fabbricati 3) Aree verdi 4) Cimiteri 5) Impianti sportivi 6) Mercati 7) Aberate 8) Ospedali 9) Farmacie. Maggiori sul geoportale del Comune di Torino.
sviluppatore angular asp.net - github demo openlayer opendata comune torino 1
programmatore angular asp.net - github demo openlayer opendata comune torino 2
sviluppatore angular asp.net - github demo openlayer opendata comune torino 3

Angular BehaviorSubject and Material CDK overlay and

Questo è un progetto demo che mostra come creare un BehaviorSubject e un overlay utilizzando Angular Material CDK
programmatore angular asp.net - github demo signalr

Angular Chart.js

Questo è un progetto demo che mostra come integrare in Angular Chart.js
sviluppatore angular asp.net - github demo chartjs

Angular DynamicComponent

Questo è un progetto demo che mostra come creare un form dinamico
programmatore angular asp.net - github demo dynamic form

Angular InfiniteVirtualScroll

Questo è un progetto demo che mostra come creare lista infinite virtual scroll
sviluppatore angular asp.net - github demo infinitescroll

Angular LoadDynamicModule

Questo è un progetto demo che mostra come caricare in modo dinamico componenti e moduli
sviluppatore angular asp.net - github demo loaddynamicmodule
 
Portfoglio
Quì sotto troverete un'elenco di lavori da me svolti o a cui ho partecipato.

Gomme Miglior Prezzo

Gomme John Pitstop

Web Pneumatici

Gomma Moto

Pneuzilla

Auto Ricambi Service

Moto Ricambi Service

 
Windows10 app

GPX viewer and recorder

Con quest' app è possibile visualizzare file gpx (percorsi, tracce, punti di interesse) su un pc windows 10. Permette inoltre di importare / esportare un file locale (percorso traccia) nella cartella documenti del device.
 
Contatti
Stefano Marchisio - Torino - per contattarmi mandatemi un messaggio tramite LinkedIn (clicca sotto)