🔴 Recreating Threads App with .NET MAUI & NEW VS Code Extension!

thank you [Music] foreign thank you foreign [Music] foreign [Music] [Music] foreign foreign we're totally back live [Music] it's been a hot second it's good to see everyone in the chat good to see hey no we got a little emojis going whoa uh awesome to see some folks from around the globe fantastic uh it's been back it's been a second hopefully you can hear me I'm pretty sure one time I record a video and then the audio didn't like work at all and I was like what's going on uh which is good so hopefully the background music is Chill it's good adjusted the audio levels uh I've mostly just been really um most are really just been doing videos and things like that so installing some extensions now so we're gonna see what happens here I hope everyone's doing good uh it's been a while since I live streamed I've been kind of you know doing the videos more live streams big commitment I've been kind of figuring out like what do I want to live stream right we did some we did some uh some amas we did some other things like that so you know see what you know what y'all want let me know in the in the comments on any of the videos or ping me on Twitter or threads or any of those places things like that but Life's Been Good hair's been getting longer uh the studio still the same in the studio which has been good it's good to see uh Sean Gabriel Ivan Wayne Tyler uh I'm home with people Ben in the chat good to see you uh as well I love the little new uh emojis it reminds me of teams when we have little emojis going on which is great so life is good uh Diaz it is good from Paraguay I've been awesome to see you from Turkey amazing whoa Miguel from Orlando pretty cool I'm about to head up to Seattle for vs live uh Redmond on campus which is cool so if anyone's around I got workshop with Becky from the down at Maui team and then we got a cool session all about Maui stuff that's happening it's cool well we got Poland in the house UK I love the Emojis coming in good to see everybody very very cool readings from Ukraine hope all is well over there stay safe uh we got Ohio in the house my home town not well not Cincinnati but Cleveland but you know from there South Carolina in the house gonna see everybody cool awesome Oh Canada as well amazing very cool it's good to see everybody hanging out uh you know we had some good questions come in in the chat um and feel free to ask questions along the way I love my live streams be interactive uh and do a bunch of stuff you know it's here I only do them exclusively I used to do the twitch like every single week but I burnt out on that so you know I'm now doing videos everywhere we also burnt down on that you know I'm not Gerald level of uh of doing videos every every single day but I'm trying I'm trying trying to blend in some more you know dot Netty C Sharpie type of stuff here and there so very Togo from Lagos amazing Germany in the house as well Warsaw was just there uh not too long ago love Poland amazing ah well I hope everyone's doing good from Denmark very cool looking at replacing powerapps canvas with Maui wow very cool interesting uh looking to get a little bit more power a little bit more stuff happening yeah that's cool New York City in the house from the Milky Way classic I love it Armenia whoa Eric very cool wow everyone from everywhere I love it that's the power of the internet parth uh thank you so much I appreciate you uh there Gerald is a beast ah Joe has a little bit of an advantage you know he does work on the dotted Maui team directly so uh Stephen Australia in the house Norway reporting I'm gonna be in Norway uh later the next month which is cool as well we're gonna head to uh to Finland and then to Norway well Thailand very cool uh Thailand's on my list that's for sure very cool audio just a tiny bit very cool wow amazing we might actually go to Australia as well in in in in November we'll see so we'll see guys says quick shout out to Maui in vs code that's what we're doing today uh we're gonna give it a go we're gonna give an install give it a look I know it's not fully featured 100 but you know it's there Bangladesh in the house Qatar in the house wow amazing any conferences I'm attending in Norway um no I presented at NDC quite a few times in the past um this would be for a personal trip so we're actually going for my wife's work and then we're gonna take a few more days if I go to Bergen and then to Oslo she hasn't been to Oslo and I love Oslo as well and it's been a while since I've been to Oslo probably on DC like six years ago five years ago in there as well so is the.net Maui extension replacing the.net meteor extension well I don't know the meteor extension I think is a third party one there was a comet extension um which was more for the the uh Clancy had done a lot of that work which is more of an experiment this is sort of like an official from the.net Maui team Visual Studio team you know extension really so this would be like the one in general so yeah so that's what I would say in general yeah oh Ben says go Ben traveled to Thailand early this year whoa very cool we're just talking to some friends about like the rejects we went to like Vietnam and Malaysia not too a few years back for the pandemic and that was pretty pretty awesome I'd love to get over there again from India hey yam nice to see you as well oh cool Andres yes totally very cool all right cool yeah yeah we have some some bookends going on or finalizing some details it's coming out quicker than I thought but uh kind of excited about about it so um well let's see Karem you don't need to buy anything it's all free you know should I buy vs extension of Dynamo you just install it you just install it now we're gonna do it today today what we're gonna do is we're gonna try to take the threads out threads it's a nap from Instagram meta we're gonna try to build a little UI it's very it's not it's pretty straightforward application just happens to work well we're gonna try to build some UI see how that goes see how far we get an hour or whatever maybe we'll keep building it we'll see what we do who knows see how close it gets there we go uh Ivan asked his bootstrap work on Dynamo if you're doing Blazer stuff or the hybrid webview stuff totally so very cool some more people in from India very cool I just love like seeing where people are from how things are going things like that oh yeah you do need uh Karen good question so we get a lot of questions in fact I I Frank and I on merge conflict the podcast that him and I do uh this week upcoming we actually talk about the Dynam Maui extension for vs code and uh and also the c-sharp dev kit and also the c-sharp extension straight up so there's kind of there's four extensions there's also the intellicode extension four C sharp dev kit you really need to separate this into two worlds right separate one the first world is the c-sharp extension which has been around forever uh and that has sort of been re-written kind of almost from the ground up from the team here over at Microsoft and it's open source and folks from the community and that is now built on a new language Service uh protocol LSP that is basically using the same stuff from visual studio um so the Rosalind support all the intellisense engines and things like that those are all updates all the stuff that you'd expect uh being able to build and compile and debug your apps that's all inside of there right so that is for all intents and purposes the same if you were using that yesterday to build c-sharp applications use it the next day but it'll just get better you upgrade and boom it's good to go now that is completely you know it's open source there's MIT license you know you don't need to log in don't need to do anything now the other stuff is the new like kind of plus plus if you will on top of it all right so think of it like this is you know you can install.net and start coding anywhere but when you install Visual Studio or you install Visual Studio code there are things that can improve upon it so the team was like what does c-sharp developers need um on top of just building and doing cyber C sharp well you need stuff like packaging you know managing projects you know packaging stuff um and yeah and the good one uh Stephen question is does the c-sharp accession replace the Omni sharp one it's the same package so the Omni sharp you can flip back to omnisharp if you want but it basically the new LSP implementation replaces that there so you just upgrade the extension if that makes sense so it's the same exact extension same repo things like that um I mean you know that's completely free you don't need to do anything else it's the same as is yesterday right if that makes sense right now like I said the team basically um it might use yeah an improved version of omnisharp right so whatever the blog post says is the correct version of it yeah oh and then maybe it's an improved version so then you can flip back to it but the improved version of omnisharp with the LSP in inside of it I think that's right I'd have to ask Tim here he would know 100 yeah um so read the blog post 100 so that might be right then uh if you're correct there are a little emojis look at that little thing yeah now on top of that though like I said that's just a c-sharp extension now you're like thank you Barney I appreciate that clarification now on top of that though the team's like what else do c-sharp developers need well things like solution Explorer so you can have multiple projects open be able to create new projects um being able to add references easily you know package management like test Explorer support things like that well the team then built another extension right for vs code which is called the c-sharp dev kit and additionally another one called intellicode for the c-sharp dev kit and this is our c-sharp dev kit basically sits on top of the c-sharp thing the c-sharp extension so it's optional you don't need to install it now for that though you do need a visual studio subscription but including a free one so if you have a free Community Edition like I do you just log into your account and then it lights up and you get all that goodness right and the same thing is true there for the dynamawi extension for vs code that was just released like two days ago that is the C sharp or the dot net Maui extension for the c-sharp dev kit so it sits on top of the c-sharp dev kit right you can kind of see this ecosystem start to evolve evolve right which is really cool and that's the same thing you'll log in with your account but I can just go ahead and let's do it let's see what we can get here and go from there we go Wasim asks I'm using fresh mvvm can you use that I'm out yeah I'm pretty sure that that was ported over it's over there okay so we're inside of vs code right yes correct so if I go in I say C sharp dev kit right I have nothing I just installed vs code there right and there's a c-sharp dev kit there's the intellicode here here's.net Maui write all these things and there's basically dependencies like look at this as we can see like here's here's this right so we have C sharp dev kit which uh it which relies on C sharp and also includes C sharp right here and telecode look at the dependencies exact same thing right um the.net install tool for extension authors that's just like a way to basically install there um which is there and then the c-sharp dev kit the same if you look here this is um it has an extension pack so it basically will install the intellicode for you because it's not an it's not a ex you know uh this is not a dependency of the c-sharp dev kit but the c-sharp extension is right so for most folks the recommendation is just to install the c-sharp dev kit one click install you're going to get intellicode you can get the c-sharp dev kit so you're going to get all the the hotness like this the refactoring code navigation code completion package management support for some new things debugging testing things like that and of course if you go into the c-sharp extension you know you can see that this obviously supports um you know the the the new open source LSP that's here right and it is powered by omnisharp yeah correct so Omni sharp with that stuff so when you get here you're like whoa I get this getting started guide Katie and my team worked on this which is Super Rad and it says you can sign in if you have a visual studio subscription um so I'm just gonna go and connect it and that should open a browser question mark sign in there we go so it's going to allow Boop I'm just logged in with my personal account amazing now if at this point you don't have um a visual studio subscription it's going to you know prompt you to to sign up for at least a uh a Community Edition right which is free you know and in fact if you go to um you know visual studio.com over here and you look actually like there's Dev Essentials this is really cool so if you don't have Dev Essentials this is neat I'll post a link to do it there we go cool so this gives you all you know a bunch of stuff basically but it gives you uh one year subscription with uh you know 200 credit a bunch of azure devops stuff some you know power community plan stuff get some software trial stuff you know a bunch of stuff basically in in the extension and the dev Essentials so definitely check that out which includes the Community Edition cool so here I'm pretty sure I have data installed so let's view the terminal and say.net dash version oops cool all right so I have you know 704 installed so perfect right if you don't have it you can one click install and install.net and be good to go there so be good now this is going to have me like open a folder so here we can open a folder create a project with.net new but it's also just in the inside of here launching debug so you can you know show Runners at break points and there's a bunch more stuff here as well so like what's cool is now if you go to view command palette and just say.net notice that there's all of these.net commands that are in here so new project clean uh build uh rebuild you know oh the sign in stuff all that stuff so that's cool so let's say if I go now to here check this out there's a new create.net project button boom which is cool and that should ideally work let's see maybe I need to re-start it question mark foreign version do I want that I might want that I don't know oops new project does that work for him there we go yeah um again reboot oh Visual Studio code is set an update so that's always good that might be why let's see here I love I love a good old Visual Studio code install updating let's see if that worked oh there we go so the c-sharp dev kit you can't even see it down here but let me go ahead and do this I probably missed this pop-up in the world of pop-ups but basically the c-sharp dev kit requires this pre-release version of the c-sharp extension so I'm going to upgrade that and that's going to turn on the pre-release there I think the team's working on trying to improve that flow a little bit but so for some reason something's working close it down reopen it switch to the preview version of the the c-sharp extension uh inside of there um which is cool yep right it's installing is there a way of setting the font size for the solution Explorer no there's not there's there's a there's a open issue out there for that that's for sure to do that okay so here now when I do create new projects if that's not working it's here but you can create a new project etc etc so if I did a new web API I'm going to select a folder let's put it on our documents let's use storage GitHub and then let's see that work there we go so you can call it web app three cool so this is my first time streaming on Windows 11. it's been it's been a while I wonder where this actually put it um okay okay I put it inside of a folder perfect all right cool so there we go um so this is nice right so this is just the folder view see how it's just like folders We have vs code folder Json settings uh this is you know shows me my.net solution for sln we have all of our different projects here but if I look down over here I see that I actually have this solution Explorer and this actually shows me my projects inside the solution my dependencies it shows me my packages uh the different Frameworks I have installed the analyzers I've installed so so this looks pretty good um out of there and then yeah here's like my web API right and then I can just hit F5 and say I want to debug it and this should debug it I guess it's gonna afraid if I want C sharper the dot net one in general something that's interesting is like you know there are these launch settings but these launch settings are for like read by like Visual Studio not necessarily by um you know buy this here so there we go so it's like loading UPS doing stuff get an API get a Swagger try it out execute bingo bango until I get to go right just like you would suspect so that's kind of cool yeah and then you know you can create configurations and things like that and all that stuff so let's go ahead and close that folder Boop a good question Raphael says is it possible to change profile to run the project in this plugin is it yeah so I mean in your debug configurations you would create profiles basically yeah [Music] okay so then what we want to do is we have now intellicode we have the c-sharp dev kit stop we have the C sharp preview and then I can install the Maui gear right there's a bunch of Maui stuff in here so there's like this is the Uno has a plug-in uh this is a third party plug-in and this is the official one uh from the Maui team there we go so again just kind of like installing your setup right is now if I didn't have the c-sharp extension or the c-sharp dev kit then you know it would walk me through that process so there we go so I just logged in and I'm all good it's gonna just show me pretty much the same stuff right it's gonna show me you know do make sure I have Don and Maui installed um I create my first Maui project how to you know build and launch different things and go from there whoa we're saying thank you so much for hussian thank you so much for becoming a member super appreciate that you get sweet sweet emojis now welcome to the coffee monkey crew and then just learn more so there's a whole bunch of new command palette stuff so now there's Don and Maui stuff check this out right we have uh configure Android set up for deployment pick Android device different devices things like that so now let's create a project and let's do a dona Maui app and let's select my GitHub folder heal all right I'm going to call this uh threads threads app boom all right all right so here's one thing that I you'll see right away is that we're still kind of in our folder view down over here and then it's going to activate extensions and then what you're going to see is like the solution explores there now if you want you can just drag and drop this exclusion Explorer around right so if you want that to be on the top it'll now bubble up to the top right and now we get over here all of our you know dependencies that are coming in so we can see them being inflated basically hey Sue Matt how's it going we can see our uh resources coming in our app icons our fonts that are inside of here and then we have our Maui app which is cool and it's a Donna Maui project right so nothing nothing crazy over here we have our xaml here now there are a few things like right now like hot hot reloading and xaml intellisense is like it's working on it it's kind of doing stuff so we're gonna see like how long I actually like stay in vs code versus like do I want to just pop out and not you know get all my intellisense stuff so it's early it's a preview so you know it's it's it's new it's new hotness basically right so there's that uh we'll see how it goes um go ahead and I'm gonna make it a little bit bigger over here cool awesome uh can you choose the dinette version you want to Target or does that it just picks the latest I think this is just picking what my default is so I don't think there's an option to pick from that but here's.net seven so I think if I had done at 8 installed it would dot net eight as well I'm pretty sure so not 100 sure but I'm pretty sure um in general yeah there's that premium content for free well thank you yeah all you gotta do is a sub you can become a member if you want that helps out if you want no big deal I need to do more member things I don't know what y'all want as members though so there's that um why doesn't navigation work without the debugger uh I don't know it should work that should work I don't know uh good question though we'll give it a try here uh do you think you can make this app with C sharp Only Knows xaml anywhere whoa um we could try we could try we could try totally we could try um I would at least do the shell probably in there and that's it here's what I want to show everyone I'm going to actually minimize this down I'm going to hide my I want to hide a few things here there we go just so you can see the stuff right so the thing I want to show you down here is that we have some things going on here right so we have like a a language mode so if I go to C C sharp this is gonna this is gonna first show me that I have the visual studio subscription I have an Enterprise account from like work that's tied but it works with Community Edition I have the C sharp it's like automatically like detected by vs code and then this is kind of interesting is that there's this little the I don't know I don't know why this icon is this icon maybe it's easy to implement but this is like the icon basically here so this icon shows us the startup project and the debug Target so if I tap on that this is pretty cool right like I actually can see the where I want to build right so there's build only there's local machine for oops local machine for Windows so you can tap on that there's Android emulators or Android build only and then obviously I'm in visual studio for Matt or Visual Studio code on windows so I can build iOS and Mac like build it but I can't like deploy it right it's like there's no like hot restart or connection to Mac or anything like that so it's going to be like limited there yeah how do I run Android device emulators well there's a few things uh if you have Visual Studio itself right that's going to have the SDK managers and it's going to have um an Android device emulator else basically you'll install either that or Android studio and then you'll boot up Android emulators from it so that's what you would do here I have an Android emulator that I have just that I created in Visual Studio you could also boot up like the Windows subsystem for Android as well that's an option too if that makes sense does it give you an Android subsystem um no you need to configure that right so that I mean it's not an IDE it's not going to do five billion things for you right so it's a code editor so it's going to do what it needs to do but that's about it if that makes sense but here if you do have emulators it you know it did detect it with ADB so it did automatically detect that stuff so here's one that's not running here's one that is running and then that's gonna like basically switch it down here to my debug Target right which is kind of cool um and then yeah I just hit F5 and then there's a.net Maui debugger that's inside of here so you wouldn't you know pick the the net five core or the C sharp one you picked it on Maui one and then what this is going to do is going to build and you know you can kind of see exactly what it's doing down here it's going to do a net build run configuration it's going to spin it up and it's going to restore the packages and then start to build and deploy our application right so that's where that's going to basically work at the end of the day and it's going to build up stuff and my computer is running at 99 so I'm very excited about that which is great um uh Andre says will this live session be publicly available of course it's YouTube you can scrub back rewind it pause it it'll be the exact same link immediately after this it'll be right there um I don't know me high low um uh I did it the same way as a monkey app it might be maybe did you register your page did you not do something else question mark that'd be like the question uh if you're getting some Crashers you'd have to like upload the project there and see what's going on uh would you consider using Blazer hybrid if so when I love the questions keep them coming in uh Carol asks corill uh yeah I mean specially if you're a web developer I think Blazer hybrid's super nice there's also an experimental uh hybrid web view that can play side by side that so if you're doing angular react totally good to go um yeah I would use it if you're a web developer if you're already doing web blazery things like why not right so so that's what I would do you know or blend you know if you want to if you're building a mix and matching there you go yeah all right let's see how many frames I'm gonna drop in this thing so just building the application just like normal then it should deploy we'll see what's happening uh output I hope hope it builds we'll see check it out probably there's a problems Windows we'll see and says I had to play with the hybrid webview the other day so I could use a grouped collection view with a flex layout for children of each group The interoper worked well yeah it was kind of cool I was pretty surprised with that experiment that they have going on it's there yeah um Boris asked is dynamite already replaced xamarin 5 for bigger projects a xamarin's end of life oh it's not end of life until May of next year so that is when the support ends there look at that we have an app it's happening right boom so the app is here it's up it's running we'd have normal stuff that you would expect so if I go into a page again should be able to add a break point I hit a break point I got locals should have a watch window if I wanted to add count in here I think that's how that works yeah there we go four cool this this should be all the normal vs Cody stuff uh call stack you'll see all the frames things that's happening here amazing click it continue on amazing and we got the counter now there's a few things right so if I go in and I say you know plus equals 10 and I hit save um this is not going to increment Now by 10 because there is no hot reload support right now right so kind of a bummer I guess you could do done it run watch that may work I guess if you do a non-debug mode I really want to like try that out you know and see what that does not 100 sure but like I'm kind of curious if I do this right I wanna I wanna try this and see what it actually does in general um done it watch done it watch I think is what I'd want right and then run I want to see if that works well I'm gonna stop debugging let's see if I go into terminal okay now if I do view terminal okay and then if I do dot net build run I think I can do.net Frank told me yesterday that I could do it so I think I can do.net watch does that work nope watch dot net Dash watch dot net watch run oh Andre asked would the Blazer does that work nope dot net watch maybe I can't do it that'd be really cool if I could yeah I don't know if I can maybe I don't need the T slash T run question mark let's see but I'm imagining I need the configuration no I didn't want work hmm [Music] no no I know how to do it not a command line person that's a problem so uh can you exist uh attach an existing debugger ah I don't know that's a good question uh okay so let's see in the chat Andre was asking about Blazer hybrid you have access to the native functionality of course you can blend blend you've watched the video on my Channel watch it I'll go over to um go over to my YouTube here's what I want you to do I want you to go to youtube.com James montemago look at this and watch this Don Maui Blazer hybrid 43 000 views I want you to go here and I want you to watch this video bookmark this for later bam you're gonna watch that amazing oh and that Burke is learning Blazer right now amazing it's gonna help you there you go uh let's see what else we have um do you maybe have an example of HTTP reuse practice and Maui I mean you could use poly for instance pulling yeah um the default HTTP handlers like handle it all itself on mobile so you don't really need to worry about that yes and guy says it there all right cool all right I guess you could create a um is this gonna create a I think I need to create a launch Json but I want to see this I want to dot net Maui watch run uh watch run CLI watch command oh my God I should do it right hmm .net now done that build I want I want to watch run hmm I'm so bad with the command line and blah blah blah cool yeah okay that's not helpful all right uh anyways we got the app Coco Coco Cool Running I guess I just debugged I yeah that works cool um yovo says is it just watch that's what I thought well I mean I guess I could do like um dot net well so I think what you would need to do is let me see it adds a bunch of stuff on here right but I think what you need at least is done at watch I wonder if I'll just pick up the defaults uh Dash t does that work I do CD threads app I mean this would be an ideal scenario right where I can do dinette watch build okay done it watch build Dash T run because that would be pretty cool if that's gonna if that works what's happening something's happening done at dash run fingers crossed now you need to at least specify that uh yovo asked if there's any integrated for PDF stuff um I mean there's native controls that you could use but um also like things like teleric and syncfusion have a bunch of PDF stuff that you would probably use well I don't know let's see if this works no my squigglies went away so I don't know what happened there see now it just says it's like rebooting the app right so I don't think it actually seems to work I don't think it's the same you know what I mean it just restarted the app so it's not the ideal scenario I would say [Music] well that was like Donna watch build yeah I'm pretty sure yeah so it's kind of a bummer but you know as well as shut it down okay well here's what we want to do anyways so okay uh what we wanted actually can I create a launch Json file Maui like I think also you'd want to create like a this one's just gonna do whatever I'm doing currently so that's kind of nice I can create a launch Target I bet you could pass commands in there too there's request launch yeah I know in the in the description for the the the extension there's a q a and I know so it's not supported but I was just wondering if like the default.net watch stuff would work so probably dick I said doesn't so that's probably good um but let's see okay anyways what we want to do is we want to try to build threads if you've heard of this app very popular um so there's a few things that we want to do someone challenge me to build it in C sharp so we can try I'm not very you know I'm I'm fine with it but not as good probably as I should be so we'll see um okay cool that's running is that debuggage oh it does cool okay awesome okay cool stop debugging all right so we do want to do a few things so uh we don't want the we don't want the the behavior but we do want to add in a few pages in here so we're gonna have um home page we're gonna have search page and then we're gonna have a middle button that actually brings up a new thread button but I don't know if that's what I want I'll say new thread thread page it's gonna be multi-thread I believe so yes um then there's the hearts if you haven't seen the threads app uh let's see threads app images it looks like this tiny image great that's super helpful um filter image size large nope that's not also not helpful also not helpful uh Mario maybe just official post yeah there we go this is what we want to create basically is like this image of this the search we're going to call this uh this this Hearts is actually activity activity page and surprisingly nothing has um things there's a profile page so let's do that all right cool and then nothing has titles because why would it that's cool now what we're going to need though is some icons that is for sure so we're going to go over to our good friends at uh font awesome and let's go ahead and pull this up Boop and let's search I already downloaded them so they are here yeah there we go I got these here we're going to put those first over here into my resources fonts and we're going to paste those in there Boop let's do it did it do it I have to pay come on all right and how do I add existing uh I guess I can open the folder and I can drag and drop them in here Boop there we go amazing that should be the otfs that should work we'll see all right and let's make sure that nothing got funky up here new we got fonts those are coming in cool all right save that and we're gonna need the awesome C sharp GitHub file I don't know where that's at there we go uh so Matthew should have this awesome that where's the this one nice awesome icons and then we can just copy this I'm going to add a new folder I'm gonna call it helpers and then we're gonna add a new file and we want to see Sharp file class cool it doesn't matter because we're going to replace it I think [Music] there we go uh some huge file uh let's do this uh namespace will be threads app dot helpers there you go I don't know if they're refactoring kicks in or not but let's just go ahead and do that and remove that stuff should move it over cool all right that should work let's go ahead and build this let's see if that works uh Eden wants to know how Dynamic Compares a flutter react native well all three have very different approaches to how you build and do stuff right so if you're a react native developer then a react developer react native is probably a pretty good option you know it does more web slash mixture of stuff uh flutters Dart so if you want to enter that ecosystem and do that I should rename this I guess rename font what is it called heaps found some icons rename uh if you're in that world right and you want everything to be hand drawn hand selected um with um the the drawing engine that they have across the different platforms and that's you know good ideal scenario for you and based on the platforms you want to hit maybe those things are different I would look at like how does.net as an ecosystem of all right Dynamo is just one option in the world of dot net just like react native or ionic or even Blazer hybrid is for web developer as an option that you can kind of go into and for Don and Maui though it's obviously C sharp there's a base of IOS and Android Mac and Windows support that's there you can just build those apps in.net or you can do it you know without a Maui which is an abstraction on top of it gives you access to a bunch of uh different things and the native apis in c-sharp which is kind of nice and then additionally you also have other platforms too right you have things like avalonia which is another platform that does um dot net on different platforms especially for desktop really really that's where they started at and done in Maui sort of started on the mobile front and then you have Uno as well which is another platform built on top of.net and they sort of use the base layers that Don Maui uses from the.net Team to go from there so um yeah so you got a lot of options basically that's what I'm saying at the end of the day let me go ahead and pull up I have um there but the thing with Don and Maui compared to even Uno or avalonia is that it uses native controls and you know native API access as an option there's a drawing API there's Blazer hybrid there's webview hybrid support uh in there as well um but you know there's other options that you can do there as well yeah is Microsoft using Maui for its own apps yeah the Maddie talked about it and David talked about it at um build but things like the the uh what is it the admin app for Outlook and a few other ones that are out there too that are using it either going through a transformation from xamarin to.net and Maui or not yeah so there's that I'm gonna pull up my other app here and my my coffee app because I have some nice uh I have some nice code chunks for this fonts in here which would be nice to use I'm just gonna pull that stuff up in general but let's see if I go over to probably also want to pull up let's see where's my font awesome there we go threads at dot helpers I think that's it yeah cool um yeah that's uh you know uh yeah I built quite a few apps in xamarin's Amber forms I've been doing it for 12 years now 13 years now so I've been at c-sharp.net in general so that's great uh and yeah it really depends I think the world of.net is great to be in because you do have those options right like if you want to have something directly from the.net team and the Maui team you have those base layers you have Maui on top of it right uh and then if you want to go beyond that right so Carol's asking what about if I want every single platform humanly possible everything under the sun uh avalonia or Uno those two would give you you know one thing that kind of goes everywhere that's kind of what flutter's trying to be too and I'm sure the Maui team wants to get there at some point too but you know I gotta start somewhere on there too but I think Uno and avalonia have pretty similar comparisons as far as where they go maybe the same hard to say uh okay um let me do this so the other stuff I want to pull in is I want to pull in yeah this font image source here so I'm pretty sure I want to do like a tab bar here yeah the xaml support's gonna probably gonna kill me there we go you don't really need a tab bar but it's easier in my opinion if I just do tab then I do like um this if I do like I'm just gonna do this in in xaml and then we're going to also try to do I need to register these too we will see oops let me do this yeah let's do this one two three four five so if I do this put this here move this over grab this put this here move this over yeah once I have the xaml support that'll be nice if you want to do xamli stuff uh however yeah you can definitely do C sharp first that might be the better approach for vs code currently since it's all in preview uh yeah you can you can you can build dot Maui apps without xaml you could use the Blazer syntax there's a Blazer Maui bindings I think it's run by the community now that basically brings Blazer Syntax for like doing native controls as well as an option that's something that's there all right one thing we need to do is we actually need to register those fonts so let's go ahead and do that resources fonts and then in my main page I'm just going to go ahead and copy this and we're going to have fa brands [Music] and then we're gonna do fa regular far fa regular far and then that's an OTF OTF OTF and then f a solid and then bass there we go so now we want to do is say okay how do I get like these icons so if I go to font awesome search for them and then filter by free there we go so probably gonna want magnify let's do solid I guess regular it's not as many it's more solid so we'll do solid filter I guess so we want house oh these are easy it's like most of them are right here so house it's probably going to be a mouse and that's probably magnifying glass let's just look at it foreign just magnifying glass I'm also going to pull in my uh I'm gonna pull in my colors too from here I like to have these this color wheel that I have where's my abs ammo there we go copy app styles there we go I just had these system fonts I'm a big fan of system fonts Styles colors they have a bunch in here but I'm just going to add my own just because I use those everywhere these are default ones that basically Apple has somewhere so I just kind of like to put those in there though there's like Grays and stuff like that but I'm just gonna use those this one is the new thread page so I wonder if there's like a sure what's he post new uh there we go Arrow up into the oh it's like uh create uh edit there we go pen to square that's probably what it is similar enough pen to square I bet that's what it is then we need a heart so let's just grab a heart emoji heart just heart perfect I'm gonna see how much how actually how decent I am at this or not we have a user that should be user cool I like to create at least the the shell inside of uh in xaml just makes it easier in my life but let's see if this let's see if this runs or if it crashes because I did something wrong yeah uh let's see yeah the toolkit markup extension that's what I'm going to try next I think to see how we do there uh will there be a designer for win UI I'm not sure it's a good question have you noticed performance difference between Maui and xamarin forms uh and these in my apps are pretty much the same so but there's you know depends on what you're building and um on it I guess you know there's and different versions of 678 now that are out there so yeah uh Boris says Yeah flutter's a different approach a different way of designing apps yeah I think if you're coming from a uh if you're coming from a a net background obviously.net Maui makes a lot of sense so you know that makes a lot of sense there let's see if this works oh wow look at that it does work amazing look at that we've created we have created folks threads it's done we've done it what else is is there obviously you have different icons but at a high level it's funny too because like the default does expect text there and like probably for accessibility like that's probably what I would do um but yeah like a little little movement but I would probably create like a custom bottom toolbar in there that's what I would probably do so it's a little bit nicer but we're just gonna use out of the box stuff that's there now okay cool um that's good uh let's see yeah guys says try different stuff I've always said that you know nope no Frameworks perfect right you're gonna see a thousand issues on every single open source project right there's that uh so you know and people are gonna love one thing and hate a different thing it's not gonna have their thing that they want so nothing's perfect uh you know even if you're building in the native Native stuff you know and Swift and kotlin there's going to be quirks with that so you know abort says building a calendar view I don't use something out of the box like use a built control that's what I would do yeah in there too ship it done I don't think you'll notice no it'll be good all right cool so let's do this um what we can do actually is we could delete this page um let's maybe not delete it but let's do let's do a new folder I'll call it Pages Pages Pages Pages Pages pages uh Eliza yeah we talked about it a little bit earlier but David and Maddie at their build session talked a little bit about the usage internal some things like the uh uh office admin application and there's a few other applications from different teams that's the one I know off the top of my head but um and a few other apps they outlined it at build though the different teams that were building it for internal and external use there are a lot of internal use especially of.net and Blazer and you actually go to if you're just interested in Net usage um at Microsoft like it's pretty interesting too if you do.net um and then you do or is it at there's like uh developer stories that's pretty cool it's like all these amazing teams using.net to build different stuff so there's a lot of like apis performance things like that but you'll start to see some Maui stuff pop up on there eventually right but it's only been a year so you know things are trickling out as it goes so there's that all right so we got the app going let's do a new uh page and I'm gonna start with the new file and here there's not any Maui stuff in here it's kind of a bit of a a bummer I could do view command palette and then vehicle that new thing but you could also do new terminal and then I could say uh LS and I could say CD pages and I could say dot net new list I think is what I want oh that okay dot net new list I guess that's the correct usage of it so like if there's something that's in Visual Studio maybe it's not exposed inside here it's probably here right so here is the net Maui page C sharp so here I should be able to say dot net new that and then I guess I would do I don't know what it's going to call it new page one or pages yeah interesting so that's just going to give you a Content page and some stack in there so I guess it just calls it Pages because that's what it is called I forgot to like pass in a name that's that's the only thing is I don't I don't understand doing that yeah flutter does use skia that's correct yeah like a home page is that what we called it home page home page perfect and then we'll call this home page now rename this to home page and then how do I do it's like pass in dash n okay let's try that so I wonder if I do like Dash and let's see search page does that work all right that does work cool search page then we want new thread page you can't really see it because it's like way at the bottom and then we're gonna want uh uh activity page and then we want profile page don't I need a xaml page we're doing it all in C sharp it was a challenge and probably actually it'll be better to do it in C sharp because of the intellisense that uh would would bring in so we're gonna see but if we go back into the shell we're going to delete this page and then what we want to do is go here hey seven from Nepal very cool how's it going let's do pages Pages Pages Pages Pages pages and this one would be pages home page yeah just because the xaml intellisense isn't there yet so new thread page all right activity page profile page all right Q um and then yeah what you probably do want is the.net Maui Community toolkit right and then there's the C sharp markup here that how do I get it there we go C sharp markup oh there's a bunch of stuff copy package reference into here and then what else I want to do use this oh yeah I think these are the same so I think I want to go back here there we go a little using statement cool all right dark and light modes it should be supported out of the box basically um with the default controls yeah so that should work yeah inside of a Down at Maui app the resources their Styles and you'll see under styles basically all these different defaults for everything for for all the Styles so that should work so like if you took that app here and uh flipped it into dark mode this one have it well this version doesn't have it so there you go maybe it does let's see Dark theme there we go it should just automatically work probably need to change the colors of this basically based on the different things but yeah that should be it iOS updates available I'm gonna check my calendar really quick just make sure I don't run anything going out not anything going on today cool need to update my iOS version on this phone now that's for sure nice security response awesome yeah the the light and dark mode stuff should just kind of work automatically all right Okay cool so we have this all set up we have our files we have our fonts in here we have our shell we have our icons in here and then basically what we're looking at is like a feed item like this which is cool um that's cool and we've got to mock this out for all intents and purposes we can do that I don't know if flutter wood just provides a calendar box out of control I don't know yeah I don't know I like to look at all the ecosystems any idea for real-time notifications signalr there you go yeah that's what I would use signalr let's see if there's any other questions in here so yeah Zachary was about xaml we're gonna try to use some C sharp uh so a few people were asking about WPF to donate Maui there's a lot of quirks back and forth I'm sure that you can find lots of Articles from WPF to xamarin forms types of conversions but um yeah probably so this is interesting because the the the actual actual let's see using Community toolkit let's say get rid of this thing here cool whoa what is this there's like a little debug Target here that's cool wow I like that um there we go uh bump it up yeah signalr be your real-time communication stuff so if you haven't used the c-sharp markup stuff basically it gives you a lot of niceties as far as like bindings and font sizes and row definitions and things like this which is kind of cool um inside of it so there's you know different different types of things which is cool um I don't know how that works these text entry things oh that's interesting huh basically all we're going to put inside this content though is like a so long since I did it uh like you just kind of want a new list View uh-huh yeah I I have not done is there a list uh list items it's been so long since I did like I've not like done the code behind in like a long time for just like doing stuff but basically I don't even know how to do it let's see huh yeah there's got to be a [Music] hmm [Music] [Music] foreign basically I'm just like a thousand times more productive in xaml that's that that's the that's the difference with trying to do stuff in C sharp is like yeah I'm just not good at it anymore if that makes sense you know what I mean so people like just do it in C sharp well it's like well I don't know how to do it in C sharp which is kind of sad in some regard but it's uh definitely tricky but basically what you would want is like uh I think if I look at I think what you would end up wanting is like a a view cell yeah let's see interim arms the sharp list view sample list view code oh man not just items Basics list View custom cells Sam say like the dynamic ones have like both or the xamarin forms one two two I think they all do um main view code amazing here we go this is what I need perfect thank you cool oh yeah you do a new data template oh I'm so silly perfect okay cool like now I know what I'm doing uh seven uh you just navigate you it just says how do I navigate to a desired tab page in Shell page like I have a list of pad pages I wanted to redirect you would just uh go to async you know you do you know you do shell dot current dot go to async and then you just navigate to it navigate to it with the slash slash and you give it a you know home page and then you would like navigate and navigate to the home page that's it basic navigation you got it okay so let's create a grid so if I look at this app here what we want to do is create a cell and this cell is going to have like um column column column column one two three four columns okay so let's look at our good old trusty grid extensions over here and we're going to say public and it's going to be a view cell and it's going to be a um thread cell there's gonna be a view cell I do it wrong class there we go all right that is right yes and then here we can say of our list View I'll say list view Dot I mean you know what I need Copilot pilot there we go let's install Copilot that'd be ideal uh let's do the item template and then we're gonna say those new data template of thread cell correct [Music] oops [Music] yeah co-pilot good golf yeah absolutely then we can say content equals list View it's basically just one big list it should probably be a collection view with like different stuff in it but okay threads one two three cool all right and then what we want to do here let me look at this code again yep public cell right and then you want to do like return new grid I don't see how this thing works cool I'm gonna shove this in here let's just see what happens if I do this oops copy oops [Music] all right let's bring in some namespaces woo yep I gotta do a comment come on come that's actually not too bad like these little things here that's good did I do this wrong [Music] oh view equals there you go all right okay so and then ideally you could do like uh bind label dot text to I guess dot there we go cool that should actually bring it in which would be kind of nice we'll see what that does cool did my co-pilot turn on okay what's on all right uh I was just trying to do it's trying to tell me to simplify it okay okay okay let's see if that just like works I don't know but that should basically give me a home page it should then give me the thread cell which is going to have all these labels in it and really what this thing is Snipping tool here's a few things it's like oh what did I do did I do something wrong to not build okay error oh apparently I did not also delete this let's delete the program CS file there we go let's try it again [Music] yeah the c-sharp markup is just more enhancements yeah basically there oh what did I do uh threads Pages oh you know what [Music] uh yeah they gave it a I didn't give it a namespace that's why uh no this is threads snap dot pages and there's just some things still that the uh Visual Studio Visual Studio does that this one doesn't get the name spaces updated there let's try it again building building nope what did I do wrong I cannot resolve Pages home page um [Music] oh page is not page oh thank you good thinking yes oh I I didn't copy I didn't copy that correct thank you good call uh gavo and Andre thank you one car oh my gosh what did I do right now oh public oh I should probably put that in the right place there we go okay this should work let's try it again am I getting closer Pages Pages Pages Pages Pages pages let's see oh and interestingly enough there's actually like a you know there's another thing on top of this which is like was it reposted there's a lot of stuff happening here in this little this little thread yeah it would be I'll call Gerald up where's Gerald at come help me I need your help Gerald where's my you know what you could install is the uh live share you know what I mean get the live share going on here I love Gerald to come help I know he's up to it's probably late his time right now so it's probably sleeping now it's got to be 7 P.M there 8 P.M there and the Netherlands but okay so let me just I like to draw on stuff so it's like there's also a thread there's like another thing here but basically it's like this it's like this it's like this oh yes this [Music] so many things look at that it's seven in the UK there you go yeah very perfect 8pm yeah so this is gonna be one oh and actually like yeah if this is correct there's actually a thing here hmm which is the um has it been has it been threaded I mean that could not be one too like that could just be stacked on top of each other like is it retweeted or not but hard hard to sell but let me just undo that so we'll just undo that and there you go so this would be like one two three four this will just be a stack layout these will be stack layouts right and then they'll be one two three four that's not bad four and four so boom and then this will be separated at the top two okay I did it wrong just do run maybe this one doesn't do what I think it's gonna do I don't know this would be ideal I bet someone's probably built the UI in reactor angle they just shove it in here uh well I make the no pay wall I'm gonna pay walls whatever paywall I'll make the code open source right now don't tell me not to make the code open source uh threads app publish it public done did it open source on my GitHub boom it's right down there I don't tell me not to make it open source um does this work does this launch no amazing okay cool so we want to also do um has uneven Rose true that's obviously not gonna do it but yeah we have now we have these rows it's beautiful look at this beautiful app amazing okay cool but what we want to do is we want to basically build out this so I have a profile photo of myself here this one's me wow cool um and we're gonna take that and we're gonna put it into here where's my images or resources images open folder we're gonna put this profile on the image in there perfect it's already a circle see what it did there amazing okay so the first thing we'd want to do is um we're going to find these columns so what we're going to have if I look here I'm just going to make this smaller I'm going to put this over put this back here that's how I really designed in the real world designing look at that um so this is going to be I don't know let's say that this is this first one can be 50. that sounds good this would be the one that fills the rest so we just want to do that and then we're going to have Auto auto um I mean this could also be 50 because that's going to be like a dot dot dot at the end of the day you know now oh these are yes the columns and then for rows we're gonna have you know 50 you know it's not gonna be that high just make it static this one will be a star and then this will be a a a a 60 and 50. we'll just make that a size there so then what we should be able to do is say New Image okay and then I'm gonna do source and I should be able to do profile or profile Circle PNG and then I can say is there like other stuff in here they're probably like like dot height oh my gosh look at that it's filling in oh that's funny I love it that's so funny so we'd find it is there a width no it's like with ah man image extensions dot Source cool aspect is opaque doesn't have like the let's do this we'll say VAR profile I'm just gonna pull these up okay oh I see yeah that's it's adding the comma at the end yeah yeah I see yeah with oh it does do with okay so with uh let's just do um 50 50 right and then uh height 50. does that work and then uh [Music] oh I'm literally inside the thing James stop being oh okay I am okay okay okay okay okay I'm gonna do this yeah why not do it in xaml it's way faster it is way faster for me that is correct but somebody said I should build it in C sharp so we're at least gonna build this page in C sharp I think also right now is that there's really no intellisense for xaml inside of um inside the vs code extension so that's also kind of like a bummer right now so as you can see it's a challenge but hey you know what coding isn't easy being a developer isn't easy even though I've been doing this for a bajillion years it doesn't mean it's it's easy right you live and you learn and you forget how to code sometimes when you're a manager so that's life people um what we'd want to do here is we also want to do a DOT row span of two and then we'd also want to say dot horizontal options Center horizontal oh that's nice and then Center vertical okay and then aspect and we'll do aspect fill sure now if this is correct we should have an image overlay on top of this label actually let me just do this let me just not let's stop building that because I can do this and we can just make this the name right so we could say um James Monty Magnum actually it's all lowercase and then we could do.net .net dot developers actually I think it's threads.net slash at no no at dot net dot developers is it is there a dot in there there is amazing cool and then we could also do we'll do a shanselman cool a little laggy probably because I'm building is the one downside of I really need a new machine but this should be column one this would be like attributes font attributes it kind of is like a bold amazing actually I do kind of really like those those are pretty nice um how do I say end foreign get out of here okay okay so we have end and then we're gonna have let's do this actually let's do a public class and I'm going to call it a a thread okay cool oh wow cool wow amazing okay uh there is no there's no hot reload now unfortunately yeah so we also want to bring in the.net community tool kit oh uh VR mmvm perfect nailed it um perfect where's my nougat [Music] link to the nougat actually is there a is there a is there a package management system like can I like go in and then say give me now I was really hoping there's like a nuget package manager is it like a nougat thing oh yes yes in fact if you go to the dev blogs.microsoft.com if you actually go to the visual Studio blog which is here I love this image it's so good I use it in the background here you can actually take a look at the marketplace and there's these known limitations right so this is like xaml editing's lightweight there's currently you can't switch the Target intellisense and then xaml and.net hot realtor supported yet there's a keyword yet in there let me let me good uh this is funny like title description that's good uh what's that looking for [Music] I know there's a preferred nougat nuget package manager system but to be cool [Music] foreign using the Dyna nuget command on terminals shouldn't add the dependency on it should add it to the solution yeah I'm a big visual person that that's my main problem all the time is I'm a visual I'm a visual learner [Music] Community toolkit and then what we do here is close all the windows and then open up my solution my pages my home and then this is a public partial class and then we want like user actually we do this we would do string user string uh uh message and then you would have like a uh int of likes oh look at that int replies and then you'd have a bull is verified and then you want like a string of time ago and then you'd want a observable property and this is going to be a servable checked that just bring in the namespace could you give him to use Maui's that arachnid or flutter I mean Maui still seems not productive State well it depends what you're building and like how you want to build applications right like are you a net and c-sharp developer and that's where you're comfortable You're Building back ends and front ends in it does it hit the targets that you want it to do um if it doesn't you can also look at avalonia or Uno as good options too in the.net ecosystem and mvvm code is all the same there for me unless c-sharp.net developer I don't want to switch between my front ends back ends learning new languages doing different stuff I mean the team is making vast improvements with every release a.net they have new nougat packages that you can download try out different stuff [Music] um for me I like native controls native API accesses in c-sharp and a lot of the abstractions there so that's what I like uh in general I've been doing it for like ever basically but that's me um yeah can I do this can I do name of and then like user how does that work but you know everything that you you know do some pocs into different things and that's what I did a long long time ago and I got started and I was like you know this is great I love it so yeah I like how Gava I think you guys are answering you guys are answering questions in the the in the chat yeah uh I agree I think uh red near says like the extension is is coming along and I agree it's it's coming along that is for sure oh look at this I definitely don't want these bins do I have not a uh all right hold on where's my um they're not great in ignore hold on please hold I want to see what this did let's see what happened over here uh packages did it it didn't oh it made it private oh that's funny I told it to make it public but this is bad anyways because look it included all this stuff so I'm actually gonna delete this delete this Repository yeah cool uh because this should have a definitely a get ignore at the minimum Gabby Boop there we go that would at least be good um in general and then I'm actually going to let me just open this I'm gonna delete this git it's gonna be very upsetting me I'm pretty sure foreign yeah I mean I think for me like I've been a c-sharp and donut developer for since college to be honest with you which is in 2000 five five old uh so yeah I've been doing it now for man yeah almost 18 years in general so I've been loving but I built everything right I built desktop apps to build web services I build functions to me it's like I want to build everything in C sharp all the time right is everything perfect no nothing's Perfect Right does it get you further hopefully you know I mean that's that's the goal so um we're in a new array of oh that should just figure it out right the new a thread thank you okay and then we probably want a is verified false I'm not verified likes oh my gosh that's great good um there but you know I really like Donna Maui I really xamarin I like xamarin forms I mean it's kind of like just what I know and what I love and I'm very comfortable with you know I think that I'm excited to see that how much is being built up like around um and let's see uh image and then uh and just the ecosystem that's there it's kind of like anything that's new it needs some time to to bake a little bit right and uh it's definitely coming a long way which is really great and the nice thing is like a lot of that stuff came over from xamarin and xamarin forms I am dot netbot there we go cool oh I'm here to help you because you're really look at that just added a what is that oh this is amazing I don't even know I don't even know what copa's doing anymore oh man is it good enough to replace WPF I don't really know I mean um it's hard to say without what you're building right like I build and ship like my stream timer which is an app that I use on this exact stream you know and this is all this is a xamarin forms app but it would look better in Dona Maui and I just need to upgrade it basically to win ui3 but you know this is my app it's great exactly for what I want it to be am I building a lot of stuff I would say that there's um some really amazing teams doing some amazing crazy things on desktop so it's come really far but a lot of people that come from like WPF or uwp that are like used to templating and this and that it's like there you know yeah it's nice oh there you go yeah Matt catalyst is great Tyler I agree yeah uh Bluetooth Ellie yeah I like it just really depends like getting any framework 100 Pixel Perfect on desktop and mobile XYZ like it's always gonna be a little tricky so uh I think I can do can I do this can I do Dot bind and then kind of do uh Source property that work like sometimes it does stuff I'm like I don't actually know if that like works that does work that's amazing that's so cool is there any plans we could use uh for Mac more or a bus on vs on Windows I mean take a look at the the planned projects like Visual Studio documentation has a lot of that stuff sort of outlined now the team they just rebuilt like this the source control editor and a bunch of other stuff so there's a lot of work being going on there and it's obviously just recently rebuilt from the ground up with net six and I don't know if I'm done at seven now or what the plans are there but you know it's definitely coming along a long way okay so we have our image this should bind to these two things that I have here question mark we'll see that's cool now I am excited that you know the vs code stuff is coming along because I know a lot of people on Linux have been curious about like building apps over there and you know for Android uh and then you know using other you know Frameworks like like uh Uno or avalonia to do stuff so it's cool to see the different extensions sort of all happen I'm just gonna make this a little bit bigger all right boom [Music] I'm also curious let me close a bunch of these windows these are all very unnecessary to have open yes Sven if you want to pop to a specific page let me like give you a GitHub repo to look at foreign tracker probably this has a bunch of that stuff and it's in xamarin forms it was the same stuff all right support done there's any work on this I built this app live actually this one here is really nice app for my favorite apps it's no longer payable though but this one I popped to different pages all the time so you'd want to look at that that is for sure but if you just typed in like shell yeah like stuff like this this is like me like literally going to a specific page opening a thing automatically so oh hey yo whoa cool amazing so this is coming along great um Okay cool so we definitely want to we want to like definitely clean this up a little bit okay cool so let me just think four uh everything else is overlapping so I should really just delete a bunch of this stuff let's just be honest here because it's not helping me um this one also needs to have yeah that's correct Okay cool so that would be the label let's see if I have a here okay so we have that that's going to roseban two that looks correct we have a label here and then ideally yeah we would just have like another one another one time ago text property column two and then this would not be bold that would be end and then this one would be a probably a new uh image and this is going to be a close Source that's like almost what you want but not really do a new image but you'd want like a they do a font font image source code fonts [Music] oh I guess I can just do the font family yeah so I could do uh I guess I could do label and then I guess I would do like let's pretend like it's knowing what it's doing just to fill in stuff but it's gonna be zero column three and then I think I would do text and then I think I want like font awesome Dot find awesome icons and then what is it I go back to font awesome Dot dot dot ellipses it's a solid okay okay this should be using [Music] the helpers there we go that should pull it in there we go and then that should be there and then we should say dot font family and that's fast cool that work [Music] maybe you need to be an image label extensions [Music] yeah the rewriting comment I don't know about that I don't know if comments still doing stuff is it I haven't looked at comment in a while [Music] dot font I see family would be there we go that should be it we don't need a column span there's that and then you would want like a new label underneath it and then you would do bind and this would be label dot text property message yep so now we want the message [Music] I don't even know if you want to bind actually I think this is just like dot text and then you just pass this in I know I'm binding there that's just that there it's an ellipses that should work and then this will be the the DOT Row one column one yes indeed uh and then dot column span would be three yeah that's correct perfect cool then go from there mm-hmm let's just see what that looks like if it's any good uh in general pretty cool to format the document does that work I don't know it's all there cool uh um Texel says I'm muted on a Maui because you know how to learn Advanced layouts a different screen resolutions device orientations well one the documentation is pretty much amazing so if you're going to dot net and you go to dot net Maui Boop you're gonna find all sorts of stuff there should be good we also have a learning path when you go to training products.net and then right here A whole Don Maui learning path and there's my face amazing those would be the things that I would look at basically to go for all right cool hey you all right um oh that's end I want um we're actually getting closer surprisingly so we want this to be oh Auto let me just make this Auto to make it easier I guess and then we probably want like a padding in here right right padding of and maybe that'd probably be good and then this would be like I guess this is bottom we want this to be bottom yeah there we go and then this label is also going to be bottom this will be bottom cool and then yeah I know that's not a bowl that should be bold in general but let's see if this works it's getting better getting closer how's the performance of Maui Blazer versus Maui's ammo uh I don't know I mean the example is all compiled ahead of time which is going to give you a nice perf boost um there and we have some xaml don't worry but someone challenged me to do C sharp first at least for this page I think next week or whenever I'm back yeah probably next week I'll I'll continue this journey if you all are liking this and enjoying this I'm gonna probably pop back to xaml let me just be honest with you but that's me what do I know so yeah all code is not too bad I mean this is it's kind of nice like this is the page you know here's the cell that's not that hard it's kind of nice it's launching did I do it I thought the rethink would re would reload it but didn't reload it so there's that I don't really need more coffee every single day oh no where am I going to bring some probably all right cool hey yo we're getting closer okay cool uh interesting uh oh and then the other thing we want to do too is we want like column spacing of 10. and then row spacing uh oops 10. that looks good yeah why is that uh I guess that is the bottom fascinating [Music] those images are pretty small so I'm actually a little bit smaller and actually for the height ew Reynold thanks so much for the subscription if you haven't subscribed I put out videos all the time right here on my YouTube video page thingy over here so definitely give it ah look it's gonna do auto because I love a good Auto row definitions star I don't know it's not uh oh probably because I didn't actually wrap that let's try that yeah there's no hot reload on vs code yet there tarlane asks why am I not using xaml because someone challenged me not to use Amazon's struggle as if I'm a brand new developer understanding anything yeah there's that Okay cool so we have this this is good and yeah surprisingly the the the the row spacing is actually pretty small on the app so that's that's something I'm going to change there but now we're actually looking halfway decent surprisingly um oh you know what I actually want this to be too is like if this is gonna span the two rows I actually don't want it to be uh to be to be centered vertic or uh vertically I do want it to start at the top but I do want like a margin of oh Alan thank you so much for the subscription I super appreciate that um I think here I'd want like uh zero ten zero zero [Music] now do it ah thickness no overload for Mar okay I don't know you're wrong what did I do wrong Double O that's weird try to try that I guess vertical yeah I'm trying we're trying yeah new thing I guess yeah I could just do it yeah I'm kind of surprised that it like didn't do there should be an overload for that though like there should be I I'm surprised there's not another overload takes all four of them basically because it could have let's see Sandeep says I'm new to Matt could you please share any sample uh navigation between two screens um yeah I mean go to go on my channel just type navigation there's a Maui Workshop there's all these things just watch the video there's a whole navigation a video that I did talking about passing parameters and passing state check that out yeah uh VM to VM I mean you just use dependency injection so it just plop it in there um I guess yeah if you're doing it some other way then you know that's up to you man I use what's in the box that's maybe I don't even need that much maybe I need like just five there's gonna be a little bit of in between maybe I don't even need any difference let me try top maybe that should do it okay cool actually this is surprising I'm looking halfway decent I know what's up with the sizing but you know figure that out as it goes all right cool probably because these sizes down here I have these rows defined but um really I should just like Auto this stuff because why not okay cool now on the bottom there's gonna be a few things that we want so uh I think what we want is these threads thingies so um let's do this what we're gonna want first is a new vertical horizontal stack layout I'm gonna say uh children equals I'm gonna say new label and then we're just going to copy some of this there first oh oh my gosh oh my gosh it's very close I don't actually need a bind that's funny wow it's really cool I actually don't need most of this stuff here [Music] can I do that let me just double check here [Music] always a fan of just Googling this should do it or where's the code no code [Music] I don't see why I can't do that right have I ever thought about leaving Microsoft no I've never thought about leaving Microsoft it's been seven and a half years and I love my job I'm a manager now and I love my team and I I love my life um it's a great company I really love the direction that they're have been going and our shift um in this AI space has been really fun to watch but still you know just looking at the fundamentals it needs to be an array it does like that I can't be right I think I think it's like Dot pad all right do I have to do that I don't want to I don't think so it says it can't be assigned let me go to definition yeah you can't assign it interesting what this uh [Music] oh man I don't want to do that let me do I guess you could do it here you could say yeah you have VAR icons equals new horizontal stack layout I don't like that I do icons dot add that's silly look at this I don't know what are you doing like what are they doing I love it um I wish I had this margin extension though that's cool um this would be heart and then fast and then we don't need a text caller we don't need a margin oh yeah that should work can be simplified what oh look at this you just add them directly in there I don't understand how to write anything in C sharp anymore look at that you just shove them in there just shove them in there perfect amazing comment uh is there a let's see if there's a font awesome for a retweet comment is probably correct yep and then there's like a share uh that retweet it's called retweet I love it uh retweet and then there's send I bet it's send every object has a place for a new obvious correct send paper plane Goodall paper plane and then this will have a uh oh I see yeah I guess you uh yeah because you're you're filling in the the thing can I do can I then do like Dot and then I do spacing I don't know if they have like extensions for this stuff yet maybe I have to do like I don't think it's gonna have um in there yeah I could add margins to all the objects I don't want them to be margins to be honest with you but like I guess what I would need to do is yeah take this up and then do this and do like VAR um icons oops I messed that up somehow I deleted it foreign few edge cases I think I just need to update it basically but if I do now if I do like icons dot spacing set it equal to 10 then we're good right and then that's going to give me spacing in between and I should be able to do icons cool oh and then I guess on icons what I could also do is then I could do things like Dot hello Omari thank you for subscription oh my gosh one like that that should work no [Music] there we go perfect so you can at least add those extensions onto it which is kind of nice there should be an extension I didn't see the extension though yeah [Music] I mean I think that the time would be now to start moving in general and targeting either done at eight just so you can get all the latest and greatest stuffs in preview and migrate it over there's actually a net Upgrade Assistant um Boris is asking in the chat and go from there yeah [Music] so the other thing we'll need is like the number of likes that's cool so this would be row three column one and then we would also want oh surprisingly we would also want a new horizontal stack layout uh let's see if this can do it or not this will be enough [Music] to add this in there and then this is what would need to be here cool and then [Music] dot reverse Center vertically cool and then probably we want another this would be dot uh can I uh I wonder if I can do like a [Music] string format that's why I want string format and then we would want zero applies and then you could do you should be like is visible [Music] and then yeah I would do like here I would do a uh public pool [Music] is visible and then I would do like [Music] um is replies has replies this would be replies greater than zero and then public pool has likes greater than zero perfect and then you can also do like notified by it has likes and then it's going to be uh [Music] perfect so then what you could do is you could do like yeah you could do um dot bind and then is oops that's cool close has replies nice and then yeah you just put another one in here like this boom [Music] and then this one would be this is replies this is has likes this would be likes I think that works I think that's Ring formatting works I'm not positive I have to double check up uh [Music] Earth let's see how close we are I have I have no idea but I also do think that I would want dot column span to be three on this one this is going to go all the way across yeah let's do that okay let's stop it and let's reboot it up let's go yeah the reason you're going to want to obviously yeah start you know migrating now if you have like a xamarin forms app then you have bring it over to Donnet Maui should be you know there's a donet Upgrade Assistant there's tooling and visual studio to help you bring that over if you have just an IOS app or just an Android app that should be really easy to bring over just by changing the Cs proj files I did a little video on it I think as well um there but then yeah you know obviously the the stuff that you want to do is um hey yo actually looks pretty good wow definitely looks pretty good I'm kind of surprised I don't know why there's not as many lines in there how did I not um oh I was like where's my drop down there we go see that works it's actually surprisingly that's actually not too bad I did it all in C sharp people yeah the text is cut off there I don't know if it's because the cell is being reused probably um that could be a two let's see and then actually what you could also see is there like an have verified icon PNG let's see if we can get that in there let's see if I download that save image as oh definitely want that we wanna PNG people oh my God there's so many things this looks like a very shady website I don't like it I don't want to be here I don't want to be here what there we go nope how come I can't just save images off the internet anymore give me the images what what is going on that's not what I want [Music] oh you know what I could do I wonder if there's a font for for verified [Music] there we go certificate that's pretty good um check maybe Circle check ah there we go so what you could do is inside of here right you should be able to do something like let's do this where's my yeah this should be replies thanks and likes and then you can do oh is verified and yeah let's do uh true there we go I'm actually pretty I'm pretty proud of myself for just doing some stuff okay so there's that but then you can also do a new horizontal stack layout and actually what I would do is this watch this watch this people you're gonna love it I'm gonna do a um public class I'm gonna say space horizontal spaced it's gonna be a horizontal stack layout and then that's all I'm going to do that's all I'm gonna do people um and then what's cool about that is that I should be able to just do this [Music] and then get rid of this and make it all in line brand and Minnick would be loving this right now I'd be like oh my God James you've converted to doing all this stuff spaced and then here yeah you should be able to now do like a new and then put this in here just like that but I'm gonna put this this uh here oh that's the image oops don't want that the label there we go there we go and then put this here bring this over Coco cool and then we should be able to do this right and then this would be that bottom all right and then [Music] you should be able to do now a new label text what oh my God why does it know that it's a check it's not a checked circle circle check I was like man that's really good font uh is [Music] and then that bind there we go now we're talking there we go Okay cool so then if this aren't working this would be pretty cool uh oh and then you just make this blue right you just do a DOT uh text color dot glue colors there you go cool and let's try it again if so I'm like actually really happy about this because we made super great progress on like this one page you know and Scaffolding it out and doing it on C sharp which I'm just saying you know you did it oh there's a bunch of people using Blazer hybrid and Blazer in production already you have a bunch of your case studies and a bunch of other stuff to talk about all the time so lots of cool stuff boom look at that and then you probably want this also to be like bottom and bottom wow Barnum now the thing you'd also really want on top is is I would put here hey new a new vertical stack layout all right and then you put the list view in here but you'd also want to put a new all I gotta find now is threads app logo this one threads app little colors actually it's that's in the I guess it doesn't show it by default it shows it when you pull the refresh so okay fine that's also fine too all right so I guess I won't put it there actually so we can just put a list View [Music] cool and then you can do something like let's say we wanted to do is pulled to refresh enabled true yeah let's do that and then there is this other thing which is like if people reply it has these like little circle thingies um as well so I want to try that if you want to put a little bit of I do want to do a little bit of spacing here so let's look at this and then do like try 15 I guess I'll just see how that works for all those I like the likes in there and then that would be fine two hours that's good they're not developers bold check mark check mark [Music] interesting enough I really want to do like this should be like int spacing I should go here because equals 10 by default because here I might want this spacing of this one to be five for example [Music] yeah that's good that's good and then I kind of want these little tiny images here so I have to figure out how to do that I think it's like um I would want to do a man I don't even know what it is it's like a there's like three little dots so I kind of want to do like a um [Music] well I gotta go it's lunch time oh man I want to do like these little tiny dots but it's not am I gonna time I basically wanna do these tiny little dots here and then do that but let me just push this code and let's do that let's initialize a repository [Music] and then let's push it as a initial commit this in there that's a good publish brand I want to do it to GitHub public Repository there we go that should do it [Music] now I don't know if we would be here an hour ago we would be here an hour or so ago but it was good learning I'm pretty like a little pull the refresh that's good I'm pretty pleased I think that yeah we want these icons to be bigger I could say you know I could do something like you know VAR icon size equals 20 maybe that's a better way to do it actually it's like const icon size equals 20. that's better constant duh uh an icon size we want to put those there no it's fine it's good to like learn this stuff I should really learn this stuff because a lot of people have been asking me about c-sharp and doing this and going through stuff and you know even the data bindings are not that hard with this extension so I'm pretty pleased with that overall it seems really cool so I appreciate the challenge you know it's okay so for you know doing that stuff I I want to do like the little triple thing in there that should be easy to do different sizes that's really not that hard but just don't have time I had to go eat lunch it's been two and a half hours thank everyone for hanging out with me oh my goodness super cool oh that's that's better and then probably uh yeah those are like better and you put little tap events there basically I don't know why this is being cut off though it's kind of like weird maybe there's something in this message that's being yeah let me look at this uh oh maybe this just needs to be Auto right like it doesn't need to be star it should be Auto I think what I think about msax msix and publish to the store and publish that way you can also do the um the XE type version of it where it's uh unpackaged as well that's in the documentation does label have Max lines two by default no it's just because I uh just because the star right it was like setting certain Heights and it didn't know to like automatically do stuff so that's why now that looks much much much better all right nice not yeah none I want to select anything um fix cells and then here you just do like oops let's see if I wonder if this will do like new I was like I'm wondering how like smart the it knows a little bit how to do a little bit of stuff let's at least give us a little bit more data in here cool let's do one more load here and then I'm really gonna go people it's really gonna happen this is fun I mean I still have to do like images and links and a bunch of other stuff but you just get text like that's the base the base level of what where things started so that'd be cool then I obviously have to you know do some stuff there oh and then I also want to do like um um separator visibility none right probably that and then uh-huh like that and you pretty much got a threads app just saying you pretty much got a threads out people not bad all from vs go I think the intellisense for C sharp is pretty solid so let me see that thanks I got a push there we go sync it up hey you not bad just saying not bad you pull it down give it a give it a look it's up on the GitHub now his icons might be a little bit too big but yeah I mean there's something there are these other pages to still do but not bad you're gonna do click events and tap events and other stuff like that but you intercept this stuff too which is cool the field icons you know you really got to get the uh the font the font awesome you know the the regular ones oh you know what please hold [Music] I wonder if there's like [Music] they could have some stuff it could have um heart it has it all right let's see let's see let's see let's see is there a hole menu now house [Music] but there's a heart so I could go into here and at least for the heart let's see if there's a uh far and then is there a retweets there comment comment has one all right all right all right that's good and then there's like paper paper plane has one wow okay and retweet obviously doesn't even matter but let's just look at that might just do it [Music] yeah all those click events and things are just androidy stuff basically and you could intercept those and and take those off too foreign just saying just saying and I'm curious too if I did like here if we looked at um pretty far it's like what is the other one it's called pen to square has one wow amazing I didn't even look I didn't even look search I don't think you need that one home is the only one that doesn't really have one the uh uh let me see I'm intrigued because we're not just totally like improve the entire overall app overall yeah it's because it's transparent background in the cell and then additionally I turned off the click event which like highlights a specific item but I would probably put in like a ripple effect on my own with an effects view oh that looks a lot better so there we go yeah I mean pretty much they just don't have a home in inside of this uh inside of here so you would need like some sort of a hospital of course which is hilarious kind of like a home so it's really close besides that one but we'll leave it at that I think you could put like a newspaper in there turning to be kind of the home but yeah all right I gots to go I'm gonna commit this code new icons all right cool all right well thanks everybody for hanging out I super appreciate it I'll be around next week um on Wednesday most likely if you're in Redmond and vs Live come check it out I think I'll be doing another live stream with my buddy Jesse who does um what's it called so dumplings and something uh but basically interviews people and we're doing a hot ones challenge with dumplings and he interviews me about careers so I'll tweet about that so that's on his twitch but I will give that a look I want to thank everyone for hanging out really appreciate it thanks for all the subscribes all the comments all the great chat we'll be back next week with more threading in the threads app thank you all so much bye-bye [Music] thank you

Channel: James Montemagno

Views: 7,663

Keywords: .net, .net 6, .net maui, blazor, c#, james montemagno, maui tutorial, web assembly, web development, wordle, xamarin, xamarin.forms, conference app, dotnet maui, app building, migrating, xamarin forms, dotnet maui migration, migrating xamarin.forms, migrating xamarin forms

Id: AZ1itc4y-RU

Length: 159min 46sec (9586 seconds)

Published: Fri Jul 14 2023