Blazor Hybrid (+.NET MAUI) Tutorial for Beginners – Build mobile, desktop, & web apps with C#

James Montemagno

The first 1,000 people to use the link will get a 1 month free trial of Skillshare: https://skl.sh/jamesmontemagno04231

Let’s start our journey together to build beautiful hybrid multi-platform apps across mobile, desktop, and web with .NET MAUI, Blazor, C#, .NET, and Visual Studio! In this video I am going to guide you through the entire process and describe everything that is in File – New Project for a Blazor Hybrid app with .NET MAUI to build hybrid web apps for iOS, Android, macOS, and Windows. We then will look at how to share Blazor components across these platforms and a full Blazor website. That’s right, target mobile, desktop, and the web and share UI components and logic across them all. We will explore what Blazor Hybrid is, how it works, what you need to get started, how to deploy and debug, navigate, style your app, and so much more. We of course will finish with looking at how to mix and match UI components to build a Hybrid app, access native APIs, and so much more!

Links:
Source Code: https://github.com/jamesmontemagno/BlazorMauiApp1
* My .NET MAUI Playlist: https://www.youtube.com/playlist?list=PLwOF5UVsZWUjNR3roRK79QgBcKLyOX48I
* 4-Hour .NET MAUI Workshop: https://www.youtube.com/watch?v=DuNLR_NJv8U
* .NET MAUI Beginner’s Series: https://www.youtube.com/playlist?list=PLdo4fOcmZ0oUBAdL2NwBpDs32zwGqb9DY
* .NET Beginner Videos: https://dotnet.microsoft.com/learn/videos
* .NET Conf Talk: https://www.youtube.com/watch?v=ojcvL8KCOwo
* Blazor Hybrid Docs: https://learn.microsoft.com/aspnet/core/blazor/hybridWT.mc_id=friends-0000-jamont
* .NET MAUI Documentation: https://docs.microsoft.com/dotnet/maui/?WT.mc_id=friends-0000-jamont
* .NET Podcasts Project: https://github.com/microsoft/dotnet-podcasts
* Microsoft Learn Training: https://docs.microsoft.com/learn/paths/build-apps-with-dotnet-maui/?WT.mc_id=friends-0000-jamont
* Platform APIs: https://docs.microsoft.com/dotnet/maui/platform-integration/?WT.mc_id=friends-0000-jamont
* Visual Studio: https://visualstudio.microsoft.com/?WT.mc_id=friends-0000-jamont

Join this channel to get access to perks:
https://www.youtube.com/channel/UCENTmbKaTphpWV2R2evVz2A/join

👕 Buy some swag! – https://jamesmontemagno.myspreadshop.com/
☕️ Buy me a coffee – https://www.buymeacoffee.com/jamesmontemagno

Follow:
👨‍💻 GitHub: https://github.com/jamesmontemagno
🦜 Twitter: https://twitter.com/jamesmontemagno
📄 Website: https://www.montemagno.com
📰 Newsletter: https://newsletter.montemagno.com/

Chapters:
00:00 – Intro
02:10 – .NET MAUI & Blazor Overview
08:16 – Sponsor: Skillshare
09:56 – Get Started with Blazor Hybrid with Visual Studio 2022
10:40 – Creating your first Blazor Hybrid project
12:10 – Exploring Blazor Hybrid projects
16:28 – App startup, dependency injection, and main page with BlazorWebView
20:00 – Deploy Blazor Hybrid to Windows
22:30 – Deploy Blazor Hybrid to Android (emulators and management)
24:00 – Access native APIs in Blazor Hybrid
29:45 – Deploying to iOS and Mac
30:25 – Share code between Blazor web apps and hybrid apps
34:30 – Mixing and Matching Web and Native UI
41:30 – Platform specific UI tweaks
42:30 – Wrap-up and final thoughts

Disclaimer: This channel, videos, and streams are created in my spare time and are a product of me… James Montemagno! They are NOT officially affiliated or endorsed by Microsoft (my employer) in any way. Opinions and views are my own.

What is on my hat? It is the CLE clothing logo because I am from Cleveland! Checkout their awesome CLE merch: https://cleclothingco.myshopify.com/

What is that art on my wall? It is an original piece from the French street artist Gregos of La Butte Montmartre: https://www.instagram.com/p/BceZ1oNHiQx/

Special thanks to Skillshare for sponsoring this video.

My Setup:
📷 Canon M50 Mark II – https://amzn.to/3P8R7lp
💡 Nanoleaf Elements Lights – https://amzn.to/3umwJVW
🎙 Blue Spark Microphone – https://amzn.to/3qgtYkq
🎙 Blue Pop Filter – https://amzn.to/3jEWM3r
🤳 Rode Microphone Arm – https://amzn.to/2Z68AlE
🎧 Sony MDR7306 Headphones – https://amzn.to/372jxta
📲 Stream Deck – https://amzn.to/373Uk1n
📹 Elgato Cam Link – https://amzn.to/3a9eGbh
📷 GoPro Hero – https://amzn.to/374lm90
🖱 MX Master 2S Mouse – https://amzn.to/3d7J2gj
⌨️ Tecware Phantom Keyboard – https://amzn.to/3aUP4y9

#dotnet #blazor #dotnetmaui #blazorhybrid #programming #aspnetcore #visualstudio