Code  Geek

Code Geek

1661323970

.NET MAUI Tutorial | Build a full .NET MAUI application step by step

In this video we perform a full step by step build of a .NET MAUI App that we test on both Windows and Android. The app interacts with a separate .NET 6 API that we also build step by step.

⏲️ Time Codes ⏲️

Theory

- 0:48 Welcome
- 03:13 App demo
- 06:07 Course overview
- 09:14 Ingedients
- 10:10 What is .NET MAUI?
- 12:48 How MAUI works
- 15:14 MAUI project anatomy
- 19:47 MAUI App start up sequence
- 22:29 UI Conepts
- 28:21 XAML vs C#
- 30:29 Solution Architecture
- 31:41 Application Architecture


API Build

- 35:31 API Project Set up
- 42:41 API Model definition
- 44:47 API Db Context
- 47:13 Connection String
- 52:19 Migrations
- 56:31 API Read Endpoint
- 1:01:58 API Create Endpoint
- 1:08:15 API Update Endpoint
- 1:12:57 API Delete Endpoint

MAUI App Build

- 1:17:21 MAUI App Project Set up
- 1:21:00 Android Device Manager
- 1:25:08 MAUI Model definition
- 1:31:16 Data Service Interface
- 1:35:40 Data Service Implementation
- 1:47:27 Data Service Read Method
- 1:53:34 Data Service Create Method
- 1:58:48 Data Service Delete Method
- 2:01:53 Data Service Update Method
- 2:05:41 Android environment config
- 2:11:00 Architecture check point
- 2:11:54 Register MainPage for DI
- 2:14:13 MainPage code-behind
- 2:21:03 MainPage XAML Layout
- 2:30:19 Re-work MainPage layout
- 2:35:12 Add another page (ManagePage)
- 2:38:01 Adding a Route
- 2:30:01 Regiter ManagePage for DI
- 2:40:29 Complete MainPage code-behind
- 2:45:12 ManagePage code-behind
- 2:51:16 QueryProperty
- 2:57:34 ManagePage XMAL
- 3:07:56 Run on Windows
- 3:09:30 Re-work ManagePage layout
- 3:16:26 Using HttpClientFactory

Outro

- 3:21:02 Wrap up and thanks
- 3:21:31 Supporter Credits

Level: Beginner

🌐 Links 🌐

🎓 Microsoft MAUI Learning Path: https://docs.microsoft.com/en-us/learn/paths/build-apps-with-dotnet-maui/?wt.mc_id=lesjackson_dotnetmaui-mvp-video 
💾 GitHub Repository: https://github.com/binarythistle/S05E04 ---.NET-MAUI-Step-by-step-
🤩 Patreon Site (Exclusive Member Benefits!): https://www.patreon.com/binarythistle 
🔗 MAUI iOS & Android Confugration: https://docs.microsoft.com/en-us/dotnet/maui/data-cloud/local-web-services?wt.mc_id=lesjackson_dotnetmaui-mvp-video 

Subscribe: https://www.youtube.com/c/binarythistle/featured 

#maui #netmaui 

.NET MAUI Tutorial | Build a full .NET MAUI application step by step
Rowena  Cox

Rowena Cox

1654587420

Final Tips, Pointers and How To Learn More with .NET Maui

This video is part of a crash course to build your first .NET MAUI app. You have done it! Congratulations! You have built your very first .NET MAUI app and have grasped the basics of mobile and desktop development. Before you go, let me give you some hints on where to learn more and also, don't forget to pick up your very special surprise!

🔗 Links
.NET MAUI on Microsoft Learn: https://docs.microsoft.com/learn/paths/build-apps-with-dotnet-maui/
Planet Xamarin: https://planetxamarin.com
.NET MAUI Docs: https://docs.microsoft.com/dotnet/maui/

Workshop Repository: https://github.com/jfversluis/dotnet-maui-workshop

.NET MAUI Crash Course Playlist: 

⏱ Timestamps
00:00 - Congrats on Your First .NET MAUI App!
00:18 - Thank You and Learnings...
01:57 - .NET MAUI on Microsoft Learn
02:37 - The Amazing .NET MAUI Community!
04:01 - Check out the Microsoft Docs
05:06 - Add Suggestions in the Comments
05:57 - Last Code Tips for Monkey Finder
06:36 - OnPlatform, OnIdiom and ValueConverters
10:22 - Fix the Geolocation "Bug"
12:01 - Claim Your Reward, Be Proud and Share!

 #dotnetmaui #maui  #dotnet6

