Introduzione

Blazor WebAssembly è un framework SPA (Single Page Application) open source sviluppato da Microsoft per la creazione di applicazioni web UI lato client, basate su .NET e sul linguaggio di programmazione C# anziché su JavaScript.

Vantaggi

• Può essere eseguito direttamente nel browser.
• Non sono richiesti plug-in per il browser.
• Funziona in tutti i moderni browser web, compresi quelli mobili.

• Può essere distribuito su un server di pagine statiche (ad esempio Github Pages o Surge).

• Richiede una conoscenza minima o nulla di JavaScript per costruire un sito web quindi è ideale per chi sviluppa applicazioni desktop in C# e vuole dedicarsi allo sviluppo web.

• Conversione PWA integrata.

• Compatibile con le librerie JavaScript esistenti.

Svantaggi

• Il download di un'applicazione di grandi dimensioni in un browser richiede un certo tempo perché il runtime .NET e gli assembly vengono scaricati e memorizzati nella cache del browser, il che può influire sull'esperienza dell'utente.

Creazione di un'applicazione Blazor WebAssembly

Questo progetto sarà realizzato con VisualStudioCode.

Prerequisiti:

• È richiesta la conoscenza dei linguaggi di programmazione C#, Html e CSS.

• .NET SDK deve essere installato. Consultare questa guida per installare l'SDK.

• per sviluppare in C# in VisualStudioCode, deve essere installata l'estensione C# (normalmente l'editor propone di installarla quando si apre un file C#); per installare le estensioni di VisualStudioCode nel VS Code Extension Marketplace consultare questa guida..

Seguire la procedura descritta di seguito:

1. Selezionare dal menù principale File → Apri cartella.

2. Nella finestra di dialogo Apri cartella creare una cartella TestBlazorApp e selezionarla.

3. Fare quindi clic su Aprire. Per impostazione predefinita il nome della cartella diventerà il nome e il namespace del progetto.

4. Nel terminale eseguire il seguente comando:

   dotnet new blazorwasm

   Verranno creati tutti i file del progetto. Convalidare tutte le richieste di VisualStudioCode per installare le estensioni mancanti.

5. Per avviare l'applicazione, eseguire il seguente comando:

   dotnet run

   Nel terminale vengono visualizzate le seguenti righe

   Génération...
   info: Microsoft.Hosting.Lifetime[14]
         Now listening on: https://localhost:7166
   info: Microsoft.Hosting.Lifetime[14]
         Now listening on: http://localhost:5214
   info: Microsoft.Hosting.Lifetime[0]
         Application started. Press Ctrl+C to shut down.

6. Fare Ctrl + Clic sul link http://localhost:5214. La pagina web viene aperta nel browser:

   • Blazor_1.png

   Se si fa clic sul collegamento https, viene visualizzato un errore di certificato. Si dovranno seguire le istruzioni visualizzate nel terminale per creare un nuovo certificato e, se necessario, seguire i link indicati per applicare le procedure. Con alcuni browser questo non sarà sufficiente e la pagina sarà sempre considerata non sicura.

   Nella barra laterale sinistra si possono consultare altre due pagine: Counter et Fetch data. Alcune spiegazioni sulla pagina Counter in questo paragrafo

7. Fare Ctrl + C per finire.

Analisi della pagina Counter

Ulteriori risorse

• Presentazione di Blazor

• Sito ufficiale

• Risorse per blazor

CategoryNuoviDocumenti