.NET MAUI First Look - What is it, how do we use it, and is it ready

dotnet maui is the hotly anticipated cross-platform application building tool to succeed xamarin with the launch approaching rapidly i want to take an initial look at the product who it's for and how it works if you're curious about what.net maui is and if it's ready for prime time this is the video for you now if you don't know me my name is tim corey and my goal is to make learning c-sharp easier i do that by providing videos here on youtube multiple times per week plus i have a weekly podcast i also provide courses on c sharp web development and much more at iamtimcorey.com the profits from those sales are what pays for the free content here on youtube so that everyone can have a great education in c sharp not just those who can afford it in this video as of most of my videos i'm going to create some source code if you want to copy that source code use the link in the description all right let's go over to visual studio and here i'm actually running the preview version of visual studio and the reason why is because.net maui has not yet been released it should be released very very shortly in fact if you're watching this video it may have already been released in which case you don't need the preview version of visual studio in order to use.net maui but i have the preview version in order to get the latest maui bits which have been in release candid now for a little while so they're pretty stable already and they should be exactly the same uh interaction that you will have with the release version so let's create a new dotnet my project you'll see that visual studio is a little bit different notice the the highlights a little bit different and there are a few more options you'll see that you won't see in your visual studio quite yet if this hasn't been released this is the latest version of visual studio okay so if we search for maui and wait for it again wait for it there we go so this is a preview version there's still some books worked out um especially that search that search has been a little bit uh finicky on the preview version but it should be fixed for the the production version so dot net maui has a few different versions we have the.net maui app which again is in preview we have the.net maui blazer app and we have the.net maui class library so let's talk first about what is.net maui and then which one of these should we choose so dot net maui maui is actually an acronym microsoft loves acronym for once this actually makes it into a actual word as opposed to wpf or wcf or all the rest they choose but net maui maui stands for multi-application user interface basically we can run our application on android ios mac mac os and also windows and tizen so there's a number of different platforms you can run this on newest the one that's missing here is linux that's not on the list currently that's a suggested one but it's not currently in the list of possibilities so that's what dot net maui is it's the successor to xamarin xamarin was it used to work on ios and android and i believe it worked on some mac as well but um but it also is a little bit different flavor of dot net which is why we had net standard which will allow us to talk to the various versions of.net like.netframework.net core and then.net for xamarin but now they've brought all of that underneath the one.net which is technically.net core but we call it.net six at this point so now normally they release something like this as part of the dot net release now as a plan for net six however it wasn't done yet so they've done kind of out of band uh work on this and they're gonna release it early is the last i've heard so they they said quarter two of 2022 which is basically now so it's been really soon um but for now it's still in preview but it's almost ready so that's dot net maui now so it's brand new it's it's a reinvention of xamarin now with the same.net six underpinnings which may even ask a question well then why do we have a version of.net maui that's a class library project and the reason why is because this class library enables some of the same things with the multi uh platform targeting that.net model itself does and we'll see some of that when we i'll probably create class libraries you can see the difference but it's it's basically just about the targeting of those platform specific libraries now net maui blazer is something a little bit different and it's not something we'll look at in this video but we'll look at it soon what dot net maui blazer is it's a blazer app it's a a web application but it's designed to be installed on the same platforms android ios mac catalyst mac os tizen and windows so i'm not sure if i'm spelling or pronouncing ties and write i have never used tizen but what it's for is essentially it's the same thing as like an electron app where we have electron apps like github desktop i believe is an electron app i believe.net or vs code is one as well but essentially they're you know real apps but they actually run a browser to actually execute them so they they aren't just native code installed on the platform and what that allows you to do is it allows you to install it on more platforms it allows you to very easily have one code base but install it ever kind of like what a progressive web application does but expanded upon so this is the the net version of electron but we're not going to cover it today where i cover the dotnet maui app itself going to say create and we're going to call this our maui demo and our maui demo app and once we create this this product will look pretty close to its standard wpf or win ui project actually kind of a win ui project um but it's a little bit different okay so um so it's it's pretty close it uses xaml so we're kind of used to that so if you you know you're looking at this and going what is this this is a wpf or win ui project type so if you're new to xaml this will look pretty standard okay but there are some differences so let's look at the differences and see what what those differences are so we can start off with mileyprogram.cs and says program.cs and we'll see in here we're still using the um the static class my program instead of just program but we still have a an entry point create maui app and it looks pretty similar to what we already expect we create the builder we um configure fonts which is a little different but it's something and we use the maui app so you can put dependency injection here whatever else you want logging and so on it's dot net six so you can you can work with this how you want let's look at the actual project type while we're here and we'll see that um let's unpin this we'll see that target framework dot net six for android net six for ios dot net six for mac catalyst are the target frameworks but then also if the os platform is windows then we have the target frameworks plus dot net six for windows 10 in that version uh 19041 that's that and above and that's something else we should talk about is that yes this runs on a windows desktop but it has to be a windows 10 i believe it's the 18 i forget 1800 version patch and above or windows 11. so it will not run on windows 7 will not run windows xp or vista or millennium whatever version of windows you have it's not 10 or 11 it will not run so this does target those upper end windows platforms versions so um and this is a conditional so we're getting a lot more um stuff inside of our our cs proj file because of the fact that there's a lot more going on so we have multiple frameworks targeted at once which is kind of cool to see just separated by a semicolon and you also see we can target even more by first checking to see if the build platform is windows because if you're not on windows it's hard to build windows projects because it needs windows dlls so therefore it's not going to build on those for those platforms you can also comment this or uncomment this for a tizen app if you want to do that as well here's the output here's the root name space yes use maui and it's a single project with implicit usings there's a lot more stuff in here the display name the app identifier you'll need to change these for your application of course you know mauidemo.com.com it's it's intentionally backwards um so this right here would probably be your domain name or your um company name and then your actual specific product name here so and then your company good or application good for from your company and so on so a lot more stuff going on in here than a standard file we're not going to go into all of what this is and how it all works in this video this is a first look video it's not an in-depth course on.net a lot of stuff going on and there will take a lot of work to get through it all to understand it all and that will be uh quite a few videos but we'll go over different pieces of it different times and maybe create a course if you're interested in a net my course i'd be interested to know that because i base what courses i create based upon your your desires and so if you go to suggestions.iamtimcore.com leave that suggestion or if you find it already there which i believe is one there already then upvote it let me know that it is of interest to you again that's suggestions.iamtimcory.com okay so there's your app icon your splash screen your images that are included your custom fonts and other raw assets so this is the the for every platform this is the the basic stuff but i say for every platform because this stuff is all going to work across platforms and work for all the different projects however there are some things that you may run into that are platform specific so we're working right now with the the big picture which is everything and so our main page will work on all different project types all it's going to work on on android and ios and so on it might be look a little different but that's based upon native controls and so what happens is it will get compiled into that platform's build process and it will use that platform's apis and that platform's of look and feel a little bit to make sure that your app looks native to that platform now that's all part of the build process and think of this dotnet maui kind of like what net standard was if you remember net standard allowed us to build our class library once and use it for net framework and net core and xamarin and even um win ui or uwp so this is kind of the same thing we're building it once and we will have i'm sorry we're writing the code once let's use that terminology because then we build it for the various platforms and it transforms and outputs the correct thing for that particular platform but sometimes there's platform specific things you need which is where this folder comes in platforms notice android ios mac catalyst tizen and windows and you can keep these or ignore these depending on what you want to do in fact if you decide i don't want to support android at all no problem you could even go into your project file and take out the target of android delete that folder and just not use it okay so you don't have to target android or you don't have to target ios it's up to you which ones you target but this allows you to target all of them so these folders right here are platform specific things so for example the android manifest here are the things that are specific to just the android manifest as opposed to everybody's manifest so some things you can put in your project file for example here's our icon here's our splash screen here's our images here's our custom fonts but sometimes you need something specific for android well android name permissions access network state and permission for the internet as well you need his entries as well for android where you don't use the same exact terminology for other platforms or you don't need it for other platforms so we have the the stuff that is basically mapped to every platform so we use one name for it but it gets mapped to the api of each platform and there's some stuff that's specific to that platform which means we put it into that platform's folder now you may ask the question well then tim doesn't that mean i have to know how every platform works you might have to a little bit at least because you're building things for that platform so yes this will allow you to create apps that you can deploy to multiple platforms and probably 80 to 90 percent of the work is being done in one spot and distributed to all the platforms but there will be that last little bit that you may have to tweak for every platform now if we go to ios we'll see the info.plist this is kind of nice they give you a gui for it so you can see the bundle identifier the version the build the deployment target the main interface and so on what orientations you'll allow or not allow if a status bar should be default or light if you should hide the status bar require full screen and so on so there's some cool things there that are actually in gui form as opposed to you know the xml form which i really appreciate and that only seems to be on ios and mac although i have noticed this is what happens for the mac catalyst this just spins so if this happens to you then hopefully you can fix it soon i think it's just preview version or even my machine version that's the issue here so if you see it report it let them know but i think this is just a preview bits version issue so you could still edit this with a a text editor and that would work just fine okay and there's even windows specific stuff here as well so you'll see some specific to windows things that um that again we can change here is again how you'd set this up for uh the the microsoft store so these are things that the microsoft store want to know for example the if you're gonna update the tile which orientations you allow visual assets packaging and so on again that's a nice gui because it is windows so that's the platform specific stuff for the most part you're not going to spend a lot of time in here you'll spend your most time just doing the the stuff necessary to launch the application hopefully like the the microsoft store information and so on but there may be times when you have specific uh color schemes or other things that you put into a specific uh folder or maybe you have some specific code that might need to go into one because you want to access an api that's not available to all the platforms in which case that's what you'll put those so with that we don't have a lot else in here we have our app.xaml which we can see some demos here of bringing in resource dictionaries such as colors and styles we have our app.shell which just has our hey call the main page which there's our main page and this main page doesn't have a lot to it as a demo but it does show us how to put a vertical stack layout put an image on there how to put a label how to put a button how to do something with that button so we have the on click event and that looks pretty similar to what you've already seen in c-sharp before it's just a click event but it does show us how to to do this and how to announce it as well for example the semantic screen reader dot announce that the the change has been made to that text so let's run this and that's where we have to talk about how do you actually run this because when you build this for production you're going to build it for multiple platforms this targets multiple platforms therefore when we run it for debugging purposes we want to run it against multiple platforms because it will look differently so if we see the drop down next to our windows machine here we'll notice that there's multiple different things we can do for example we can run it on the windows framework and target windows that version we can also use an android emulator now if you've not set your machine up yet to use android emulators you'll need to install them first so i already installed it the android emulators that's probably a whole video in itself just installing them and setting them up but basically what this does it runs a full android phone on your computer to emulate what it would be like you can also use ios local devices so if you have an iphone or ipad you can plug it into your computer and you can connect to it and run it on your phone as a demo device now you do have to have a apple developer account which i believe is a hundred dollars a year in order to use ios it's much more difficult to build your application and test it on mac if you're running windows so it's a little bit more difficult because you're going to need that that local device you have to have the apple account and so on if you're on a mac it's a whole lot easier but if you want to still want to deploy you're going to need to have a a mac or an apple developer account in order to do so so you also have to have a android developer account when you want to deploy it to the store but that's a little easier a little cheaper to do so just note that also for for deploying it to windows which is actually the microsoft store that's going to take create an account as well i haven't done that in a while i have it from way back but i believe that's free now or pretty much or pretty close to free so the apple one no shocker here is the most expensive so and if you do have a remote device that has ios iron network or you can set that up and that will walk you through the process of saying a remote device to connect say if you have a mac or if you have um you know something else on your network you can run off of it so just note for our purposes we're going to do windows machine and android emulator just to see those two in actions so let's go start with windows machine this will create a win ui application and it will take a little bit to compile and build but once it's done we're going to have a a complete applications actually installed on our machine now the first thing you'll get and i intentionally made sure this message came up you'll get this message saying hey you need to be on a machine that can be in developer mode because what happens is with the windows store apps you can only install them through the windows store that's the default however if you're a developer and you want to do what's called side loading which is not secure because the fact it's not been tested by microsoft and it doesn't ensure there's no viruses and so on you can enable developer mode now you do want to do this you have to do this in order to test windows apps but i do want to point it out and that's what it's for don't panic this is not a unsecure thing to do it's just that you are enabling your machine to sideload apps that just means that you have to then be aware that if you have that enabled that you shouldn't sideload apps that you don't own or don't know about so don't just take code off the internet and just run it make sure you understand what that code does first before you sideload it so the nice thing is you click here go to settings and in here we can turn on side loading there's a whole bunch of changes in here but install from any source including loose files enable that and it says hey do you want to turn on developer mode yes okay so then we just hit close and it will start running so it's going to install this on my machine which means that when you're done testing it you'll have to uninstall it but not the end of the world so there is our net maui app and if we resize it it resizes just fine notice to click me here if i click it it says click one time notice no it's singular to times plural because the fact that i have clicked it multiple times this is a win ui application and it is again installed by machine and we can now test to make sure that it works the way we expected it to so the nice thing also is we do have the ability to hot reload so let's drag this off screen for me i'm not going to refresh it i'm just going to um make some changes here let's let's make some changes to the the main page i have been having problems with this just so you know but i think they've got it fixed now so if we look at the let's go to the label above this one so where it says hello world we're going to say hello youtube and i will actually save that and it's already here and updated hello youtube so just making that change allows us to whoops allows us to um to see the differences so even though we have a visual designer here we could run this application and try it out so if we you know take the comma out and this move is over notice the comma is already gone so really great stuff notice it still clicks 16 times so this allows us to make changes and modifications or application without even saving them notice that the white dot indicates it's not saved yet and yet we've made changes to our application that we that are reflected on the.net maui app so that is windows let's go ahead and stop that and i'm going to undo these changes so let's go back to hello world hello comma world and then let's do a drop down here and choose android emulator i'll choose the galaxy nexus i've given it a little bit more memory and it's a more modern version it's the android 12 so api 31. let's run this this will take some more time and if you don't have a machine that can do hyper-v then it will be even more time but it is running it's starting the the device up notice it looks like an android phone because it pretty much is and the cool thing is we do have a lot of things off the side here notice we have our power switch here we have our speaker up and down we can rotate this um and rotate it or not i'll show you how to make sure that we have rotation lock on or off to pay what you want but now it's building it's going to send our stuff over to this phone and install it and then oh then launch it on this phone and keep the debugging live so this is doing a lot of heavy lifting right here there's a lot of work here which is why yes it's going to take some time and if you don't have hyper-v installed then it will take a lot more time because hyper-v really speed this up but just know that's the reason why it's not because it's it's a bad process it's just doing a lot of stuff here um running a full operating system and installing it and then connecting to a visual studio and so on but there is our launched applications i didn't pause the video or anything so it wasn't like it was forever long but if we notice it looks a little bit different than it did on um on windows but we still have the click me it still works it still says hello world and come over here and say youtube it changes take comma out watch i'm gonna hit backspace but watch the comma go away okay so backspace done so that's how how fast it updates that's some pretty impressive stuff and we can even do things like use these the emulator whoops i just turned it off use the emulator to say rotate it and see what happens in this case nothing seems to happen well you can hit this little rotate button right here um there is on some emulators let's rotate this back rotate button um on some emulators at the very top if you drag down there is the ability to lock or unlock the the rotation so this one doesn't have it but the other one that i have installed does you can you can unlock it so just you know if you it doesn't unlock for you but you want to see the rotation there's a little icon that pops up just rotate it and now you can see the how it looks rotated okay and you can go back you can do other things with as well you can play around that just he would have any phone go back you know look at what what else is open you can screenshot you can select it you can go back home and so on let's go back to our app and play around as much as you want so this is our app running in android now that gives us a really good idea of how our app is going to work as we move along in fact let's i'm going to launch the installed version uh this is the installed version of the wing ui project notice it looks a little bit different the home versus home the fonts a little different but besides that's pretty much the same thing so with one code base we now have two different apps installed on two different platforms that are running our c-sharp code so some pretty cool stuff here there's a lot of cool stuff ahead for net maui but that's the basics of it now again i'm on windows so running the uh the test for mac i'll do that in the future but it requires me to put my mac on the network and get an apple developer account or plug in my iphone and try it that way we'll do all that but just know it's a little bit different to do that so if you're on mac then testing on mac is no big deal testing on android is no big deal but testing on windows is a no-go so i think you i'm not sure if you can connect to a windows device i'm not sure but yes developing for multiple platforms is going to take some more work and yes it will require you to have a mac in in your possession in some way in order to do some of the work with mac that's not a microsoft thing that's an apple thing apple is pretty protective of their walled garden and so they require you to have a mac to publish an app to the app store for apple that's a that's a an apple thing there are some kind of ways to get around that but it really is easiest just to have have a mac and own that which is expensive but that's part of doing this process now you can build mostly everything in fact you can build the whole thing and make sure it works for windows and android and then it wouldn't take much to add in the ios stuff if you ever get a mac or if you start generating enough income from the android side or the the windows side in order to do that so that's a possibility but from microsoft standpoint you have all the tools at your fingertips to build everything you need to do okay so this is some pretty cool stuff it's just coming out now one of the questions that may come up is is this ready for prime time should i start building my apps in this there's two different questions there i'm going to answer them one at a time so first of all first of all is this ready for prime time yes in the fact that it is fully supported by microsoft and once it actually launches not the the preview version but once it actually launches the full support of microsoft and it's going to be something that they will support going forward and with the history of where we would have a xamarin it's gonna be a long path forward it's not gonna be a oh this didn't work we're gonna can it they're gonna they're putting a lot of eggs in this basket of dot net maui so this will continue forward this will be something that microsoft supports for a long time now is this something that is ready to use today if you are just starting your project then yeah you could probably start with this just know that it is still at the very start of its launch what that means is there will be some significant changes coming to it in the coming months and year so i would say oh by.net 8 this will be pretty solid and pretty robust kind of like what we have with blazer when blazer first came out it was great and we started using it right away as some excellent stuff but some significant changes came to it in dot net six so even though it launched in.net three and net 3.1 the the really the platform stabilized and the big features were implemented by net six which is two versions later and that's because it takes some time to see how people use it and whether or not they like it what do they like and not like what are the pain points what are the features that need to be added and there's still some features that need to be added to this but for the most part this is feature complete so i would say that there will be some significant changes coming to it over the next let's say 18 months but that does not mean you can't start using it today you absolutely can and i don't think it'd be something where you'll regret doing so so that's my opinion on this it is something that i will continue to cover i'll continue to create content on again if you have suggestions for what exactly you want to see about dot net maui then go to suggestions to iamtimcory.com leave a suggestion there or upvote an existing one that's how i make a lot of my choices on what new content is going to come out based upon that information based upon what what you as the audience want for example right now a really pressing thing is apis and micro services what are they how to create them why they you want content on that it is definitely coming so that's kind of stuff that we're looking at but um if you have opinions on what you want to see let me know we can definitely create some courses on this and some some more content hey you can get a sponsor to uh take a course and make it public we'll see but um but this is the kind of stuff that um i think we're gonna use a lot in the future okay so dotnet maui some really cool stuff we're gonna look at net maui in blazer coming up because that again is another really cool option these are not uh one or the other options so don't get caught up in the idea that there is one best solution overall for your specific project there may be but overall this is one more option so don't get copying well which one is better blazer or the regular version it depends on your situation it depends on what you're doing but um but yeah we do have options now so you can either write in xaml or you can write in blazers html and css so there's some some cool options there especially if you already have resources in one or the other that you can continue to grow and lean on as you move forward in this new technology now if you're wondering is xamarin going away well this is the new version of xamarin so yes and no yes it's going away in the fact that it's going to eventually not be supported anymore because just like all old versions it goes out of support but this is the new way of doing xamarin it does take some upgrading to get to this if you have a xamarin project but it is something you definitely can do and it's definitely possible to get running and working so just know that you can upgrade your project from xamarin into dotnet maui and it will be beneficial for you to do so so with that that is dotnet maui i'm looking forward to hearing what your thoughts are what your questions are on what you want to see next for dot net maui what your thoughts are on if you plan on using.net leave the comments down down below let me know what your thoughts are again i like to gauge what you as an audience want to see based upon what you as an audience tell me so if you don't tell me then i won't do it so that's that alright so with that thanks for watching if you have any questions leave them down below i'll do my best to get to as many as possible but i'll leave this code in the description there's a link to get emailed to you so check it out if you want to see it but really it's just a basic file new project so if you don't want that's fine but thanks for watching and as always i am tim corey [Music] [Applause] you

Channel: IAmTimCorey

Views: 122,635

Keywords: .net, C#, Visual Studio, code, programming, tutorial, training, how to, tim corey, C# course, C# training, C# tutorial, .net core, vs2022, .net 6, maui, .net maui, mac, ios, android, xamarin

Id: HmyfjAaPW0g

Length: 37min 50sec (2270 seconds)

Published: Mon May 23 2022