Final Tips, Pointers and How To Learn More with .NET Maui
Rowena  Cox

Rowena Cox

1654544100

Styling, Theming and Dark Mode Support with .NET MAUI

This video is part of a crash course to build your first .NET MAUI app. Our app is pretty much complete, except for 1 important thing: Dark Mode support! In this video we will learn about all the different styling and theming options in .NET MAUI. What are StaticResources, DynamicResources, how to define styles and how to implement light theme and dark theme support. You'll learn all this and more!

🔗 Links
.NET MAUI ResourceDictionary Docs: https://docs.microsoft.com/dotnet/maui/fundamentals/resource-dictionaries
.NET MAUI Docs: https://docs.microsoft.com/dotnet/maui/
Workshop Repository: https://github.com/jfversluis/dotnet-maui-workshop

.NET MAUI Crash Course Playlist: 

⏱ Timestamps
00:00 - .NET MAUI App Themes
01:09 - Styles.xaml in a New .NET MAUI App
03:07 - Explore .NET MAUI ResourceDictionary
05:56 - Styles in .NET MAUI
08:29 - Implicit vs Explicit Styles
10:02 - Add Dark Theme Support in .NET MAUI
16:15 - Don't Miss the Last Video!

 #dotnetmaui #maui  #dotnet6

Styling, Theming and Dark Mode Support  with .NET MAUI
Rowena  Cox

Rowena Cox

1654500840

Pull-To-Refresh, EmptyView and Layouts with CollectionView

This video is part of a crash course to build your first .NET MAUI app. In an earlier video we already implemented the CollectionView, but it's time to have a closer look. For this video, we will learn how to implement pull-to-refresh, see how to make clear to the users there is no data with EmptyView and explore different layouts that are available to CollectionView.

🔗 Links
.NET MAUI CollectionView Docs: https://docs.microsoft.com/dotnet/maui/user-interface/controls/collectionview/
.NET MAUI Docs: https://docs.microsoft.com/dotnet/maui/

Workshop Repository: https://github.com/jfversluis/dotnet-maui-workshop

.NET MAUI Crash Course Playlist: 

⏱ Timestamps
00:00 - .NET MAUI CollectionView
00:22 - What is CollectionView? And CarouselView?
03:02 - Implement Pull-To-Refresh with RefreshView
07:52 - Different CollectionView Layouts: Grid, Linear, Custom?
10:31 - CollectionView SelectionMode
11:19 - No Data? No Problem with EmptyView!
15:07 - Wrap-Up; Next Episode: App Theming!

#dotnetmaui #maui  #dotnet6

Pull-To-Refresh, EmptyView and Layouts with CollectionView
Rowena  Cox

Rowena Cox

1654457520

Using Platform Features and Device Sensors with .NET Maui

This video is part of a crash course to build your first .NET MAUI app. For this video we will be looking at using platform features and accessing device sensors. More specifically: we will be using the .NET MAUI Geolocation APIs to determine our users location and open the default Maps app.

🔗 Links
.NET MAUI Docs: https://docs.microsoft.com/dotnet/maui/

Workshop Repository: https://github.com/jfversluis/dotnet-maui-workshop

.NET MAUI Crash Course Playlist: 

⏱ Timestamps
00:00 - .NET MAUI Platform Features
00:25 - What Happened to Essentials?!
03:55 - Add Geolocation APIs
05:01 - A Deeper Dive Into Dependency Injection
07:24 - Implement Geolocation Functionality
14:28 - How To Handle Permissions
20:23 - Implement Opening Default Maps App
25:34 - Wrapping Up/iDevice Notch Platform-Specific

#dotnetmaui #maui  #dotnet6

Using Platform Features and Device Sensors with .NET Maui
Rowena  Cox

Rowena Cox

1654414200

Implement Navigation with .NET MAUI Shell

This video is part of a crash course to build your first .NET MAUI app. With our overview of monkeys in place, we now want to see the details of 1 monkey. For this we are going to implement navigation in our app and also see how to pass complex objects from one page to another.

🔗 Links
.NET MAUI Shell Docs: https://docs.microsoft.com/dotnet/maui/fundamentals/shell/
.NET MAUI Docs: https://docs.microsoft.com/dotnet/maui/

