This week's Wednesday Evening Training: continuing our handson labs on Blazor (.NET web apps using WebAssembly that run in the browser)

This Wednesday Evening Training, we have continued our exploration of Blazor (and WebAssembly, and ASP.NET Core). In previous sessions, we already learned what WebAssembly is and we played around with the demo's and some handson labs. This evening, we continued our exploration.

So what was Blazor again?

Blazor is an experimental .NET web framework using C#, Razor and HTML that runs in the browser via WebAssembly. It runs in the browser on a real .NET runtime (Mono) implemented in WebAssembly that executes normal .NET assemblies. See the architecture below.

Why WebAssembly could be a game changer?

WebAssembly is a relative recent technology, but hopes are high that this technology will have a big impact on how we implement web applications, and even mobile apps. It offers an open, fast and securely executing assembly language standard, already supported by all major browsers (even mobile versions). There are also possibilities to run WebAssembly outside a browser, e.g. as an interpreted application. Programming languages can be compiled into WebAssembly (there already are quite a few compilers available at this moment) and distributed in your infrastructure. Imagine developing an application, web application, app or distributed application in your favorite programming language and IDE and let it run almost anywhere. WebAssembly could well be used for implementing applications' logic, data flow handling and compute-intensive applications.

I would not be surprised if JavaScript frameworks and libraries (for example for state management, data flow handling) will partly or completely be replaced by WebAssembly. The use of JavaScript (yes, also Angular 2+ applications now are simply executed in (compacted) JavaScript) will be drastically reduced. The latter will also appeal to the suppliers of cloud platforms and cloud services.

But maybe I am an extreme optimist. :)

Back to this evenings' training...

One of our .NET champions, Hans Harts, shared more of his prototypes with us. We got extensive code walkthroughs and lot's of opportunity for Q&A and discussion. We discussed a Blazor based game a to do list and a simple CRUD application. After this, we continued our labs to which some more labs were added.

There will certainly be a sequel to this session... to be continued... thanks Hans Harts for sharing your knowledge!

Further reading

Do you want to read more on WebAssembly, Blazor and ASP.NET Core? Here are some links...

