Become a .NET & Blazor expert with weekly tutorials featuring best practices and the latest improvements, right in your inbox.
.NET 8 Blazorš„All Render Modes (SSR, Server, WebAssembly, Auto) Explained for Beginners
Hey Reader,
This week, let's dive deep into the world of Blazor, specifically the render modes in .NET 8. There's a lot of buzz and a bit of confusion around this, so let's clear the air.
š„ All Render Modes of Blazor in a Video
Below is a crisp 20-minute guide on Blazor SSR (Static Server-Side Rendering), Blazor Server, WebAssembly, and the intriguing Auto Render Mode. Dive in and enjoy!
š» Quick Recap
Short on time? Don't sweat it! Here are the essential nuggets about the render modes. Firstly, to tap into the power of all render modes, start by setting up a Blazor Web App project. Opt for WebAssembly or Auto for the "Interactive render mode" during setup. This gives you a head start with two projects (server and client) ready to roll.
Keep an eye on two crucial lines in the Program.cs file. If you're configuring your app to switch from no render mode or just the Server render mode, you'll need these lines:
Note: In my example, "MyButton" is a component of the client project. You can replace it with any component of your choice. Typically, the "Counter" class is used in template examples.
No client project yet? No worries. Use the Blazor WebAssembly Standalone App template to set one up. Remember to link it as a project reference to the server project and include the NuGet package Microsoft.AspNetCore.Components.WebAssembly.Server.
With this setup, you're all set to explore every render mode. Just remember to place any component or page you want to use with WebAssembly or Auto render mode in the client project. It's a key step.
Also, don't forget to add the @rendermode directive. You can place it at the top of a page or component, or tailor it for each component's use.
Hereās how you do it for an entire page:
And for an individual component:
Got questions or need more clarity? Just hit reply to this email, and I'll eagerly whip up more video tutorials to help you out.
A big shoutout to our fantastic community, and a heartfelt thanks to my Patrons for your incredible support. You're the rockstars of this newsletter and my channel.
Can't wait to see what we'll achieve together this year. Stay safe, and remember, the joy is in the coding! š»
Take care,
Patrick
Patrick God
Become a .NET & Blazor expert with weekly tutorials featuring best practices and the latest improvements, right in your inbox.
Hey Reader, Last week, I tested GPT-5 Agent Mode on .NET and Blazor apps, and the results were surprising. This week, I went a step further. I used GitHub Copilot inside Visual Studio and asked it to create real .NET and Blazor projects for me. Hereās what happened: Copilot generated a working calculator app in C#. It built a Web API that responded with āHello GPT-5 Agents.ā It even created a Blazor app with extra features like a reset button, a plus five counter, and a weather API. Were...
Hey Reader, I just published a new video where I put GPT-5ās Agent Mode to the test. š Instead of asking it for something simple, I went all in: A .NET 9 console app calculator A Web API with endpoints and docs A Blazor Server app with extra counter buttons And even a Blazor app that calls a public weather API š„ Watch it now: In the video, I didnāt just type āmake me an appā and hope for the best. I gave GPT-5 very specific prompts, like: āPlease create a .NET 9 console application that works...
Hey Reader, Iām back! š Iāve been on parental leave for the past 2 months, enjoying time with the family. Now Iām diving back into videos and hereās the first one! š„ Watch it now: Hereās the TL;DR if you canāt click right now: AI can already write code, fix bugs, and explain complex concepts. Soā¦ are we doomed? No. AI isnāt replacing developers anytime soon. But: Developers who use AI will replace those who donāt. The best devs are using GPT to: Skip repetitive work Prototype faster Learn...