Workshop Repository: https://github.com/jfversluis/dotnet-maui-workshop

.NET MAUI Crash Course Playlist: 

⏱ Timestamps
00:00 - .NET MAUI Navigation
00:16 - What is .NET MAUI Shell?
02:52 - Time for Code!
04:09 - Note About Android Developer Mode
05:32 - Implement TapGestureRecognizer
07:01 - Implement Navigation with Complex Objects
12:00 - Implement Navigation UI
18:48 - Setup Navigation Routing
21:46 - Running the Android App
23:29 - Wrap-up and What's Next?

#dotnetmaui #maui  #dotnet6

Implement Navigation with .NET MAUI Shell
Rowena  Cox

Rowena Cox

1654327680

Implement MVVM and Databinding with .NET MAUI

This video is part of a crash course to build your first .NET MAUI app. In the previous video we populated our CollectionView with static data. Time to change that! In this video we will get JSON data from a remote source, deserialize that and while doing we will learn all about MVVM, data binding and dependency injection so that our code stays clean and perfectly maintainable!

🔗 Links
.NET MAUI Data Binding Docs: https://docs.microsoft.com/dotnet/maui/fundamentals/data-binding/
.NET MAUI Docs: https://docs.microsoft.com/dotnet/maui/

Workshop Repository: https://github.com/jfversluis/dotnet-maui-workshop

.NET MAUI Crash Course Playlist: 

⏱ Timestamps
00:00 - .NET MAUI Add MVVM To Our App
00:12 - What is MVVM?
06:17 - Implement INotifyPropertyChanged
10:35 - Add Bindable Properties to BaseViewModel
14:50 - Retrieve JSON Data from Remote Source
18:21 - Load JSON From App Resources
19:31 - Implement MonkeysViewModel
21:09 - View Model Dependency Injection (Constructor)
26:21 - Execute Logic in MVVM with Commands
28:35 - Implement the Improved View
30:24 - Implement Data-Binding
41:34 - Make Your MVVM Life Easier with CommunityToolkit.Mvvm

#dotnetmaui #maui  #dotnet6 

Implement MVVM and Databinding with .NET MAUI
Rowena  Cox

Rowena Cox

1654284060

Display Rich Data with CollectionView

This video is part of a crash course to build your first .NET MAUI app. No time to monkey around, in this video we will dive right in! You will see how to turn JSON into a C# model and with that model we will populate a CollectionView and make sure we display data nicely by using a DataTemplate.

🔗 Links
.NET MAUI CollectionView Docs: https://docs.microsoft.com/dotnet/maui/user-interface/controls/collectionview/
.NET MAUI Multibinding Docs: https://docs.microsoft.com/dotnet/maui/fundamentals/data-binding/multibinding
.NET MAUI Docs: https://docs.microsoft.com/dotnet/maui/

Workshop Repository: https://github.com/jfversluis/dotnet-maui-workshop

.NET MAUI Crash Course Playlist: 

⏱ Timestamps
00:00 - .NET MAUI Display Rich Data
00:50 - MonkeyFinder Repository
02:59 - Explore MonkeyFinder Project in Visual Studio
03:57 - Implement Model Object to Display
06:50 - Implement CollectionView
14:37 - Well Done!

#dotnetmaui #maui  #dotnet6

Display Rich Data with CollectionView
Rowena  Cox

Rowena Cox

1654240680

.NET MAUI Project Structure/Single Project

This video is part of a crash course to build your first .NET MAUI app. Before we really get to the code, let me explain to you the .NET MAUI single project approach. Single projects give us a lot of advantages like not having to repeat resources like images and fonts. After watching this video, you'll feel comfortable with the .NET MAUI project structure and you're ready to code!

🔗 Links
.NET MAUI Single Project Docs: https://docs.microsoft.com/dotnet/maui/fundamentals/single-project
.NET MAUI Docs: https://docs.microsoft.com/dotnet/maui/

Workshop Repository: https://github.com/jfversluis/dotnet-maui-workshop

.NET MAUI Crash Course Playlist: 

