all right we have Maddy Maddy Lachey is here and you're gonna show us xamarin so productivity in xamarin I am yes awesome so whenever you are ready great yeah so I'm Maddy Legere I am a program manager on xamarin I work on tooling and most specifically xamarin forms tooling but what I am going to show you today are across your whole development lifecycle a bunch of different ways that you can boost your productivity when making your xamarin forms and xamarin apps so i'm gonna share my screen we're gonna do some slides real quick I only have a few only have like 30 minutes so I have a bunch of things to get through and then we'll do a demo some stuff towards the end give you some links close out my face on top Oh minimize that by okay and then hey present okay this is good channel 9 oh good yeah I'll take that as a yes I haven't heard anything otherwise oh great so well boosting your xamarin development productivity like I said I'm Maddie we're gonna jump right into it if you have not heard of xamarin before xamarin is Microsoft's open source app platform for building apps for any kind of mobile or watch or TV that you can imagine using dotnet so you see sharp you use all the familiar tools and things that you are used to but you also get a hundred percent native access native API access to those platforms so if you're building an iOS app using xamarin iOS and you want to use the latest and greatest features like dark mode and all that you have all the ability and capabilities to do that using c-sharp so you don't have to go into Swift or Objective C ever so the architecture of the xamarin app if you haven't seen this slide before it's basically you have all the projects for your dotnet project where you can share your c-sharp code your android and your iOS and your watch and whatever projects and then you have a whole bunch of shared c-sharp your shared business logic your shared api is using xamarin essentials to do things like turn on your flash and turn on or use the accelerometer and then if you're using xamarin forms you can share all yours Amla UI and then you still have these three iOS Android and and your uwp or a watch or whatever other projects you have in there to drill down to that native code so they're super high performance like I said you get all the native API access that you need so you never have to go into a different language if you don't want to you can do everything that you could do with native mobile using c-sharp so let's jump into what we're gonna talk about today which is ways to boost your productivity when you're using xamarin or xamarin forms so you know Visual Studio for Mac Visual Studio for Windows that was the the big splash earlier this week is we shipped 16.3 on Windows and 8.3 on Mac which both include some great updates for exam and developers and you're productivities as well as like the whole 16.0 and 8.0 so the the 2019 series has been super super focused from the tooling teams and xamarin on making these four steps of your life easier so when you're coding when you're building your app and then deploying that app onto your simulator or your emulator or your device and then you know increasing the speed with which you iterate so whether that's your UI or your actual code or your business logic we want to make all of these steps faster so first and foremost the thing that you do every day as a developer is you're gonna be writing code and things like we wanted to do on both Windows and Mac were increased the speed with which you could write code and the accuracy and the confidence and get rid of as many typos as possible so the one of the things that we brought over was Intelli code support from the entelechy manned visual studio for Windows they were able to make and Teleco work with xamarin forms zamel which was fantastic so if you aren't familiar with Intel akkad it basically you can see these little stars here it predicts what you're gonna type using a huge data set of similar projects so if you're doing uwp or WPF and your c-sharp or in your sam'l it's gonna tell you what it thinks you should type next it'll tell you the properties that most people type with when they open a button tag and likewise with like new tags or new layouts so it works out of the box with xamarin forms amal and we're also working on bringing it over for android xml for xamarin android projects which will hopefully really increase your UI coding speed and it does already work with c-sharp for all your different projects which is fantastic on the Mac side we've done a bunch of different pieces of work to bring together the experience between Visual Studio for Windows so what you expect from your intellisense there and your refactorings and your quick actions and bring those over to Mac and the first thing we did came out and I believe 8.1 and it was a brand new optimized code editor so the brains of it are shared with Windows so what that means is these things like multi caret editing and your quick actions and being able to do things with like right-click for each to link all of that great stuff that the visual studio for Windows team at an editor team did those all came over using the same brains and logic but we also rebuilt the editor surface itself so that it's super fast super native very fluid you get right-to-left tech support you get different language support and you get emoji support all important things and so once we brought over the code and the c-sharp editor we then set our sights on the zamel editor and using the same method so sharing the brains but having this native super fast editor we were able to bring over the sam'l intellisense in engine from windows so now right out of the box with Visual Studio for mac you're gonna get really really rich intellisense with your zamel so auto completion and things like fuzzy matching and substring matching and things that you'd expect from your intellisense on windows all the autocomplete lightbulbs refactorings resource completion namespace completion the list goes on and on so as always you can check those amber and blogs for details on all of these things but these are all in Visual Studio for Mac the code and sam'l editors in the stable today and been there since 8.2 so hopefully you've been using them for a while so another thing that we've been working on separate from the sam'l and c-sharp site is the Android XML experience so there's a lot of stuff going on in this world I highly recommend you go and watch John Douglass's talk from last night he went into depth on a bunch of the improvements that are going on from the Android SDK and tooling worlds so go back and watch that I'm not gonna get too much into it today cuz he did a really good job covering it last night but this is just a sneak peek of some of the great things going on like layout linting and new intellisense and light bulbs and great stuff with the xml world great so you're coding faster than ever you're super accurate your Intel ACOTA is writing all your code for you you don't even have to think anymore makes it super easy the next thing you have to do is build your app and we always always always are looking at ways to make building faster because it's something you have to do every time you want to validate a change you make so if we can save you a couple seconds every day you might be making less cups of coffee while you're waiting for your builds to finish but we're gonna make you a much more productive developer so using one of our reference apps that you can grab on github it's called smarten hotel 360 it's a huge app it has a bunch of dependencies it uses custom controls it's got a really intense UI and lots of pages we use this as a benchmark to test a whole bunch of different improvements we did to our build system specifically for Android because we wanted to target that first and we are excited to share these results from Visual Studio 2019 and these are a couple months back the 16.0 figures but it's continued to get better and better since we shipped visual studio 20 1960 now and 8.0 and April April so you can see here like the times for first builds incremental builds and deploys have gone way down and that hopefully saves you a lot of time every single day so we did a performance challenge with all the different improvements you can make to your Android app and make your builds faster and your deployments faster and all that great stuff so definitely check that out that is also on our blog it's also on the github the I think it's on John Douglas is github and I'm sure he's also talked about it in his talk last night so check that back out so that's building faster which is a huge part of what you do every day and then you build it you hit play in Visual Studio and you have to deploy your code to your device or your emulator your simulator so deploy is actually kind of a two-fold problem because hey you want to deploy things faster and you want to make sure that you can debug as quickly as possible but you also don't want to be giving your end users and your customers a huge app so it's a tricky problem we've been working on solving in a couple different ways one of the first things that we did was called startup tracing and the idea with this is that there are some things we don't need to redo every single time you deploy and we can actually ahead of time compile some of the code in your app not all of it because that makes your app size huge but some of it to give you a much faster startup time so you can see what these stats here with when you do regular äôt so you compile everything ahead of time you save over a second in your startup speed but you also double your app size which is really bad with profiled äôt which we call startup tracing so we looked at the things that we can pay ot for you that aren't gonna make your app huge so it's only a four megabyte increase in this sample app but you still save over a second there with your startup speed so it's much faster and the best part about startup tracing all you have to do is take a checkbox to turn it on so go into your Android build settings enable startup tracing boom done faster and not that much of an increase in your apk so another thing we're doing with deployments and this is more on that size side of things is something called Android app bundles an Android built this functionality in recently it came out a couple months ago and there's a bunch of but a bunch of talk about it but basically the way Android traditionally worked is they downloaded everything you could ever need when it came to languages and screen sizes and all of that and that's why your Android apps were huge but what you can do now is very easily use something called an Android app bundle which will download only what your device needs so if I have specific languages that I use and I have one Rose Ellucian on my device and one type of processor that is the apk that might my phone will download for me and we have support for this now in Visual Studio 16.3 and 8.3 so go ahead try it out and this is also part of that Android size and performance challenge so you can see people's results with that right away as well on this Ameren block alright so let's see how we're doing on time Oh plenty of time good so now you are coding faster than ever you're building faster than ever you're deploying faster and you have smaller apps which is great then you want to iterate on things and something that we know folks tweak the most is you eyes so you're pushing pixels you want to make sure that button is just a little bit bigger something's off center and you have to fix it but waiting for those builds and deploys for just a small like one-line zamel change can be really painful and that is where zamel hot reload for xamarin forms came from and so we announced this back in July as a private preview at xamarin developer summit you can watch that whole announcement on the xamarin Developers YouTube but we are excited that in Visual Studio 16.3 this is built right in there's no setup there's no private preview there's no you know like anything you have to do or sign-in or anything you can go in and I'll show you how to do it and take a check box and you can start using sam'l heart real it for exam room forms so the feature itself is still in preview which means that there are still things that are going to change and there are still things we know we need to work on but we wanted to build it into Visual Studio so you can start using it right away and not have to do anything weird and give us your feedback so we can make it better and push it to be a stable feature as soon as possible so like I said you can get it with 16.3 or 8.3 today I'll show you how to turn it on in just a minute but some of the key points for sam'l hot reload for xamarin forms are that it's just running your app so if you haven't heard of a hot reload before the idea of it is that you deploy your app you change your sam'l or change your UI and in whatever language that is and if you're using something else you hit save and then your app quickly refreshes just the page you're working on and it saves your navigation it saves your view model and you can just see what that change is gonna look like super quick feedback and what we did with our heart reload is we made sure it was really smart it was really resilient it leveraged the amazing tools you have inside a visual studio like your intellisense it works with your custom controls and your third-party libraries and frameworks it works with all the great new xamarin forms features and it works on your Android or iOS emulators simulators and devices so anywhere that you're gonna be deploying or your xamarin apps you're gonna be using sam'l hot reload you can be using sample hot reload so let take a look at how it works so I'm gonna close out of my powerpoint hopefully this work is fine no Skype notifications which means I hope everyone heard me okay I'm gonna open my visual studio and here I am I am in James Monte mag nose monkeys app so there's a couple reasons I like using this app as a demo one is it has a custom controls and a lot of other things but I haven't changed anything except for an updated heads Ameren forms so xamarin Zabel heart reload does requires Ameren forms 4.1 if you want to learn more about why we have a good blog post about like the somewhat of the architecture of it you can go see that on the xamarin blog but if you're not on xamarin forms 4.1 yet it's 4.2 is the stable now you have no excuses go upgrade it's great lots of new features in xamarin forms so i upgraded that and then all I had to do to start using zamel Heart reload is go to visual studio preferences and if you are on Windows I know I'm on Mac you can go to tools options and then xamarin hot reload and Mac it is visual studio preferences projects xamarin hot reload and then click this checkbox enable zoom or not reload so then I'm gonna hit play start debugging I already have my emulator up you can see I'm on iOS 13 so fingers crossed because as I'm sure you all know the update craziness no you never know what breaks but it was working earlier so it's gonna build my project it's gonna start spinning up all my hot reload assemblies and boop-boop take its time nothing in the output okay it's thinking that's successful okay so hot reload is nice enough to tell me that James had his linker on so I can go ahead and it's still gonna launch my app hi reload isn't gonna throw up everywhere but it's not gonna work yet so let's close out of this stop debugging and I'm gonna open my build settings with this little button and James has it on linked frameworks SDKs only so you're gonna set it to don't link right there so definitely I've had some questions about this from the private preview why do I have to try up a linker well first of all you shouldn't have your linker on and your debug builds because it's going to make your build slower and linking is just to make your apk smaller or your app if you're using the iPhone itself like a physical iPhone you want to put in the additional em touch arguments - - interpreter and that tells your iPhone your physical device it's okay for visual studio to spit code back at your device and make it refresh it otherwise Apple doesn't like when you do that but that's how hot reload works it just sends more code to your device so you don't need that for the simulator but make sure that you do set your blinker - don't link and then you update your xamarin forms okay let's try this again hit play boo build successful great so it spins right up and OH encountered a problem what don't do okay let's try this quit that quit that and we'll restart Visual Studio a classic yes yeah so hot reload it like I said it's a preview feature but it has been tested with all the latest bits that we shipped out so your your iOS 13 and Xcode 11 and your Catalina it does work with which is awesome and then we'll just go back into visual studio sometimes you need to do like a good old bit obsolete but this should spin right up for us I don't double check that my linker settings I set those right and I deleted interpreter yep iPhone simulator got my supported architectures taking its time and eyes that make sure my same reformed version is good yep let's do it all over again I mean every bill did you do that all right there we go connecting watching oh no what's going on oh oh all right let's try updating my Zam reforms one more time if you haven't seen the new solution level Mac nougat package manager it's fantastic by the way so I can go to manage NuGet packages for my whole solution now check my xamarin forums late a stable good at package select all my packages make sure we're doing good on time close that out and we'll do a full rebuild after this one and hope that works if not we'll switch to another project and see if that one's working okay rebuild all let it clean let it build do double-check my build settings one last time while we wait this let this happen yo yep yep this is when I would go make a cup of coffee if I was a xamarin developer but I'm sure that I'm getting a bunch of messages right now like clear bit on so let me check that too while we're here reveal and find her oh well let that build and see I play Connect let's go and yay okay great a classic rebuild it does the trick every time and hopefully I don't run too short on time but we still have a few minutes which is good so we are in like I said James's Monkees app which is awesome it shows you a list of monkeys this like I said it was a mohawk reload it's just running your app so literally I can click in and go to my different pages I can pull it down and scroll around just like I would if I was on device I could be using my device and screaming it or not I know it were great so the first thing I can do is I can go ahead and like start switching up my bindings so change location and change name so now this should say Africa and Asia up top and baboon on the bottom which is great but exactly what I wanted and you can see how instantly that refreshes so I can switch it back hit save good to go James has this amazing circle image custom control and it's pulled in through nougat it's right here Oh didn't mean double click that Oh what you don't have focus is something blurry okay I don't know I just heard something but I can change the color of this to blue hit save I can hear you Channel nine hi Jamie so okay yeah so I've gone and I've changed in the border color I'm changing the border thickness my custom controls update right away I can go into like this page so I'll I can click on let's go to this Golden Lion and like I said it does hold your your navigation and your view model so what James did here was he found his view model in the code behind so right here which means that when I hit save and it refreshes my zamel page it's not gonna try and reload my view model every time so if I go into the details page here which is this page I'm on right now I can do things like change the location and the name and change my border color change my border thickness 23 and hit save and all of those things are going to get updated right away on my emulator my simulator right to the side here so that's kind of the basics let's go into a shell app as well so I'm gonna stop debugging that open another visual studio and hopefully this one's in a good mood to do do I have to pin abdu this one as well but we'll see hit play and so if you didn't see David or it now stalk on Monday afternoon or morning Pacific time maybe that is all on demand right now you can go see it on the YouTube and the twitch but he went into depth about all the great things you can do with shell so if you haven't heard of shell before it's basically a way to describe the visual hierarchy of your app in one file so you'll see the the exact same app we were just looking at sort of with the with a browse and a list view but this one also has the about page they're all described as these tabs right here and I want to show in this app some of the other great features you can do with hot reload so one of them is being able to change all your resources so if I wanted to change the color on this about page of this button I'll hit save it's immediately gonna refresh and change that static resource up here which is down all the way down at the bottom of the page and this button now if I wanted to move these resources Wow I'm running my app to my app dogs Amal resource dictionary or merge resource dictionary somewhere I can cut it and hit save now hurry low doesn't know where those resources are anymore so you can see it doesn't crash the app instead it just uses intellisense and that great new zamel editor on mac to tell me that it doesn't know where that static resources anymore and then it just takes out the things it doesn't know what to do with so the sack layout is still there it just took out the background color cuz it doesn't know where to find it so I would go drop these in my app resources hit save because I just edited an app level file it's gonna take me back to the beginning of my navigation state but if I go back into my about page all my resources are back there and I can go ahead and change this to something like fuchsia which I can never spell alright and hit save it's gonna bounce me back to the top navigate right back right there and then I can go ahead and change where this is referencing it from so if I wanted to change my background color to primary - and hit save there we go perfect you can see the intellisense pops away when it realizes that resource is there additionally I can go into my shell and start editing things there as well so if I wanted to change like the actual primary navigation color of my app so let's make this lime this is gonna start being a really ugly app in just a second it pops back to the top because it's an app level file app shell but it's gonna change my color right there so let's change it to black so you can see those tabs a little bit better and then I can go ahead and do something like copy paste this tab a couple times hit save and see them immediately pop up and because shell is handling my navigation for me and because this is using content templates in the data template for about page the navigation already works and this is all just editing my zamel so super easy again it's resilient so let's say that I misspelled the color black because I'm really tired it's just gonna get rid of that color for me it's gonna highlight it and it's gonna tell me it doesn't know what that color is so that's kind of the the nitty gritty getting up and running with hot reload and seeing all the different features it has like I said it's a preview feature so definitely report problems on help report a problem right here or help send feedback or porta power of them on Windows and let us know what other features you want for sure so let's pop back into the sides real quick I only have two more slides one is a bunch of links so I should have linked to all of the amazing already existing exam Rand talks but you can find them all from the page that you're on to watch this right now so do that additionally you can learn more about hot reload in the public preview an aka MSI's amo hot reload you can learn about the docs at Samuel hot reload Docs and that's where you will find all the things I showed you about how to set it up and some of the features you can do with it and then if you want to go check out James's app there's the github right here as well there's one more session on xamarin and dotnet conf it's tonight it's mixed reality with xamarin a geospatial anchors which is an amazing talk it's by sui key so definitely go watch it if you are around at that time and that's it so hopefully we have time for a question or two I know there was some demo issues but love to get your questions and as always feel free to tweet me or email me at value one or one and I can get back to you so let me stop sharing my screen and then we can do some questions hopefully there were a bunch of questions but James answered them all yeah oh wow now if you have any directly from Eddie James and Pearson in the channel answering them as well yeah sorry for the interruption there do you mind closing your screen so we stopped getting the screen section oh is that what's going on yeah I stopped sharing it but it's still showing my face that's all they're weird all right well cool thank you everyone well thank you so much all right Jenna later he's at for Easter night okay yes all right yeah we're going to switch over to Elton and thanks Maddie I
Wednesday, 23 October 2024
Beyond Copy + Paste Creating Interactive Documentation
next up we have beyond copy and paste creating interactive documentation with Maria Nagaya thank you so much Mika thanks everyone for staying tuned with Netcom 2019 and thank you for listening to my talk so my name is Maria Nikita I am a senior program manager on the visual studio.net team and I want to talk to you today about interactive documentation and how we think about that and how it's important for first-time developers as well as developers who are continuing to grow and build on our platform so let's talk about documentation documentation is how we build trust with our developers it's how we educate people it's how we sell our products and good documentation means that we are as invested in our product as much as you are it's important as we build our documentation from first-time developers to people who are building code every single day that we make sure that their own ramp is as smooth and as effortless as possible so let's talk about documentation today for a few minutes with documentation today it's getting really good but there are still a few assumptions that we continue to make about our customers first is the assumption of knowledge sometimes when content creators are writing documentation they assume that the people coming to our documentation have prior knowledge of the framework and the languages being taught the assumption of tech as a content author myself I sometimes continually find myself thinking of my experience as the only experience I sometimes reference the operating system I'm using I sometimes reference a version of Windows I always assume that someone has as good internet bandwidth as I do so a good example of this is providing links to certain specific downloads as well as screenshots that only reflect a particular operating system and the last one is the assumption of time we are all really guilty of doing that we assume that the people coming to read our content or use our videos or a documentation have more time than they do usually when people are learning things trying new things or testing something they have a limited amount of time whether you're an educator a hobbyist or a seasoned developer you're probably doing this over your lunch time or just before you go to bed or just before you start work so we need to make sure we cater for that so we look at documentation today majority of the documentation looks like this it's static code right and if we think about this from the perspective of a net u developer a brand new first-timer they're often left wondering what does this do so we then go to stack overflow we copy and paste a bunch of code from here and there but then we still up for the challenge especially as first-time developers what template do I use in Visual Studio what libraries would do I need what do all these error messages mean we are telling people that for their first few lines of code there's a huge on-ramp or even just to run a sample for seasoned developers you're probably working really fast and you don't want to copy and paste in a copy and paste code in and out of your codebase you just want to see if this is the best thing for you so we've noticed one thing as we begin to improve our documentation our expectations have changed and we expect more from the people building our content to do more video has done great work in this space and we just launched right now with dotnet videos on how we are investing in videos and how we are making sure that our developers have an interactive experience where they're able to listen pause and rewind but still we're assuming a bit of time on your side but it's really good content so please go and look out look it up another thing is interactive snippets online this has actually become a requirement for languages and frameworks when you can see popular languages like JavaScript and Python allowing people to test api's and syntax right within the browser but we're also seeing it in popularly emerging languages as well such as scholar and go where people are able to interact and test API is right within the browser but puzzle this is just a few pieces of the puzzles right so we have video on one side we also have syntax iteration online however people want to have experiences that Feliz native to the experience they would have in the browser we're seeing this in places like Microsoft learn where people are able to try and test things out which would be similar to what their local experience would be so when they do transition into an offline experience it feels vaguely familiar but then we also have the concept of trying now this is something I constantly do if I want to try out a new NuGet package I will create a throwaway predicate see if it's working I will delete it I will do it again but you're seeing places like MPN with the help of companies like run kids creating these experiences online we should be able to try out on you get packages and see what they're like right within the comfort of our browser and what we're continuing to see here is a narrowing of the divide between documentation and code and the reason why we're seeing this is a landscape is continuously growing we have developers such as people who are watching this show writing blog posts every single day we have hobbyists and the hobbyist field just keeps on growing from makers to web developers mobile developers IOT from social media influencers where they're just constantly learning how to own their own online experience we have data researchers who are using and mining data making these analytical choices to make more informed decisions we have educators both CS educators as well as non-technical educators where we're seeing in primary and secondary schools all around the world where non-technical teachers are given the task to unwrap the next generation to be comfortable in this new world of coding and finally we have our students who want to explore and learn as much as possible and we need to provide those opportunities for them so when we're creating these new experiences around documentation especially at Microsoft there are things that we wanted to make sure that we landed very comfortably with the customers we wanted to make sure that they had up-to-date documentation nice and fresh referencing articles are when were from 2019 versus 2003 we wanted to make it engaging and engaging is not just about making it flashy and cool you want to make the navigation really easy you want someone to land on a documentation page I know where they need to go you also want the steps to be clear and quick and easy so if you got go-to dotnet right now and you go getting started you will see how to get R up and running in ten minutes giving people the moment to feel empowered in ten minutes or less and finally we wanted to create a friction free learning experience we wanted someone to be able to go onto a web page and learn about the language without having to install all the tools or know everything and in 2017 we launched an interactive online experience with a product that I build called Trident net which allows people to experiment and try dotnet the language within the browser so let's talk about more about the Trident net interactive experience and what we offer them we have our initial goals were in 2017 was to have an interactive documentation online bring us up to speed with the other languages that had been providing this for their customers most importantly we wanted it to be login free we wanted to make sure that someone didn't have to install everything on their machine in order to just write console dot write line HelloWorld we wanted you to give that quick win and finally we wanted a fast on-ramp we wanted it so you could edit the code online click run and see the results we wanted you to feel that moment of success but we also noticed that Trident net is growing and those are some of the wonderful things I want to share with you today so when we first began in 2017 we wanted a friction free online experience and we did that with Trident net and you go to dock stopped Microsoft comm you're able to run c-sharp code right within the browser but as we began to notice that there were certain difficulties first of all what happened if someone didn't have good internet access what if somebody wanted to do this locally on their machine how are we creating that experience for you also we wanted to make a cheaper alternative that allowed people to run things easily within their website and luckily in 2018 we also got laser and it allowed us to pivot from running things and containers on Azure container instances to running things on the client side with blazer and only that because we created these experiences will also allow us to create a local experience with a.net try global tall and if you look at my slide right now we have a student in South Africa who calls is one of the most influential things that he's used that allows him to go and share c-sharp experiences with his fellow students so we thank you and we hope that you continue to use us and then we have a special surprise that I think a lot of you didn't expect but we also have dotnet running in notebooks and I'll be sharing that demo with you later today so let's go and see some demos now okay so as I said see Trident Nets started in the browser so if you go to any single sample on the docks of Microsoft comm quickstarts you notice that we have an editor right now you can copy the code over run it and you have the direct results you can also edit it easily right within the browser so you're not restricted by own but what is in the code and you run it again this is all running on blazer it's all running on the client side that allows us to create opportunities where people could possibly add this to their websites as well which we're hoping to enable in the future but I also talked about the offline experience if any of you have ever done a workshop or done a tutorial out there you've probably had to get people to download the tools clone the repo make sure than the right operating system and before you know it it's two-three hours into the workshop and nobody has done anything we wanted to make sure that people could be just successful with a dotnet SDK and the dotnet tribal global tool and get things up and running so I want to give you a quick demo of that so we have this repo it's our samples repo you can go to go to dotnet try slash samples on github and you'll see four clear extra instructions where we'll tell you to install the.net tri global tool which is available and you get today clone this repo then once you have this repo clone I want you to go into the directory and type dotnet try so as someone who prepares for demos ahead of time I did the first three steps ahead of time so I'm gonna great go right into here type dotnet try hit run and what this is going to do using kestrels going to start up my browser and it's going to give me an interactive markdown experience if you look at the top this is an MD file so I'm going to continue into introduction to programming with c-sharp and you'll notice that you have a list of instructions it's like an interactive book let's go ahead and run this code sometimes the first run can take a few seconds but bear with me you have hallo world I can go in change it again and I will put in my name run it again and I see the results this gives people the flexibility to run an experiment within the browser giving you that nice interactive experience so I hope that you'll give it a try for the next workshop that you're a tenth you're doing or if you just want to try give it a just try it out but the big question here is how are we doing this how are we able to have this mix of interactive code c-sharp code with a markdown file so I'm just going to go over to Visual Studio code and show you some of the magic that we're running so I'm just gonna close up the server here so this looks like markdown that you've probably written in the past if you've done anything with a readme file and if you add any sort of language language features within your markdown you usually have to use a flag so you notice that we have something called si si si s which is a c-sharp we are pointing to a specific region right so this is general c-sharp regions called intro we're pointing to a source file and we're pointing to a program dot C as in my app so let's see what this is if I go over to my program dot CS you will notice that I have a couple of regions adored you have a bunch of switch case statement and I have a region called intro so if I edited this and I said hello dot Netcom and I saved this file and let's just go ahead and run this again dotnet tri I go back into my introduction to c-sharp and I've edited it right so there's a seamless difference but another thing that we have to be careful with is that if anyone's written documentation sometimes it gets out of sync like how do we support our backing project as well as what we're putting in the documentation we wanted to make sure that we supported that so let's make some quick edits like how do we verify code so I'm going to go over to this code again and I'm just going to make some clumsy mistakes over here I am going to remove the Senate semicolon save that I am going to change from intros from intro to intros I'm gonna say that again and I want to show you a new addition we added it called dotnet verifying right so what it's saying sorry it's not net try verify okay so this is going through and it's actually checking your markdown and checking your backing project to make sure that everything's going okay and you'll notice that it says hey you're missing some things here you're missing a semicolon and we also haven't found the intros region so we wanted to make sure that before you hit push into github you're able to actually see any issues that might pop up and we're allowed we enable you to do that if you're someone who would prefer to see this in a UI format it's also supported on the server on the UI side as well so I'm just going to click do this do dotnet try it's going to launch the localhost again and if I go over to the introductions it will tell me that the region hasn't been found so on both sides you have this experience where users are easily able to catch what their mistakes are so let's go on some to seeing that if you want to look at this more you can go ahead to our github repo and please give the give it a try so I want to show you a little bit more and other experiences that we've been creating so I showed you the dotnet try global tool and I showed you don't know try running in the browser but I also wanted to show you something that we just did this week and I'm really looking forward to hearing your feedback if you go to our github repo and you do dotnet slash try and you scroll to the bottom which is pretty long you can notice that we have a lot of files in there you'll notice that we have the dotnet try enable bad but we also have launch to binder now binder is a project an open source project where it's able to point to a github repo and take out all the notebook files and run them in the browser so they spin up a nice container and you're able to look at it right within the browser over here I already got this started this is c-sharp notebooks oh sorry let me start that again let's launch binder this is going to take a few minutes because it's configuring a container for us and the beauty of like live demos is that this will happen as the circle spins around but what we wanted to show you here is that we want you to be able to try the dotnet notebook right within the browser we wanted you to play around with it let me make this into c-sharp we're going to go into samples and I have a housing ml sample right here right so let's walk through this experience you can install and you get packages right so this allows you to customize it a Dane you get packages that you'd like I'm going to hit shift enter enter what this is doing is it going to Newgate it's installing those packages for me this will take a few minutes but as we want you to know that if you are using this on your site you can install as many packages as you would like you can use work you can notice that we're using the ml package we're using Auto ml and we're also pulling that the data data frames NuGet package as well but as that's installing let's look through the rest of the code so I can run through it we're able to use our packages in the next cell as it some of you might know notebooks have cell by cell execution we also wanted to make sure that people had graphs being able to plot there so we wanted to make sure that people are able to display graphs scatter plots right within the new get packages was right within the notebook wanted to make sure that we made this feel authentic to people who are coming from the Python notebook space but we also wanted to make sure that our customers who are regularly who a regular dotnet developers but this also felt authentic and natural to them so I'm going to run the next browser maybe it's our next cell shift and turn alright and as you can see we have a nice table that has been delayed we've actually been able to display table of the housing data we can also plot some grass which I think would be the cool thing so let's start looking at some cool stuff all right let's run that again all right so I'm going to go over to duck's samples and housing let's pull in some packages bear with me I am so sorry but this should take a faster time the next time around we've installed our packages we're waiting for just one more which was been successfully installed let's run this the housing data alright so what we wanted people to be able to do is see the graphs and customize these graphs authentic clean and know ok so let's give it a moment and what we should see in a bit is a histogram that shows us H end of all the housing data across California well while we're doing that okay let's do it one more time think the third yes there we go it just needed one more time if you hit it hard enough it will happen so what we can see is that we have a histogram that shows all the data if you're someone coming from the notebook space we also have support so you can zoom in and see these things in more detail we also wanted to make sure that you're able you're able to do more interesting graphs like scatter plots so let's run this give in a moment all right and as you can see we have a scatter plot and you guess which state this is California sorry I don't have a live audience it's California as we can see the pricing is pretty high but let's say I wanted to zoom in a little more I can do this I can zoom in on some of the hot spots what this will do is I will actually cancel out everything else so we want that rich interactive experience that people have come to expect and we're looking forward to your feedback so if you have any questions on how to get started with the dotnet kernel that would come at around ignite time we won't have anything for people to try at the moment however we do have the mind binder experiences available right now so if you go over to our github page and you'll be able to launch it right there from launching launch my browser so we have a couple of minutes for questions I believe when we have a chance and we can give it a go we are ready for questions sake well hopefully you can see us here I brought my brand-new phone that was really awkward well you know the first thing that's kind of cool yeah yes yeah this one right here mica I feel about what you just showed us I think it's awesome have you ever tried have you ever tried tried net you're gonna love this I'm reading upside down it looks like a fairly simple way to learn and write some c-sharp code inside your browser without having to first create a visual Co solution plot plus lots of sample code aims at new learners check it out you have a fan yeah you really do and there's a there's a there's a gif and I'm gonna say gif for all of you out there listening I'm not I will not sage if it's not be nut butter okay of the the guy the Australian guy going like this two thumbs up alright what else do we have over here let's see wish this had been around when I was working on bit frost by frost by frost a few years back looks really impressive for dotnet open-source projects like I'm wondering if this guy's Thor I think you might be okay I think you might be ample time worth hi yeah oh yeah but of course hi for me to you alright here's another one from John great to see the improvements Microsoft has made in language platform documentation I still remember the huge stack of books from C 6.0 that's a long time ago should have included a back brace with the product this is pretty cool I love I love the idea of being able to learn and read as you go I'm personally a fan of notebooks I'm so glad c-sharp is coming to it and the try dotnet stuff is really cool so if you could give people one takeaway from your session what would it be it would be number one can you only be one or can I get two can you you could give as many as you want okay this is your session number one please go and try the dotnet try global tome give it a try make sure using it for your next workshop we're looking forward to hearing how you're doing with it we've had people try it with workshops that are pulling from Azure function so I would love to see more workshops with that also if you want to give it give the binder experience a try let me walk through that experience one more time so people can look at it because I had some technical issues because you know that's the world so let's do that so if you go to our github repo which is dotnet slash trying you scroll down all our code base you'll notice launch my binder right so when you launch my binder what this is doing is that it is spinning up a container for you and you're able to actually start running and writing that code right within the browser so it's pulling in the.net core SDK and all that kind of stuff now for it to even look nice um look at it in the lab format which I just think is always like a nicer way to look at this experience I'm a fan it's really cool I also want to point out we do have f-sharp support I don't know if people saw that exact is Phillips now they live in XNA we do have f-sharp support so if you weren't there you go to Doc's there's an output there is a bug which I can fix right now hit run but this has all the nice F sharp expectations that people will have and my team will continue to work on that fantastic um if you look at the C sharp as well let's go up when look at C sharp you will find two different samples you have one to the housing sample and just to give reference to this housing sample is literally pulled out of a data science book and Eric did a side-by-side and was able to replicate this entire experience right within the browser and we also have a repo one which I should have run to show you how we are actively keeping track on the issues that you're doing and we're actively trying to close them fantastic and then wait for ignite so you can start installing the bits on your machine all right nice we have another question is it possible to integrate try dotnet with doc FX documentation tried out net and doc effects not at the moment now okay okay and I think there's one more isn't this one yeah can I take a subset of the try dotnet code and use it to incorporate c-sharp scripts within existing applications Oh Jeremy good question yes you can just look at our repo and ask us questions and here's another one with another awesome yeah yep Yoda wise when it says so do what you can as there is no try try dotnet dotnet like I love the cool with Jupiter notebooks like that I'm trying to like parse it this is really good stuff okay it says so do what you can as there is no try try dot dotnet the cool with Jupiter notebooks tonic I will I will decipher that I think is a hideout net is cool and we're also excited about the Jupiter notebooks experience are we ready to go to the next yeah we have what's new in F sharp with Philip so Philip now is it Philip or fillers it's like doctor same with a British accent defib
Monday, 21 October 2024
02 Tabs Color
I have uh my code base here I got a bunch of files open but I can't really see how many how many files do I have open and you know I don't really know I can only see what whatever my screen resolution allows me to see how wide the screen is and that's why we always have had this little thing up here you can click next to the tabs and if you click that now notice how you can see the list of open files there are some that are grayed out and italics those are the ones that are not visible right now and then we have the ones that just look kind of normal those are the ones you see and the one in bold is the one that's currently active sometimes I kind of just want to see everything all the time so if I go to the settings icon I can now say show tabs in multiple rows and what's really nice here is that if you have the screen real estate if you have the vertical space you can now stack all these tabs so you can see everything that's open but there are some monitors you know that are extra wide for instance and in those it would be kind of nice if we can take our Taps and instead of having them on top then move them to the side where we have more space so again go into settings and click on Place tabs on the left it's really nice I can resize this to whatever I want but let's see what else we can do here because I have all these open documents and you can see by default they are sorted by the project they belong to and they're all listed under each of those projects take it one step further here what if we colorize these documents per project so now each tab has the same color if it belongs to the same project and that makes it even easier for me to kind of at a glance see where these files belong if we don't want it per project because I already group my task for project here like instead we could do it by file extension so that's also very handy so I can see all my racer files all my c-sharp files all my JavaScript files we can also go ahead and say let's do it by regular expression let's configure the regular Expressions it's a file here that opens up and I can start typing and let's say we want to do CSS and as soon as I save the file we can see the CSS file has now got updated with the color we have Razer and we can even take it further we can say you know everything that contains the word you know category let's say everything that has the word will be colorized so you can really customize how you colorize these tabs and of course if you move back up and use the tabs on the top they maintain their colors I kind of like to do per project when I have the tabs up top because in this case they're not grouped by a project and so having them polarized by project is my preference yours might be different but I really enjoy this
Building Bots Part 1
it's about time we did a toolbox episode on BOTS hi welcome to visual studio toolbox I'm your host Robert green and jo...
-
hello my name is Ron Lou and I am a program manager on the video studio team in the previous video we talked about how to inst...
-
>> It doesn't matter if I'm short or tall. >> Anxious. >> Or obsessed. >> Loud. >> Quiet...
-
so I'm going to show you an extension here called shifter it allows me to flip between values and the editor really really...