For starters:
Learn Blazor: https://learn-blazor.com/
Introduction to Razor Pages in ASP.NET Core (you'll need that as well): https://docs.microsoft.com/en-us/aspnet/core/razor-pages/?view=aspnetcore-2.1&tabs=visual-studio
Blazor - GitHub: https://github.com/aspnet/Blazor
Get started building .NET web apps that run in the browser with Blazor: https://blogs.msdn.microsoft.com/webdev/2018/03/22/get-started-building-net-web-apps-in-the-browser-with-blazor/

As reference:
WebAssembly Core Specification - W3C First Public Working Draft, 15 February 2018: https://www.w3.org/TR/wasm-core/
WebAssembly Core Specification - Editor’s Draft, 24 June 2018: https://webassembly.github.io/spec/core/bikeshed/

For playing around with:
ASP.NET Core – CRUD Using Blazor And Entity Framework Core: http://ankitsharmablogs.com/asp-net-core-crud-using-blazor-and-entity-framework-core/
Blazor 0.4.0 experimental release now available: https://blogs.msdn.microsoft.com/webdev/2018/06/07/blazor-0-4-0-experimental-release-now-available/
ADarkBlazor - Build things with Resources (game using Blazor): https://github.com/Xciles/ADarkBlazor
ASP.NET Core: CRUD Using Blazor and Entity Framework Core: https://dzone.com/articles/aspnet-core-crud-using-blazor-and-entity-framework
and https://github.com/AnkitSharma-007/ASPCore.BlazorCrud

You can check my previous posts on WebAssembly and Blazor as well:
5/23/18 - This week's Wednesday Evening Training: building .NET web apps using WebAssembly that run in the browser with Blazor: https://hansrontheweb.blogspot.com/2018/05/this-weeks-wednesday-evening-training_23.html
1/24/18 - Today's Wednesday Evening Training: a coding night with multiple topics: http://hansrontheweb.blogspot.com/2018/01/todays-wednesday-evening-training.html
1/18/18 - WebAssembly: catch up with some reading work? https://hansrontheweb.blogspot.com/2018/01/webassembly-catch-up-with-some-reading_18.html

Past Wednesday Evening Trainings

You'll find post of previous sessions here: https://www.linkedin.com/search/results/content/?keywords=%23wednesdayeveningtraining

Next week

In next week's Wednesday Evening Training, we'll be continuing our exploration of IoT: Raspberry Pi, Arduino and Witty Cloud. Aishwarya Dhall will give us a nice demo on her multi sensor project and we will take a look at the Arduino create web editor with which I've played around a bit.


#capgemini #werkenbijcapgemini #lifeatcapgemini #wednesdayeveningtraining #webassembly #dotnetcore #blazor #microsoft #webdevelopment #csharp #visualstudio

This week's Wednesday Evening Training: building .NET web apps using WebAssembly that run in the browser with Blazor

This Wednesday Evening Training, we have continued our exploration of WebAssembly. In a previous sessions, we learned what WebAssembly is and how we can use it. Now, we continued our exploration using Blazor.

So what is Blazor anyway?

Blazor is an experimental .NET web framework using C#/Razor and HTML that runs in the browser via WebAssembly
Blazor uses only the latest web standards. No plugins or transpilation needed. It runs in the browser on a real .NET runtime (Mono) implemented in WebAssembly that executes normal .NET assemblies. It works in older browsers too by falling back to an asm.js based .NET runtime.
(source: https://github.com/aspnet/Blazor)

Some of us have already played around with WebAssembly and Blazor. Hans Harts and I have given an introduction and Hans shared his prototypes with us. Thanks Hans Harts, for this! There was a plenty of room for code walkthroughs, Q&A and lively discussion on the technology, possibilities and future of WebAssembly and Blazor. Since Blazor is build upon .NET Core and Razor, these topics were discussed extensively as well.

Handson labs

We also had time for handson activities. Hans and I had collected some handson lab and instruction material that we shared in the group. For starters: building a simple "Hello world" app and as a next step, a lab for building a simple Tetris-like game engine that runs in the browser. See the links below for the labs & documentation.
WebAssembly is a relative recent technology, but hopes are high that this technology will have a big impact on how we implement web applications, and even mobile apps.

There will certainly be a sequel to this session... to be continued!

Further reading

Do you want to read more on WebAssembly and Blazor? Here are some links...

Explanation and examples:
Blazor: a technical introduction - Deeper technical details about Blazor: http://blog.stevensanderson.com/2018/02/06/blazor-intro/
A new experiment: Browser-based web apps with .NET and Blazor: https://blogs.msdn.microsoft.com/webdev/2018/02/06/blazor-experimental-project/
Learn Blazor: https://learn-blazor.com/
Blazor - Samples: https://github.com/software-architects/learn-blazor/tree/master/samples
GitHub aspnet/Blazor - Blazor: https://github.com/aspnet/Blazor

Labs:
BlazorBricks - WebAssembly with Blazor: https://www.codeproject.com/Articles/1241210/WebAssembly-with-Blazor
BlazorBricks - WebAssembly with Blazor - Online demo: https://marcelooliveira.github.io/

Get started building .NET web apps that run in the browser with Blazor: https://blogs.msdn.microsoft.com/webdev/2018/03/22/get-started-building-net-web-apps-in-the-browser-with-blazor/

Past Wednesday Evening Trainings

You'll find post of previous sessions here: https://www.linkedin.com/search/results/content/?keywords=%23wednesdayeveningtraining

Next week

In next week's Wednesday Evening Training, we'll be taking a deep dive in Web servers. In this "how stuff works" session we will discuss the technology of several web servers, like Tomcat, IIS, Kestrel and HTTP.sys. In such sessions, we usually use the entire wall-filling whiteboard sketching :). We'll take a look at the platform architecture, the way in which requests are processed, security, scaling, threading et cetera. Bart van Beek and I will prepare this session.



#capgemini #werkenbijcapgemini #lifeatcapgemini #wednesdayeveningtraining #webassembly #dotnetcore #blazor #microsoft #webdevelopment #csharp #visualstudio