⏱ Timestamps
00:00 - .NET MAUI Single Project Approach
00:12 - .NET MAUI Crash Course
00:44 - What is Single Project?
02:46 - Explore Single Project in Visual Studio
03:57 - Platform-Specifics
05:22 - Working with Resources: Images, Fonts, etc.
07:29 - Inspect the Single-Project csproj
10:14 - MauiIcon, MauiSplashScreen, MauiFont, etc.
13:56 - MauiProgram Structure: .NET Generic Host
15:35 - .NET MAUI Shell

#dotnetmaui #maui  #dotnet6 

.NET MAUI Project Structure/Single Project
Rowena  Cox

Rowena Cox

1654197360

Setup Your .NET MAUI Dev Environment

This video is part of a crash course to build your first .NET MAUI app. In this video we are going to install Visual Studio 2022 and the .NET MAUI workload. From there we will proceed to setup an Android emulator, see how to enable Developer Mode on Windows 11 and even how to connect to a Mac build host. After this video you'll be ready for .NET MAUI development!

🔗 Links
.NET MAUI Docs: https://docs.microsoft.com/dotnet/maui/
.NET MAUI Crash Course Playlist: 

Workshop Repository: https://github.com/jfversluis/dotnet-maui-workshop

Download Visual Studio: https://visualstudio.microsoft.com
Android Emulator Docs: https://docs.microsoft.com/xamarin/android/get-started/installation/android-emulator/
Setup Mac Build Host Docs: https://docs.microsoft.com/xamarin/ios/get-started/installation/windows/connecting-to-mac/
Windows Enable Developer Mode: https://docs.microsoft.com/windows/apps/get-started/enable-your-device-for-development

⏱ Timestamps
00:00 - Setup Your .NET MAUI Dev Environment
00:39 - A Note About Previews and Releases
01:57 - Install Visual Studio (FREE Version!)
04:40 - Create Your First .NET MAUI Project
07:39 - Setup Android Emulator
09:28 - Android Emulator Performance
10:27 - Enable Hyper-V Support
12:42 - Enable Windows Developer Mode
14:56 - What About iOS and macOS?
16:39 - Setup Mac Build Host for iOS Development
20:55 - Explore the Android Emulator
27:14 - What Did We Learn?

#dotnetmaui #maui  #dotnet6 

Setup Your .NET MAUI Dev Environment
Rowena  Cox

Rowena Cox

1654154040

What is .NET MAUI?

This video is part of a crash course to build your first .NET MAUI app. In this video we will be introduced to what .NET MAUI is, a little bit of history with Xamarin, how it works and how the course is setup. From here we will start setting up your development environment and start building our first app!

🔗 Links
.NET MAUI Docs: https://docs.microsoft.com/dotnet/maui/
.NET MAUI Crash Course Playlist: https://www.youtube.com/playlist?list=PLfbOp004UaYVt1En4WW3pVuM-vm66OqZe

Workshop Repository: https://github.com/jfversluis/dotnet-maui-workshop

Next video in this course

⏱ Timestamps
00:00 - Welcome to this .NET MAUI Crash Course!
01:20 - How Does .NET MAUI Work?
05:49 - What Does .NET MAUI Offer?
07:17 - .NET MAUI Essentials
07:58 - Crash Course Structure

#dotnetmaui #maui #dotnet6

What is .NET MAUI?
Rowena  Cox

Rowena Cox

1654110720

Create Your .NET. MAUI UI in Code with C# Markup!

C# Markup is a set of fluent helper methods and classes designed to simplify the process of building declarative .NET MAUI user interfaces in code. The C# Markup extensions are available through the .NET MAUI Community Toolkit and in this video we are going to see how to recreate the default template page in C# code!

🔗 Links
Sample App Repo: https://github.com/jfversluis/MauiCSharpMarkupExample

.NET MAUI C# Markup Docs: https://docs.microsoft.com/dotnet/communitytoolkit/maui/markup/markup
.NET MAUI C# Markup Repo: https://github.com/CommunityToolkit/Maui.Markup
GitTrends Repo: https://github.com/brminnick/GitTrends

⏱ Timestamps
00:00 - C# Markup for .NET MAUI
00:17 - What is C# Markup?
01:30 - Our Sample App for Today
03:02 - Confession Time
03:50 - MainPage in Regular C# Code
04:18 - Install CommunityToolkit.Maui.Markup
05:42 - Recreate MainPage with C# Markup
17:50 - Real-World C# Markup App: GitTrends

#maui #dotnetmaui #csharp #xaml #dotnet6 

  Create Your .NET. MAUI UI in Code with C# Markup!
