Blazor allows us to write code in C# that will run on your browser. No need to panic, this is not Silverlight. :) The generated WebAssembly can be stored on an Azure Storage, instead of a server which processes requests, which on the one hand can save money and on the other hand, server a large amount of users. For the backend, to leverage the serverless concept, Azure Functions can provide some easy to write endpoints, which will allow us to have a fully serverless WebApp with a functioning backend.

1. @AlexPshul
Blazor and Azure Function
Serverless Websites
Alex Pshul
Software Architect & Consultant
@AlexPshul
alex@pshul.com
http://pshul.com
http://codevalue.net

2. @AlexPshul
https://...
JS

3. @AlexPshul
Standard Web App Architecture

4. @AlexPshul
About Me
Alex Pshul
 Architect, Consultant and lecturer
 More than 9 years of hands on experience
 Talk to me about:
 Software Development
 Hardware and Gadgets
 Gaming
 Animals

5. @AlexPshul
Blazor
Run C# in the browser

6. @AlexPshul
Blazor
 Build client-side web UI with .NET instead of JavaScript
 Write reusable web UI components with C# and Razor
 Share .NET code with both the client and the server
 Call into JavaScript libraries & browser APIs as needed
.NET

7. @AlexPshul
How Blazor WebAssembly works
https://...
DOM
Razor Components
.NET
WebAssembly

8. @AlexPshul
Blazor – Client vs Server
Blazor WebAssembly Blazor Server
https://...
DOM
Razor Components
.NET
WebAssembly
https...
DOM
.NET Core
SignalR
Razor Components
.NET
.NET Core 3.0May 2020

9. @AlexPshul
Blazor – Client vs Server
Blazor WebAssembly
 Pro:
 True SPA, full interactivity
 Utilize client resources
 Supports offline, static sites,
PWA scenarios
 Con:
 Larger download size
 Requires WebAssembly
 Still in preview
 Pro:
 Smaller download size, faster load time
 Running on fully featured .NET runtime
 Code never leaves the server
 Simplified architecture
 Con:
 Latency
 No offline support
 Consumes more server resources
.NET Core 3.0May 2020
Blazor Server

10. @AlexPshul
Get started with Blazor
 Go to https://blazor.net
 Install .NET Core 3.0
 Install the Blazor WebAssembly template (Requires .NET Core 3.1 preview)
 dotnet new -i Microsoft.AspNetCore.Blazor.Templates::3.1.0-preview1.19508.20
 (Windows) Install Visual Studio 2019 16.3
 (Mac/Linux) Install Visual Studio Code with the C# extension

11. @AlexPshul
Azure Functions
Functions as a Service

12. @AlexPshul
Compute - FaaS
 FaaS – Function as a Service
 First mentioned by D. J. Wheeler in 1952- ‘The use of sub-routines in programmes’.
 Event-Driven serverless compute

13. @AlexPshul
FaaS – Azure Functions
 Trigger Oriented
 Input & Output Binding
 Dependency Injection
 Tackle Cold-Start performance hits by leaving host loaded
 Timer “Hack”
 Premium Plan
 AppService Plan
 Supports several frameworks and languages
 C#, JavaScript, Java, Python, F#, PowerShell & TypeScript

14. @AlexPshul
FaaS – Azure Functions

15. @AlexPshul
FaaS – Azure Functions
[FunctionName("EchoFunc")]
public static Task<IActionResult> EchoFunc(
[HttpTrigger(AuthorizationLevel.Anonymous, "get")]
HttpRequest request,
ILogger log)
{
string message = request.Query["message"];
//Do Something
var result = new OkObjectResult($"Message received: {message}");
return Task.FromResult((IActionResult) result);
}

16. @AlexPshul
FaaS – Azure Functions - Deployment
 Different ways to deploy your functions
 Visual Studio
 Using FTP
 Uploading a zip
 Continues deployment
 GitHub
 Dropbox
 Azure DevOps
 More…

17. @AlexPshul
Serverless Website
Using only C# language

18. @AlexPshul
Standard Web App Architecture

19. @AlexPshul
Standard Web App Architecture

20. @AlexPshul
Serverless Web App Architecture

21. @AlexPshul
Serverless Web App Architecture

22. @AlexPshul
Serverless Web App Architecture

23. @AlexPshul
Demo
Serverless Website
from scratch

24. @AlexPshul
Summary

25. @AlexPshul
Summary
 You can write C# based Web Apps again! Blazor FTW!
 Server based (Already available)
 WebAssembly based (In Preview)
 WebAssembly based Web Apps can be hosted on a storage
 Serverless Web App
 Scales for requests
 No payment for computing
 Serverless Backend
 No need to maintain
 Fast and easy to deploy

26. Alex Pshul
Software Architect & Consultant
@AlexPshul
alex@pshul.com
http://pshul.com
http://codevalue.net