Pragmatic Serverless Azure: SPAs, Microservices & gRPC with .NET

Building & running modern business applications – with less tedious tasks, and less infrastructure needs: this is what a .NET developer strives for. In this session, Christian shows a pragmatic way of creating distributed web- and cloud-based applications with a serverless mindset. Join and see how to use C# for building both, APIs & services as well as web-based SPAs, with ASP.NET Core gRPC services and Blazor WebAssembly clients, all running serverless. Developer productivity where it belongs: one programming language (with your favorite IDE!). Strongly typed client-server communication (IntelliSense, yay!). No servers, no clusters (Serverless, FTW!). Too good to be true? Let’s see.

Transcript

1. Pragmatic Serverless Azure: SPAs, Microservices & gRPC with .NET Christian Weyer https://thinktecture.com/christian-weyer @christianweyer Co-Founder & CTO
2. 2 Pragmatic Serverless Azure SPAs, Microservices & gRPC with .NET § Co-Founder & CTO at Thinktecture AG § Personal focus on § Mobile & web-based application architectures § Interoperability, cross-device § Pragmatic end-to-end solutions § Cloud-native & serverless architectures § Independent Microsoft Regional Director § Microsoft MVP for Developer Technologies & Azure ASPInsider, AzureInsider § Google GDE for Web Technologies, Angular christian.weyer@thinktecture.com @christianweyer https://www.thinktecture.com Christian Weyer
3. 3 § Server-side [micro]services with APIs § Written in C# with .NET § Exposing Web APIs § Web-based clients § JavaScript-based SPAs § Communication via HTTP § Running on-prem, hosted, or in public Cloud § With or without containers § Infrastructure-focused Pragmatic Serverless Azure SPAs, Microservices & gRPC with .NET Typical SPA architectures for modern business applications HTTP API WS API Service D HTTPS HTTPS WebSocket Service A Service B Service C HTTP API
4. 4 § Building SPAs end-to-end § Often too complex, with different stacks → Improving needed knowledge & coding habits § SPA communication with server-side APIs/services § Thinking different in controlled environments → Improving the inner loop § SPA hosting in a serverless environment § Container-based development, deployment & operation → Improving the outer loop Pragmatic Serverless Azure SPAs, Microservices & gRPC with .NET Reconsidering SPA architectures – in a pragmatic way Increased developer productivity (in controlled environments)
5. 5 Pragmatic Serverless Azure SPAs, Microservices & gRPC with .NET Three pillars One programming language & framework Strongly typed client-server communication No servers, no clusters
6. 6 Pragmatic Serverless Azure SPAs, Microservices & gRPC with .NET Three pillars One programming language & framework Strongly typed client-server communication No servers, no clusters
7. 7 § Users want: § Cross-Platform, Cross-Device § No installations § Offline (important for many use cases) § Developers think: § Web is the solution, but web is different § SPA is the solution, but SPA is different § JavaScript seems to be an issue for lots of .NET developers § There is existing .NET code, what to do about it? § Which technologies to choose? § JavaScript, everywhere? C# & .NET everywhere? § In the Frontend: Can Blazor help here? Pragmatic Serverless Azure SPAs, Microservices & gRPC with .NET C# & .NET everywhere?
8. 8 § Blazor is a family of web technologies § Server § WebAssembly § Blazor WebAssembly is a SPA framework § Web, SPA & distributed computing knowledge § HTML, CSS knowledge § DOM knowledge § JavaScript for DOM interaction & 3rd party integration § C# & .NET Standard for client-side logic → Full-stack C# possible Pragmatic Serverless Azure SPAs, Microservices & gRPC with .NET What is Blazor? Mono-based Runtime .NET CLR .NET 6 .NET Framework Blazor WebAssembly Blazor Server Razor Components Browser (WASM / .NET / JS) Browser (JS Stub) Server (.NET)
9. 9 Pragmatic Serverless Azure SPAs, Microservices & gRPC with .NET WebAssembly browser support https://caniuse.com/#feat=wasm
10. 10 Pragmatic Serverless Azure SPAs, Microservices & gRPC with .NET Blazor WebAssembly in the browser Blazor DOM Web Assembly .NET Razor Components
11. 11 Pragmatic Serverless Azure SPAs, Microservices & gRPC with .NET Three pillars One programming language & framework Strongly typed client-server communication No servers, no clusters
12. § JSON major data exchange format § Great tooling § Can handle arbitrary binary data § Highly interoperable § RPC-ish in many cases § JSON text format can be verbose § Compression is usually a must § Not every MEP can be easily implemented § Loosely typed § Open API can help here Pragmatic Serverless Azure SPAs, Microservices & gRPC with .NET Reconsidering Web APIs as service interfaces § Let’s just call them Web APIs (RPC-ish, REST etc.)
13. 13 § In Web Services world, we did a lot of contract-first (XSD, WSDL) § In Web API world, we do a lot of code-first (OpenAPI showed up later) Pragmatic Serverless Azure SPAs, Microservices & gRPC with .NET Service interface modeling: Code-First vs. Contract-First § Code-First § Agile, by writing platform code § Contract gets derived or generated from code § May not lead to highest interoperability § Contract-First § Specification before implementation § Platform code gets generated from contract description § Formal way to ensure highest interoperability
14. 14 § Initially created for synchronous [micro]service-to- [micro]service communication § WCF, anyone? § Its presence increases steadily § Some people like to use gRPC between frontends and backends, as well § Uses HTTP/2 & Protocol Buffers § gRPC is contract-first Pragmatic Serverless Azure SPAs, Microservices & gRPC with .NET gRPC
15. 15 Pragmatic Serverless Azure SPAs, Microservices & gRPC with .NET ProtoBuf (Protocol Buffers) § Language-neutral, platform-neutral, extensible mechanism for describing & serializing structured data § Like XML/XSD, but smaller, faster, and partly simpler § Uses integer tokens to identify members, not names § Support for code generation for many languages, including C# § Also: Binary representation on the wire message Person { required string name = 1; required int32 id = 2; optional string email = 3; }
16. 16 § .NET supports gRPC since .NET Core 3.0 § Contract-First: You need a .proto file first § C# code gets generated when the .proto file changes § “Add Service Reference…” in VS can handle the client side for you § Implement gRPC service based on generated base class § Get typed client proxy generated on the client side based Pragmatic Serverless Azure SPAs, Microservices & gRPC with .NET Contract-First gRPC in .NET
17. 17 § Browsers are the de-facto frontend platform today § Native gRPC does not work in browsers (due to restrictions for HTTP/2 framing in browsers) § gRPC-Web is implementation of gRPC for browser clients § gRPC-Web clients connect to gRPC services via a gRPC-Web proxy § .NET offers § Server-side middleware for proxy § Client library (beyond JavaScript) § Unary calls & server-streaming supported Pragmatic Serverless Azure SPAs, Microservices & gRPC with .NET gRPC-Web
18. 18 § We can have gRPC in .NET without having to write .proto files § Improving the inner loop § Open-source community project protobuf-net.Grpc § Builds on WCF contract semantics § ServiceContract, DataContract § Proto* attributes offer finer control § Implement gRPC service based on .NET interface § Get strongly-typed client proxy at runtime based on .NET interface, e.g., in Blazor Pragmatic Serverless Azure SPAs, Microservices & gRPC with .NET Code-First gRPC(-Web) in .NET & Blazor
19. 19 Pragmatic Serverless Azure SPAs, Microservices & gRPC with .NET Three pillars One programming language & framework Strongly typed client-server communication No servers, no clusters
20. 20 Serverless Programming Model (FaaS) § Event-driven § Stateless § Service-full Operational Model § Fully managed § Automatically scaling § Usage priced SPAs, Microservices & gRPC with .NET Pragmatic Serverless Azure
21. 21 § Containers provide a common set of interfaces and defined execution environment § Docker today § Maybe WebAssembly tomorrow § Containers homogenize the development, testing, and operation of applications § On-prem or in Cloud § Orchestrators like Kubernetes handle complex multi-container scenarios for high availability & high scale scenarios Pragmatic Serverless Azure SPAs, Microservices & gRPC with .NET Containers
22. 22 § No real serverless mode & pricing for Azure Kubernetes Service (AKS) § There is cluster autoscaling and other features, though § It’s hard to find, and hire people that really know Kubernetes § Kubernetes itself can become complex § Sometimes, Kubernetes is an overkill § In the end, we want to develop software solutions Pragmatic Serverless Azure SPAs, Microservices & gRPC with .NET Containers & orchestrators in Azure
23. Azure landscape for containers Azure Kubernetes Service Azure WebApps for Containers Azure Container Instances Azure Container Apps SPAs, Microservices & gRPC with .NET Pragmatic Serverless Azure
24. 24 § Serverless platform to run containerized applications § Charged on actual compute allocation (consumption) § Built on top of open-source projects § Kubernetes/AKS, KEDA, Envoy, Dapr § Hides most of Kubernetes/AKS complexity Pragmatic Serverless Azure SPAs, Microservices & gRPC with .NET Azure Container Apps (ACA)
25. 25 § Using GitHub Actions for building containers & deploying to ACA § Including new revisions Pragmatic Serverless Azure SPAs, Microservices & gRPC with .NET Serverless deployment to Azure Container Apps
26. 26 § SPA architectures reconsidered (in controlled scenarios) § Blazor WebAssembly gives us C# & .NET power for SPAs in the browser § ASP.NET Core gives us gRPC & gRPC-Web power for SPA-to-service communication § Azure Container Apps give us powerful serverless hosting & execution for container-based applications Pragmatic Serverless Azure SPAs, Microservices & gRPC with .NET Summary
27. Thank you! Christian Weyer https://thinktecture.com/christian-weyer @christianweyer christian.weyer@thinktecture.com Demo: https://github.com/thinktecture/blazor-wasm-grpc-code-first Blazor Knowledge Hub: https://www.thinktecture.com/de/asp-dotnet-core-blazor/ Articles about Blazor, PWA, Web Components, Angular, .NET Core & more: https://www.thinktecture.com/en/newsletter
28. 28 § ASP.NET Core Blazor § https://dotnet.microsoft.com/apps/aspnet/web-apps/blazor § Protocol Buffers § https://developers.google.com/protocol-buffers § gRPC § https://grpc.io/docs/what-is-grpc/introduction/ § https://grpc.io/docs/languages/csharp/basics/ § gRPC in .NET Core § https://docs.microsoft.com/en-us/aspnet/core/tutorials/grpc/grpc-start § gRPC-Web in .NET Core § https://docs.microsoft.com/en-us/aspnet/core/grpc/browser § gRPC Code-First in .NET Core § https://github.com/protobuf-net/protobuf-net.Grpc § All-the-things Azure Container Apps § https://www.thinktecture.com/de/azure/webinar-azure-container-apps/ Pragmatic Serverless Azure SPAs, Microservices & gRPC with .NET Resources