Rowena  Cox

Rowena Cox

1654067340

Introducing .NET MAUI Community Toolkit

The .NET MAUI Community Toolkit is a community-created library that contains .NET MAUI Extensions, Converters, Advanced UI/UX Controls, and Behaviors to help make your life as a .NET MAUI developer easier! In this video we will learn about the history of the .NET MAUI Community Toolkit and how to get started yourself!

🔗 Links
.NET MAUI Community Toolkit Docs: https://docs.microsoft.com/dotnet/communitytoolkit/maui
.NET MAUI Community Toolkit Repo: https://github.com/CommunityToolkit/Maui

⏱ Timestamps
00:00 - Introducing .NET MAUI Community Toolkit
00:19 - .NET MAUI Community Toolkit History
04:10 - The Community in Community Toolkit
05:27 - .NET MAUI Community Toolkit Repo
06:51 - The Sample App
08:47 - Write Your UI in Code with C# Markup Extensions
10:26 - Get Started with .NET MAUI Community Toolkit Yourself!
13:23 - Of Course we Have Docs!

 #maui #dotnet6 #dotnetmaui #xaml 

Introducing .NET MAUI Community Toolkit
Rowena  Cox

Rowena Cox

1654023780

Start with .NET MAUI Release Candidate (RC1)

A new release of .NET MAUI bring us at Release Candidate 1 (RC1). This means all APIs are finalized and we're getting ready for the final release! But one thing at a time, let me first tell you all about this release of .NET MAUI.

🔗 Links
.NET MAUI Docs: https://docs.microsoft.com/dotnet/maui/
Blog Post Link: https://devblogs.microsoft.com/dotnet/dotnet-maui-rc-1/
.NET MAUI RC1 Migration Guide: https://github.com/dotnet/maui/wiki/Migrating-to-RC1
Download VS2022 Preview: https://aka.ms/vs2022preview

⏱ Timestamps
00:00 - .NET MAUI RC1 Release 🎉
00:17 - What Does Release Candidate Mean?
01:43 - .NET MAUI RC1 Release Notes
04:01 - What About Xamarin Support?!
04:36 - How To Get Started with .NET MAUI Today?
05:28 - Migrate Existing Project to RC1
05:43 - .NET MAUI Essentials Breaking Changes
07:42 - Remove WinAppSdk NuGets and BlazorWebView
10:11 - .NET MAUI Community Toolkit Update

#dotnetmaui #maui #dotnet6

Start with .NET MAUI Release Candidate (RC1)

Why You NEED .NET MAUI's new Dependency Injection

.NET MAUI supports the dependency injection (DI) software design pattern, which is a technique for achieving Inversion of Control (IoC) between classes and their dependencies. On top of that it fully supports constructor injection and full dependency resolution when navigating when using Shell. I break down every little thing you need to know about DI, IoC, and constructor injection with .NET MAUI.

Chapters:
00:00 - Intro
01:15 - What is dependency injection?
04:55 - Source code walkthrough
07:10 - Registering services
09:30 - Resolving services
12:00 - Constructor injection & resolution of dependencies
14:00 - Automatic dependency resolution with Shell
17:08 - Wrap-up

Links:
Sample Code: https://github.com/jamesmontemagno/MauiApp-DI?WT.mc_id=friends-0000-jamont
MVVM Source Generators: https://github.com/jamesmontemagno/MVVMSourceGenerators?WT.mc_id=friends-0000-jamont
.NET Podcasts App: https://github.com/microsoft/dotnet-podcasts?WT.mc_id=friends-0000-jamont
.NET MAUI Documentation: https://docs.microsoft.com/dotnet/maui/?WT.mc_id=friends-0000-jamont
Dependency Injection in .NET: https://docs.microsoft.com/dotnet/core/extensions/dependency-injection?WT.mc_id=friends-0000-jamont
Dependency Injection in ASP.NET Core: https://docs.microsoft.com/aspnet/core/fundamentals/dependency-injection?WT.mc_id=friends-0000-jamont
.NET MAUI Workshop: https://github.com/dotnet-presentations/dotnet-maui-workshop?WT.mc_id=friends-0000-jamont

#dotnetmaui  #dependencyinjection #dotnet  #ios  #android  #netmaui #maui 

Why You NEED .NET MAUI's new Dependency Injection