hi everyone today we're going to be talking about how you can convert a vs code theme to work in visual studio we've been on a journey to make visual studio as flexible as possible so that you can code the way you want and now if you're a theme author you can convert your theme to work in visual studio so that a wider audience can get access to your theme let's get started here are the things you'll need in order to convert your theme i'll note that you'll want visual studio 2022 preview 4 or later because it has fallback colors which you'll want just in case the json doesn't cover that area of the ui let's navigate to visual studio to configure our install i have the.net desktop development workload i also have the visual studio extension development workload in components i have net 5 runtime now i'm ready to go i'm going to be converting the winter is coming theme today i've gone ahead and applied it to my visual studio code instance on my keyboard i'm going to press ctrl shift p to bring up the command palette i'm going to select generate color scheme from current settings this is going to give me all the tokens inside this theme that describe the colors i'm going to save this in a folder that i previously created it's going to be a json file not a json c file next i'm going to navigate to our converter tool this is a free open source converter tool and if there's anything you'd like to see improved you're welcome to create a pr or create an issue i'm going to go ahead and clone this tool i'll navigate over to my command line opened in admin mode i'm going to clone using the git clone command after i clone this tool i'm going to navigate over to the folder that i've just created then i'm going to build the tool using.net build next i'm going to navigate into this folder i can run the tool using this command with the flag dash h this is going to give me instructions on how to use the tool i'm going to go ahead and convert my theme the flag dash i is the folder that i've created which contains my json file i can convert several themes at once by including several json files inside this folder the flag dash t is the target visual studio which will open and patch my theme so that i can take a look at it i also have the option of just creating the package def file without opening visual studio after it's loaded i'm going to navigate to tools theme and select my theme it's going to get applied there you are winter is coming next i can package my theme up inside a v6 in order to upload to the marketplace or share with friends i can navigate to file new project or ctrl shift n next i'm going to search for v6 and create an empty v6 project i'm going to name my project and then select create then i'll navigate to properties right click add existing item i'm going to select the package def file that i've just created this is going to be in the same output folder as my json file i'm going to select all files in order to see my package def file once i've selected that it's going to show up in the tree i'm going to select the package chef file and expand the project properties window for copy to output directory i will select copy always and for include in v6 i will select true then i'm going to navigate to the v6 manifest i'll navigate to assets and new then for type i'm going to select microsoft visual dot for source i'll select file on file system and then for path again i'm going to select the package stuff file that i've created and i'll select ok finally i can adjust the metadata inside my theme like my theme name author and version now the last step is to build it i'm going to go ahead and build the extension you can see it's working after i've built the theme i'll see a v6 file inside my output folder i can now upload this theme to the marketplace where there are a lot of other great themes already available and there you are winter is coming on the marketplace if you try the converted tool or if you try any converted themes we'd love to know what you think this process is always iterative always changing and we're always looking to improve thanks everyone
Wednesday, 23 October 2024
Azure Pipelines
>> Joining me today on Visual Studio Toolbox is Tupelo, Mississippi's second-most famous resident. We're going to talk about DevOps and Azure Pipelines. Hi, welcome to Visual Studio Toolbox. I'm your host Robert Green and joining me today is Mickey Gised. Mickey, how are you? >> Hi Robert, I'm excited. I'm very excited to be here. >> I'm excited too. I've been trying to get Mickey on this show for probably years. Now, that you are Microsoft employee, and you're in town, today is the day. >> I am. I'm a DevOps Architect on the Microsoft DevOps Customer Advisory team and I'm very excited. >> You are from Tupelo, Mississippi. >> I am. Now, Robert, do you know what Tupelo Mississippi is world famous for? We are a small 30,000 person town in Northeast, Mississippi. We get about 30,000 people a year that visit my town, half of which probably come from Europe. >> Yeah, it's the home of one of my favorite blue Sires, Mr. Paul Thorn. >> That is all- that is true but that is not why they are world famous. >> That would be the birthplace of the iconic Mr. Elvis Presley. >> That is correct. >> I didn't know that. >> Elvis was born in a two room, not a two-bedroom but a two room house in Northeast, Mississippi. So they come, they tour his house. They tour his church. They go to the hardware store downtown where he bought his first guitar at age nine, and it's still a hardware store, and then they drive up to Memphis, Tennessee to see Graceland where he got famous. >> Cool. But that's not what we're here to talk about today. >> No, that's not what we're here to talk. >> We're going to do some DevOps stuff. We're here to talk about Azure pipelines. >> We are indeed. Do you know what Azure pipelines are, Robert? >> I'm going to. I do but I'm going to pretend I don't for the purpose of the show. So, I do know about DevOps. I know about Continuous Integration, Continuous Deployment, your CICD Pipeline. Are the Azure Pipelines the same as those? >> It fits into that story. Yes. So, we have Azure DevOps which used to be called Visual Studio Team Services which is the co-version of what used to be called Team Foundation Server. So, one of the different- one of the components of Azure DevOps is Azure Pipelines, and it's been referred to by a lot of different names. They call it the Build System. It's got build. It's got the build ability to do Build Management, Release Management, all of those things but we encapsulate that into what we call just Azure Pipelines in general. >> Okay. >> What's nice about Azure Pipelines, is it works with a multiple or a multitude of different languages. So, we're talking Ruby C-sharp Python. You can use it to deploy both On-prem or into the Cloud, and you can target pass, you can target infrastructure as a service. It's got multiple different options for being able to work, and the goal being to be able to automate do that whole Continuous Integration, Continuous Delivery to honestly build better software. >> Okay. Cool. >> Because, I mean, the whole point of having a Build System is because, if you have multiple developers working on the same code, if you're not doing a daily build, doing a nightly build, running your Smoke Test, running your other- your Integration Tests, then, you can run into a lot of problems farther down the road. You can have a lot of bugs that creep into the system, and once that happens, that's Technical Debt and other things you have to deal with at a later point in time. What's interesting though, is you also need to look at your releases, not just your builds. Look at the Continuous Delivery aspect of it. Because with Continuous Delivery, the point is you want to be able to release in just say your Dev, your QA, and your Prod the same way, the same code every time. >> Right. >> If you're doing it manually, you might miss that quotation mark that you forgot to copy when you were copying over the line of code to push things out. >> Okay. Cool. >> Now, one of the things I like about Azure pipelines, is that we have the ability to build out these pipelines in a nice GUI Interface, which I'll show you in a moment, but we also have the ability to do it with code. So we can write what's called a YAML file and actually write some code that stays with the rest of our code to be able to make our Builds. >> Yeah. I definitely want to talk about that when we get to that point. >> Now, the other thing I really want to point out real quick about Pipelines, is it doesn't just work with Azure DevOps, it works with Azure Repos, which are the Repos and Azure DevOps. But also, they also works with GitHub, it can work with Bitbucket, it can work with a variety of different systems. So, it's very nice from that standpoint but what's really nice about Azure Pipelines is that, if I have an Open Source Project, and it's a Public Open Source Project, then I can get 10 free Pipelines on the service to be able to do my Builds from my Open Source Project which can really speed up the Build Time for some of these projects that are out there. >> Cool. Let's see how it works. >> Okay. So, where I got started, is that I wanted to create a quick little test project to work with. So, I use the Azure DevOps Demo Generator, which is a publicly available Demo Generator out there, which has like, a lot of different templates that you can work with. They've got ASP.net templates. It's got you know NodeJS. A lot of different projects. >> Some of our famous demos from Keynotes and launches parts. >> Exactly. >> All right. >> So, I work with Parts Unlimited, and honestly this is open for anybody to use and all you have to do is come out here and give it your organization that you want it to deploy to. Your Azure DevOps organization. Give it a name and punch the button and Bob's your uncle. There you go. Now what that created for me out here was a Parts Unlimited Team Project in my Azure DevOps organization. If you've not used Azure DevOps before, which I'm sure you have, but you have the board's area with a Boards Hub which is where you can do with work items. One of the nice things about the Demo Generator, it generates a ton of work items for you. So you can actually see how the Work Item System works. It also generates code for you. So you can see how Repos works. But what we're going to work with is Pipelines. So in the Azure Pipelines Hub, I've got my build section for building my code. That's the CI portion. I've got my Releases Section for doing the releases which is my Continuous Delivery Portion. We have a bunch of other features, libraries, and way to group like Servers. You might want to deploy too into groups things like that. But if we just go look at the Builds, I've got one Build here. I just want to show you what this Build looks like. I've got all green. If I go to edit, this is the Build System that we have in Azure Pipelines. So, for example, right now I'm deploying to Hosted Build. Meaning that I'm using a bunch of Build Servers that Azure DevOps has up in the Cloud for me to use. >> Okay. >> I can use those Hosted Servers or I can use my own Private Servers. Those are called Private Build Servers. Those could be in the Cloud or On-prem as well. Now, the Hosted Servers are really nice thought because the things you need to do your Builds already installed on them. The Pre-software that you might need to make things work. So, what you do is you select your Pipeline, you specify where you want to get your source from. In this case, I'm using Repos but as you can see, I could be using Team Foundation Version Control or GitHub or any of these options. >> Okay. >> Then you specify the agents that you want to use. These are the different jobs. I could specify multiple jobs. Then you have the specific tasks that you want to do in this Build, and these Builds just doing a new get restore and then it's just doing a Regular Build on the solution, running some tests and then publishing my artifacts out to a drop location where then I could use them as part of the release. >> The demo generator created that build for you if you are creating a build from scratch, that you have to know how to select each of these things in what order they go in? >> You would have to understand the basics of how your Build would work. What you do is just come here and add different tasks. There's different tasks for building, for doing tests, for maybe helping with deployment, and these are a lot of tasks that both Microsoft provides as well as there's a marketplace out there for other tasks as well. So, yes, you do can have to understand how what you're building needs to be built. Then, you can add the things in here that you need. So you can add the different task. You can also have variables in your build process. So, these are different things where you might want to be able to specify certain values that you- then you set the variable in the task itself, and then anytime you need to change it, you can modify the variable here. >> Okay. >> In releases that comes in very handy as well. You can trigger. Determines when you want to trigger. Do you want to do Continuous Integration or not. So, Continuous Integration being every time I check in or maybe every time I do pull request, depending on how you want to set things up. You can run certain tests to verify that everything looks good before it moves on to the next step in your process. >> Okay. >> Or you can even schedule on the nightly builds, whatever you want to do. Then of course, you've got different things where you can set your build number format, how long you want to retain your builds, things like that. I'm not going to kick this off because it could take a few minutes to run, but what I will do is come out here, and if you look at the results from one of these builds, then you can see that for each task, it breaks down what happened, you can actually drill in to each task and see the details of what occurred on that particular task. So if you've got errors in your build, this is where you would come to try to find the errors that were related to why you're build failed. Just got a good summary overview where you can flip through here to see what's happening. It shows you the test information, so when your tests ran, it shows you which ones passed, which ones failed. >> Assuming you had a test. >> Everyone has tests. >> Yeah. >> Right? You have to have tests. Then if you're doing code coverage, it has code coverage information as well. So that gets my code built, and then I store my code in a drop location. Since I'm building in Azure DevOps, it stores it in a drop location up in Azure DevOps. If I was building local, I could have maybe a file share somewhere that I might want to put those at. So that handles the CI portion of things, but then we have the CD portion of it. >> You can set it up so that every time you check in, the build occurs, or you can schedule builds, or of course, you could do them manually. But the beautiful things about the DevOps mindset is you have things happen automatically. So you can decide whether you want to turn on Continuous Integration, which is turned off by default, and have every time you check in, a build runs, or you just do a nightly build based on the code that's been checked in. >> Correct. Then also, you can just kick them off manually whenever you need to. The second half of this whole process is releases, we need to release our code. So again, one of the things that the DevOps build generator did for me is create a default release pipeline for me. So what this release pipeline is doing is I'm specifying the build that I want to pull from, and I could turn on Continuous Integration to where as soon as the build passes, it automatically starts releasing if I want to. What I have is different stages, different environments that I can relate to. >> Is that typically done? >> It depends on the organization. >> You would release it to test, I presume. >> We might release it to test and then have tests that are run. >> Just because the build succeeded doesn't mean the app works. >> That is correct. So you want to have gates in place to make sure that you're not just pushing out something all the way to prod just because. So what we've got is different environments. Now, these are logical environments, say, like a dev and a QA. You'll notice I've also got a production but I don't have it actually linked up. This is because in this scenario, I manually pushed to production. So what happens is this build runs, if I had Continuous Integration turned on, it would immediately push out to the dev environment. If we look at the tasks that make up the dev environment, since this is just a website, it just is doing an Azure App Service Deploy, and then it settings some variables specific to the dev environment. So it's setting some specific things related to the dev environment. >> So this is just a web app? >> This is just a web app, yeah. PartsUnlimited is just a website app. By the same token, if we go back to here, wait, let me go back to my releases, see this is the fun part, you can see that I've also got a QA where I've got tasks in my QA as well that would deploy to the QA portion of wherever things are. Now, I've got variables that I set, I set the website name based off of whether I'm in the dev environment, or the QA environment, or the production environment. So I've used these variables and I've set these variables in the different tasks in the pipeline to where then it goes, "Oh, you're deploying to dev". Let's set these variables, let's replace this stuff in app.config or wherever we need to make some changes. What we've actually got here with this pipeline is if we go back to my actual release, right now, we've deployed the dev. It deployed perfectly, but we're waiting on QA. That's because I can actually specify gates. So I can specify post-deployment conditions and pre-deployment conditions. So here in this pre-deployment condition, I've specified that someone has to approve it before it can go to QA. I've got a lot of different options, I can gate off of a web hook into something else, or gate off of tests completing, I have multiple different options for how I want to gate. Then it just becomes a matter of, "Okay, well, if you've gated, well, then let's go look at that release." I would have gotten an e-mail, which I did, and I can just come in here and say that I approve. Toolbox forever. Once I approve that, it will then start deployment into QA. So you have the ability to create these multiple pipelines that can release into multiple different environments. If you enable all of this up, we now have continuous integration. So when we're checking in, we're building our code, and then when we're building our code, we can have it automatically start going down whatever our pipeline processes to do delivery, hopefully, getting code out there faster, but also ensuring quality. That's one thing I think a lot of times people don't realize, is the quality aspect that doing this Continuous Integration and Continuous Delivery can give you. >> It really puts you in a world where you've got a work item, whether it's add a feature, fix a bug, you make the fix, you check the code in, and like, "I'm done", and you walk away. But you're not really done, you're done with your code which you tested locally, and it works locally with your current version of the code. But you check it in, it might've broken somebody else's code or somebody else's code might've broke yours. So the build itself may or not work. If it does work, then all the tests run, then it gets deployed, but all of that's automated for you. So you just code all day long, it's whatever time you leave, you check in, you leave, and then all this work happens automatically. The dev guys or the QA guys come in the next morning, and there may or may not be a new version. If everything went well, that new version's already there and they can proceed to testing. Nobody has to wait around and wait for somebody to do the release. Nobody has to go, "Oh, it's Wednesday? Oh, it's my turn to do the release? Oh, I forgot." It automates a lot of this stuff for you and checks to make sure along the way that things worked. So QA gets in in the morning or you get in in the morning and there's no new version for them, it's because something went wrong in-between you checking in your code and pushing out the new version to them. It's all automated, it's all logged for you, and you may or may not get an e-mail or text message at midnight telling you, depending on whether you want to, but you certainly could, right? >> That is all correct. >> Cool, and it's pretty easy to use. >> It's pretty easy to use. As long as you understand the general process, getting everything set up is pretty easy to do. >> You don't have to be part of a massive team, you don't even have to be part of a multi-developer team. I think even if you're writing just code for yourself, just an app you use yourself, you should run it through the full DevOps processes to get better at building software yourself so that even if it's just for you, it makes you better at delivering software, but now you have the skills that you can bring to work or to the multi-developer applications as well. >> I agree 100 percent. So let me take it one step further. I've shown you the GUI way of building out these pipelines. But one of the things that people ask for, especially with build systems, is a way to track the versions of their build pipeline with their actual code. So the way we do that is with what's called a YAML file. >> YAML. >> YAML. >> Which stands for? >> It depends on who you ask. But according to my research, it stands for YAML Ain't Markup Language. >> So it doesn't stand for yet another markup language? >> That's what I've been told. >> If you go to yaml.org, what do they say? >> Let's see, what do they say? Do they have YAML Ain't Markup Language? >> There you go, a myth busted. >> But YAML dot org is a great place to go to get some basic information on YAML in general. YAML, everybody you can define how you want your YAML to work. Everybody can define it differently but essentially what you have is structure that's enforced through indentation with spaces not tabs. >> Right. >> Key value pairs. >> Which is one of the first things you use when we're working with the YAML that that matters. >> Yes, yes it does. >> I found that the right way. >> That's why its very difficult often to just copy and paste YAML code in, because this code you copy it in and it winds up putting tabs in and then it doesn't work and you have no idea why. >> Exactly and it's basically a human-readable data serialization language. It's based off of JSON obviously, as you can tell. If we go and look. I love by the way, our documentation. if you go and look at the documentation for pipelines, they actually have a creature. First pipeline documentation section with a lot of different selections for you, so we've provided a bunch of the code you need to get started with creating your first pipelines using YAML. >> Okay. >> So what I did is, I took the pipeline's JavaScript one and I forked it into my it. So it's on GitHub Microsoft Docs pipeline JavaScript and I forked it to be just have my own version of the project and it gives you all this out of the box including a starting Pipelines file, so I'm now working with GitHub as my repo. So I'm able to take this repo and I'm able to clone it down and start working with it and my tool of choice for working with pipelines or YAML files is Visual Studio Code. Love Visual Studio code. One of the nice aspects of Visual Studio Code, if you're working with Azure pipelines, is the Azure Pipelines extension. Now, what we've got here if we look at this very simple pipeline, is we're basically saying, this is the pool, this is the image that we want to use. So this is the Linux image we want to use when we do our build and we're saying use the node tool task and just pitch, just for grins we'll change this to be eight instead of 10, just to make a change. You know what, I really want this to show up with a better name. I figure there's a way to do display name. You notice I've got a space in twice. But then if I do "Control Space" I get "IntelliSense" and I can say well I want to do display name and this is just going to be the node tool. Now this is a task that I'm going to run, one of those tasks remember when I click the plus sign in the GUI. >> Yeah. >> This is using one of those tasks. This is actually running a script. So it's going to say just run npm install and then npm test and I'm using some other tasks to publish out and publish the code. >> If you build a pipeline using the Visual Designer, is there a way to convert it over to YAML automatically? >> Yes there is, well not to convert it over automatically. >> To export it. >> But what you can do is, if I go to this build and I go to "Edit". What I can do is, I could try to view the YAML for this entire build. >> Okay, well there you go. >> Sometimes the build may be doing things like putting in, setting certain variables for me. >> Yeah. >> Then I have to make sure I add that to my YAML file. >> Okay. >> But one of the ways I've taught myself YAML and to build out some of these pipelines is to select a particular task you want and you can view the YAML just for that task. >> Okay, cool. >> I build it, first in the GUI to understand. >> Yeah. >> Then I can transpose the code over. Then of course once we've made these changes in Visual Studio Code, we can just and we save those changes. Then we can just come back over "here" and commit that locally. I could type and then once it finishes doing that we'll just push it on up to or push it back out to GitHub. >> Okay. >> Now what I've done in my repo in GitHub, is I've gone to the marketplace and I've grabbed Azure Pipelines and I've gone through a configuration where I've setup my team project in Azure DevOps to be connected to my GitHub repo. >> Okay. >> So that now since there was a check-in to my GitHub repo, it will have kicked off a build. If we come over here to builds, come on, you can do it. You can see there's my change node to eight. >> Yeah. >> It's kicked off my build process. >> How does it know to read that YAML file and how does it that that YAML file contains the information. >> Because I came into my Azure DevOps team project and I created a new pipeline and I pointed it to. >> That YAML. >> That YAML file. >> Got it. >> By pointing it to that YAML file you can see "There". I need no Tool. Now, what's really cool about this. Is that one of the things you have to remember is that you can come in here and it's not what I meant to click but you can come in here and you can modify the triggers. You can use variables. So, you have the ability, just like we had variables over in the build GUI and in the pipelines. >> Yeah. >> I can have different variables that I can access. I can set the trigger. I can point to a different YAML file if I need to, so if I ever needed to say, change the YAML file I was working with, I can a point that to a different area. >> Would you agree that if you're just getting started with these you should use the visual designer and then once you understand what's going on, then you can go over to YAML or you would just start with the YAML? >> The answer is, good consultant answer is it depends. For me it was easier to get started with the GUI. >> Okay. >> For a lot of people that maybe are used to using other build systems like maybe Travis or CircleCi where they use YAML files as well. >> You might have learned they're familiar with YAML files already that's what Helm charts are written in, if I'm not mistaken. They are used in Deploying Containers? >> Put this dust over. Think about it. Now I've got my build, and my build is now or the description of my build is now being version-controlled with my code. It's following me around when I branch. >> Okay. >> I'm able to track the changes to my build in addition to the changes in my code. Now this leads to the question, "Can I do this with my releases?" The answer is not yet. >>.Okay. >> The product team is aware of it and they're actually working on it. If you go to Microsoft slash Azure dash pipelines dot YAML, you can actually see the design docs that we have out there. >> Cool. >> Kind of what the plan is. They're aware that people want that feature. >> Very nice. >> So they're working on it. I'm working closely with some of the open source projects on GitHub to help them with pipelines and it's just a very, very solid robust product. So I really hope people will check it out. >> Very nice. >> So that was a great overview of the pipelines and I think we saw how easy they are to use. We'll put in the show notes. Number of resources, you pointed to the docks and the demo generator and a couple other things. People should just absolutely get started using this stuff and learning how to apply the DevOps practices in their development. >> Absolutely. >> All right. So thanks a lot. Thanks for being on the show. >> Thank you. This was so much fun. >> We will see you next time on Visual Studio Toolbox.
Awesome games with .NET, Visual Studio 2019 and Unity 2019
welcome back and today I'm going to be talking about unity my name is christos Matias I am a product marketing manager for unity and mobile and I have really created interesting this product you probably have had a lot of announcements throughout the two days so far so dotnet core Visual Studio and visual studio for Mac so today what I want to show you and why I wanted to pick up this session is because I wanted to showcase that with dotnet you can build some amazing things including games right our agenda for today is very simple I'm going to introduce unity to you just to let you know what it is and what he can build with it and then I'll show you how to get started if you never done get into gaming before like I haven't so it's a great experience to see how you can set up your machine then I will show you why you want to use Visual Studio or visually for Mac to write your games and we'll do that a few demos just to showcase the capabilities and finally we'll talk about why Visual Studio is so well aligned with unity and what makes it such a great product for debugging and writing your games or your 3d real-time applications and hopefully at the end we'll leave you with some learning materials and set you up for the next few sessions of the day so getting started unity of course is a is a the most widely used real-time 3d framework right it started as a gaming team but now they're targeting different industries so the goal there is to give you the tools to create applications for not just games but 3d real-time applications and they're the most widely and known engine and it's built on dotnet so if you are Dalton a developer there's nothing stopping you from writing games starting today and the nice thing about unity is that you don't just have one platform but you have over 25 different platforms whether you want to develop games for xbox whether you want to build solutions for the run on Windows or Mac OS obviously mobile is very big mobile games are fantastic these days and many people monetize on that so if you want to build things for that and that's also their TV OS that the platform is insane so taking your dotnet skills with a unity and our IDs means that you can build almost anything for any platform out there and getting started obviously the first thing that you need to do and you need to be aware of is that ever since twin 2019 point to version of unity things have changed quite a bit on how you install and unity so there are two ways to get started with unity one is you go to the unity website and you download the Installer and then allows you to actually go and get the bits that you need so it's a unity first experience and many developers that know unity will start from there but if you're already a Visual Studio developer there is a way for you to add the unity workload to allow you to get started so we'll we'll see how you do both so if you're inside Visual Studio that you select the game development with unity and that will download the unity dependencies for you and the other way around if you are ready on unity then you can go and add the components that you need so if you aren't on V on Mac OS then it will download the adversity for Mac components if you're on Windows it's clever enough to let you know that you need to download Visual Studio so I already have both the installers here so if you're in visited installer it's just going to modify it kicks off the modification of the latest version that you're using today we're using 16/3 which is the latest and greatest and if I scroll down here you'll find out they have selected a game development with unity if you don't have it selected you add that and we'll bring down all the necessary dependencies so I can close that off and if I go to the unity hub up until this point that didn't exist so you download directly unity and get started but now and they have a unity hub like the views to the Installer and allows you to add multiple versions of unity because certain things may not be working with the latest version of unity especially their component engine and so here you just come to install you add your installation and then from here you can also add modules so in this instance you'll notice that we already have the Unity game development checked in because we went from the Visual Studio workflow first but if you don't have it if you start with unity then that's the way you get started and that's all you need as soon as you do that if we jump back the slides you'll notice that there are certain things both in inside unity and the visual studio installer that show you that everything has been configured correctly so we're ready to go with this ones and what this one is telling here for the external tools is that if you are working with unity and you are on Windows it has already recognized Visual Studio 2019 as present and I've already checked in the editor attaching because one of the big things that you want to do is as you write your code for your games you want to make sure that you can debug the code right and you want to do it in velocity because it's the best editor out there so next we're going to look at why would you want to use Visual Studio or velocity for Mac over say notepad or OneNote or whatever there are if you if you've been developing for a long time with Visual Studio you probably know some of these capabilities but if you're not if you're new to TV studio or if you just focus on unity then I would like to highlight some of the big features here obviously refactoring as big as your code grows you want to be able to quickly jump into the code and change things move them around clear your code and what-have-you so you can always use the mouse and right-click on the line or you can instantiate the command by using ctrl or command dots and you can go straight to definitions I will show these in and then demo very quickly you can navigate the compiled assemblies you can get suggestions for variable names the idea guides you through a lot of a good practices and would try to give you the tools that you need to build good code so if you're creating a method that you want to duplicate for example then we can quickly do that in the code there are a lot of tools there to make you more productive with the scripting in your games Multi cursor mode editing we got global certs and that's very big because if you have a big codebase and as your codebase grows you want to be able to quickly search and find a different components in your code going to enclosing block if you have big blocks of code and finally whether you're working on Visual Studio or video for Mac and you'd like a specific set of bindings then we also give the ability to actually switch the bindings around around so if you're envious to do for Mac there's a setting there tells you I want to use my visual studio key bindings and since I have both machines as well I like to have that consistency across the two IDs so you can do that as well and next one we have Intel akkad some people may already know intelligence and Intel quad is is the next level it's the AI guided intelligence that you get inside your code and it's always context aware as well I will do a demo on how Intel code works and how you can improve your game coding visit of your life sir this is a life-changing experience because up until this point you maybe have been developing in teams or developing in isolation and you always get stuck right yeah there's always the internet but there's nothing as somebody out there that can help you out so using live server you can actually set up a session to sir your existing coding environment with somebody else so there could be somebody sitting three hours away from you watching TV on their on their you know on the surface go and then you call them and say I'm stuck with this solution here in my game I don't know what to do can help me out and you can actually spin up a session inside Visual Studio they could be sitting on the sofa playing with their vision studio code doing some web development they don't need to have the exact same setup you'll be setting your environment so live sir allows you to unblock it allows you to share your environment and find solutions to problems sometimes you can use it for as a learning experience as well so that's really important I will show you how to spin up a live search session if you want to we have built in source control obviously if you're using git and most people these days tend to use git and we do have built in an ID support there we have real-time code analysis that's very important as you write your code you want to have real-time feedback you don't want to have to write your code save it and then build it only to find out that something is not as you like it to be that also includes some of the things that I'll be talking later like rosin analyzers and getting a get feedback about the quality or the errors in your code editor config is very big lots of people talk throughout the conference so far about a tour config and how it ties very well with visual studio or visitor for Mac and for those people that have not used a tour config before it's it's a way to actually define a code how the code should look and behave how you want your variables to be declared how you want your spaces and tabs to be declared in your code if you want to go down the route and because it's a file that is checked into your solution it follows the code everywhere you go so if a new developer joins the team then editor config allows them to pick up the exact same code habits if you want and apply them to their code base as they code a code lence gives you a very quick glance about how your code and has changed over the times and over the years how many seconds you had for a specific method and what have you and then some other capabilities obviously if you're changing across machines if you work at the office and then you come home and you pick up the work you can actually synchronize your settings for the IDs across those devices and across those environments so you can have a consistent Windows layout you can have a very consistent look and feel so if you'd prefer dark themes and that's how it works and then we have custom screen layouts which you can save as well and then take them with you and if you didn't know we're at the support light and dark themes on your ID to make it look and feel as you would like to so next I'm going to jump to a couple of demos and we're going to talk about some of the things I have shown you already so moving back to my code and we'd have talked about refactoring so usually when you are sitting in your ID you can control dot and then we get intelligence and says you know we can remove those usings and you know make sure that you don't have them anymore you can also fix on all document or projects and all solution so if you brave enough you can apply that setting across to the whole solution so let's do the document over here you'll see it says I can preview your changes and then you can apply them we have things like limited to another one you can see here again we have fixes talked about the multicolored editing so if I were to say I add new methods I could do control out dot and then select multiple locations or control shift dot sorry control out select one two that seems to not working okay I move on but we can also do multi line editing so if you're here and you want to change from private to public and go public and automatically applies again we do support multi carry at editing across the files but let me change that back to private we don't want to break our code okay so this one I did talk about a tour config and they just way to showcase these if I jump into my files desktop and I can I already have an editor config they just way to get started I find is if you jump to the Roslin repo on github they have already an ATAR config that is pretty well tweaked so far so as soon as we drop the editor configure there you'll see we have all these different settings and obviously you can also change them to fit your team's needs and that means that if you want to break or if you want to go from a warning to an error then it allows you to go that so you can see here the severity set the suggestion but you can change it to error and then that will cause everybody to actually go and fix their issues but if I go back up I'll pick up something that's very well debated and a heated conversation so I go with tab and save that saving thinking about it there you go so if I switch back to my code you'll notice that right now I have 4 spaces everywhere but if I do ctrl K and ctrl D automatically applies the editor config settings to my code that means that the soon as you you add your ATAR config you can go back and apply those settings to your files which is fantastic that that means that your team can have a consistent code base there so I mean just don't save that one obviously let me just go back and revert that because I'm pretty sure my team will be upset about the tubs space save that and again not applies and I did say I did mention about life sir so you've never used life sir it's available on V video and visit your code and you don't have to have the exact same environment on the target machine the one that you're sailing with but you can go into live sir it's already kicked off a stirring session I don't have any one right now - sir with but if I go into more info you'll not study it says just copy this URL send somebody else and with that they can actually join your session and say exactly what you see here which is fantastic especially if you're in games development you're new and you need support and throughout the your coding session so I'm just gonna stop that life sir in case anybody wants to join and I'll go back to some of the other things I talked so let's see here what else do we have and code lands we're building source control yet let me just show you this one so we source control again it will automatically pick up I was using get locally here so you'll notice that there's a lot of files that have changed throughout my editing you can also use an an exclude circuit ignore to exclude some of the files because obviously you don't want to take in everything and on your source code and like in dark themes with the settings if you didn't know you can create custom settings as well so if you want to have a very specific layout for your games development you won't ignore your debug you want to ignore other things and that are not relevant to you or Windows that are not like to box then you can come here create your session and your your layout and then you can apply it I know where you're these settings do carry with you as soon as you log into business to do with your account so if I were to change the web layout you will ask me whether I want to do that and then it does it there you go it's very different right I want to go back to my default one because I don't like this one I save great one for a guarantee obviously but it's fine so I'll go back to my default layouts go applying this one fantastic anything I want to highlight here and Intel Kota I will show you in a bit and now I will explain why real-time analyzers we have Roslin if you know if you don't know about Rosen you can download and install Rosen analyzers the ID also comes with some default analyzers here as I type it might come back with a suggestion saying you're missing an underscore prefix or you could make this field read-only so straight away it actually tries to make me a better developer by providing some suggestions for my code and rows analyzers are very powerful because they run at real time as you type your code so you don't have to again again save and build before you find out that there are some warnings against your your code right moving on I want to highlight why Visual Studio is so important with with unity and why when you use them together there they said your code on fire right did you become a lot more efficient obviously Intel code now has been designed to work with most of the SES our default projects but our team is working to bring the unity API messages into Intel code which means that we're scanning our code bases out there to make sure that we pick up the best skills for your for your unity games and Intel code goes one step above intelligence because as I said earlier on it's context sensitive it knows exactly where you are and what you're doing it will provide you with the best ideas as you type and Visual Studio does come with superior debugging we have the ability to set up trace points and breakpoints and really dig through the code there have been already sessions that so what vance tips and tricks on how to debug using Visual Studio so I would urge you to go and see these and we also added a unity project Explorer which makes your experience slightly better so if I switch back to my visual studio you'll notice that I don't have it down here but if I search for unity you'll notice it has unity API reference and unity project Explorer so that it gives you a more simplified version or a look and feel of your files and your assets so you don't have to go through the standard solution Explorer so we have an optimized experience for you I thought simply going back to the ID up until this point we only had that ATS so you had to spin up the game and so you spin up the the video studio attached to unity and they had to go back to the unity editor and spin up the game and then set break once here in order to be able to attach but now lo and behold we have attached the unity and play straightaway so you will kick off your a game end to end so if I were to try this one and we can also put a breakpoint over here we'll kick off my awesome game it's not it's not awesome but I did spend an afternoon writing this game so I wanted to prove to myself that as a.net developer I can write something in unity in and not a lot of time so within one afternoon let's say four or five hours I was able to put this thing together so let's see if it's already kicked off the breakpoint is there if I'll go to my game trying to switch now maybe right let me stop that one bring it back to focus I think it's right something something resolutions something okay so that's my game it's a very basic game I created a car and I put some obstacles on the road and what I'm trying to do is circumnavigate around them so I had no knowledge of that I've used some ready-made components so unity makes it very easy to actually create a whole world out of ready-made assets so all you have to do literally is write the experience or the behavior around these objects and how you want them to behave right now and before even starting coding anything this these were just Dom objects sitting on our scene so what I did is I actually add user controls to be able to navigate around the car and then I wanted to to also add the behavior of moving the camera behind the car so it follows the car as it goes through and later in the game or in my talk we're gonna add one behavior which is exploding crates because there's no fun if there's no explosion right so I wanted to make sure that if you toss the crate it just explodes so right now we're here you see it actually has kicked off the game so I can see ya think there you go we can never get around the space it's very basic I showed them to my daughters and we're not very impressed because you know they play xbox and then when I saw them this I was really excited but the excitement not really pan out with them so as you can see I can already control it and the code that I needed to write to make this happen was literally a few lines of code so in this instance we have four lines of code that control the forward and backward and the sideways movements and then one more line of code that actually allows us to control the camera now I did speak about Intel akkad and how it works for us so if I were to do transform here and then do a dot you'll notice that we do have position local scale parent local position and rotation it's the Intel code here it tells us that the code that you might want to use this first because these are the most common ones in the context of the update so maybe you want to pick these ones up rather than try to find through the API as you can see it's a massive API here I have no idea what I'm to do so Intel occurred really helps me focus on the things that really matter and the nice thing about that is that if you go into an if statement then it will actually change the whole experience so let's say if I go down here and say if and then transform and dot you notice that it's changed sadly so it gives us the route which was not there before it also gives us a child object so it looks for like if transform has child objects you might want to do something so intel code hones in into those skill all those parts of the API that do you make sense to you right I did talk about Intel code yes and one more thing about and Teleco right we already have the automatic Intel code which does a lot of things out of the box for us but you can take it one step further by train in Teleco to apply specifically to your codebase so if you search for Intel akkad up here in Turley codes you notice that there's a Intel code model management and what this does is allows you to submit your code to your Intel code engine to create the model that you need to apply to your machine and that makes it very specific to your codebase you can also share that with the rest of the team and that makes everybody more efficient so if you have a large code base with a low of classes that you want to be able to quickly bring to the surface and Intelli code allows you to do that and you also have a custom model for unity to allow you to even be more efficient right by ends up jumping back into our unity the last thing I wanted to do is obviously show you some of the the good things in Visual Studio we do have they're built in out to create C sharp files sader files and in um files directly in the unity project in the Explorer faster project reloading so we want to make sure that as you change your code from unity then the project reloads much faster especially if you are the law of assets we want to have reduced time for debugging so no not many delays the team has really focused on better performance we also want support more unsafe code debugging options and and we have unity specific analyzers and diagnostics inside Visual Studio to make you look better and have better code and finally we're suppressing non-applicable sis or Diagnostics so with that I wanted to go back to our game and just add the explosion because as I said I promised your explosion so we'll see some explosions this time I'm going to go via unity so here you'll notice I have an obstacle and which are actually using to create new lots of obstacles in our game because we have about six of them it does have any behavior or code so what I'm going to do now is add a component and in this instance we're going to add some C sharp files so a new script we'll call it collision detection because it's actually colliding with something collision helper there you go can you script collision helper create an ad so this will add it to our obstacle now because everything else in our code base inherits from that base obstacle all I need to do now is go into our where did that go oh it's still loading right okay still fixing it adding it there you go so the collision helper here now that file is here let's tidy up a little bit we won't have a nice tidy solution and I'm going to jump into my collision helper this will open inside Visual Studio I'm going to delete this ones because I don't need them and I'm going to add my snippet so what we're doing here very basic it took me probably two hours to figure it out for lives of code and there you go what we're doing is we're getting the game object we need to make sure that it's only the vehicle that collides with our without crate right because if everything else collides then we don't really need to know about that then we grab the particle system that actually throws the explosion we make sure that we have a handle on that in fact achieve use the curly brackets that Matt stalked on the first day to check whether it's null or not and then we need to make sure there's no playing right now and then kick off they're destroyed so I'm going to kick off the game now let's save this one and then kick off the game blow something up and then we can move into questions there you go it's going to take a couple of seconds and explosion right that's it four lines of code and you have an explosive crate right last slide for me for today is all about what you can do next so if you are if you are keen on learning what you can do next we just go and download Visual Studio add the unity we recently launched some amazing learning tutorials with unity in collaboration so go there we have more than six hours of learning materials and then we also have a how to build your first game our PM John Miller wrote this one it goes through step by step on how to use versity for mac and build your own tic-tac-toe game so thank you very much thank you very much for joining me today
Monday, 21 October 2024
Adding Images to Comments with Coderush
today on vs toolbox we're gonna do something we've never done in the history of coding before what's that we're gonna take Robert Greene and we're gonna shrink him down and inject him into the source code just like that take a look hi welcome to visual studio tool box I'm your host Robert Greene and joining me today is Mark Miller hey Mark hi Robert welcome back on the show oh thank you gosh it's been a while it has been but I'm so excited to be here we're excited to have you well thank you I explain to the audience who you are and then we'll dive in okay my name is Mark Miller I work for DevExpress I work on the ID tool teams at DevExpress and I've been developing IDE tools for about thirty thirty years well developer tools specifically an IDE tools for about 23 years all right one of which is code rush code rush is one of those today yeah and I asked you to come on the show and show us some cool stuff cuz it's been quite some time and you claimed that you were gonna show me something that was gonna not only knock my socks off but that is impossible to do well it appears impossible to do it is impossible I should say that I always blow the demo I blow the demo by setting expectations so incredibly high at the beginning that there's no way that we can achieve those but I'm super excited about what we're going to show today guys it is when you look at it when you see it working it is arguably impossible it looks impossible to build yet it's not and this is a feature of code rush inside visual studio inside visual studio and it is available it's available now as you watch this sweet so it's available now can't wait all right so on my machine right here I'm just gonna go out here I've got a couple links here I'm in some HTML right here and I've got a link here says I'm saying I'm so excited to be meeting with Robert Greene today of channel 9 now one of the things that we're we're doing here if you'll notice Robert Green is a little bolder and so is channel 9 we have the ability to kind of mark those comments to kind of enhance them and what I want to show you today is is a lot it's about enhancing the documentation of the code that we write ok right and so I've got that let me go over here I'm going to click on on this link right here so Robert I'm going to come up here I'm going to right click on your image and I'm going to choose copy image and I want to do something kind of really cruelly groundbreaking in history-making today I'm gonna make me handsome I'm gonna make you handsome and not only am I gonna make you handsome but we are good you are going to be the first human being ever to be injected into source code that's what we're going to do so I just copied your image right huh and now inside the comment I'm just going to come down here and I'm just gonna hit the paste key like that and now there you are in the code and I'm gonna right-click you and I'm gonna choose crop image and I'm going to just grab right up here drag it down to about right there let me click up that image again and I might resize it let's hold down the shift key so we keep our original aspect ratio and now I've got you right there in the code and now that I've got you there in in the code I can come up and let's just copy that URL to Twitter let's right-click you let's choose link and let's open a URL let's specify that and click OK and now when I come and click on you like that we jump right up and we go right up to the so you could put a screenshot of a mock-up of the UI or something put it in the docs yeah you put it in the code is what you can do in fact let me show you the code on the comments on that yeah I got it let me show you this is this app that we're running right that we run right now so this is an application that I built for my twitch channel okay okay and this is going to be a bot that's going to have a rocket in it that's going to be remotely controlled by our chat the people in chat room so they'll be able to launch they'll be able to launch the bot like this and then fly it around and collect coins for example or maybe they'll be able to drop meteors that'll go down and blow up while I'm coding live in visual studio in JavaScript or C sharp so it's a little bit crazy right but you were talking about you were talking about screenshots right and if you look at my engine right here my let's go back over but if you look at my engine right here you'll notice that in the upper lot that in the the bottom right right here that engine is not quite lined up right so let's just do exactly what you said let's take a screenshot like that okay let's go over to my rocket this is the class that does the does that particular work let's use the visual studio function to go find that draw function let's get out to the draw function let's put a comment right here and let's paste it in okay and let's come in here and let's crop the image like this whoops not quite where I wanted to crop it right there and right there and now let's come in and let's do something called pixel scale and pixel scale is going to zoom in on this and and keeping the pixels in place as you as you as you zoom in is as opposed to having a smooth kind of scale so you can see the individual pixels of each piece in here so we'll do a pixel scale on there and now we can just put the comment move the engine to the left a bit now here's what's cool about this right this is not a comment that's going to stay in the code for the lifetime of the application this is a comment to myself or to another developer later right but it's increased in its visual capacity to communicate right that's what's kind of super cool about this right now let's say you now check this into source code and somebody also happens to have code rush they would see that and if they didn't have code rush what would they see oh okay good question so what would they say if they didn't have code rush there's an option here to turn this off for example I can just turn this off like this I get essentially what looks like markdown right there in the comment right and so there's a reference to engi file that PNG file is part of the solution what's really cool about this in fact is watch this I can take this code and I can cut it copy it move it somewhere else I can take it with other even the method the whole function take the whole draw function right which is pretty big take that come down take it put it in a new place paste it right come back in here let's rien a belay Topa nning this up on a machine with code rush on it and the comment moves with it okay right I can take and move and copy so comments in fact even if I do undo right now images in source code work with undo and redo stack as well right so here on undoing through all those changes I made right and then I can also redo and go backwards as well sweet right copy on the clipboard undo redo plus let's say I do have a developer on my team right that I don't want to that doesn't have code Russian I want to I don't want to leave them out right I can just come here and say see put a little note to them that's a see image in solution or whatever I'm going to see there and then now if I hover over that I'll see that as well if I have code right and if I don't I can still see it and I can still use it and work with it all right so that is that's one of the things that you can do with comments is you can extend the documentation can I show you another example all right okay so now I'm going to go over jump over to plain 3d jjs it's a JavaScript file and I've got a function here called get line intersection this determines the intersection between a line and a flat plane right where is it and if I look at the code at first glance if I'm a new user or if I haven't worked on this function in a while and I come back in it's not immediately obvious how the code works right understanding this code is going to take some effort to figure it out right in part because it uses established formulas in part also because I've got a return null here I've got a return line here and I've got a return point here right there is this comment right here that says hey based on formulas found over here on Wikipedia so let's let's bring that up and oh this is what's going on here no intersection point or line is in the plane those are the three different possibilities so let's copy the image let's come over here to the source code let's come over here put a comment marker right there we're gonna come in here on parallel that's this one on the left so we're gonna crop the image we're just going to take this drag this over here like that and bring that up there a little bit and there's our parallel right take that copy that to the clipboard come down paste it in there let's paste it down one more time and we'll reason we will readjust each of these so here's this one the line I'm gonna go here and crop the image again bring it to the line that's when the line is contained in the plane entirely and let's come down here we're going to crop this image and let's it's the point it's the one right in the middle right so we have the ability to incredibly quick things so cool put images in code modify them as if they're first-class citizens right without hitting without an impacting compiled time editor performance or any other metric you might you know be concerned about and this works with all project types any version of the framework does what does it rely on other than Visual Studio 2017 in code right our understanding languages so right now we're supporting HTML CSS Visual Basic C sharp okay JavaScript typescript and F sharp okay so we're getting the big ones and other ones like Python and other other languages will likely add support for those because it's once what the engine the magic has the hard work is done right supporting a new language is generally not that hard because all we have to do is understand the comments sure I'll show you it can work cool things you can do absolutely you know to have a threshold for cool do you because if I don't want to I don't want to see the show all right excellent yeah excellent so see these Kannada limiters in the beginning I can get rid of those by just putting a back tick at the beginning of them like that and the comments still there but it just kind of cleans things up a little bit and I can also you know I can move this right just by putting spaces in it I can add things before I texted before or after it like that and and it works it also works with debugging too right so when you're stepping through code everything still works the only feature we haven't cracked yet is printing that's the only piece that we haven't cracked and and if there's a lot of enthusiasm for this as I as I think there might be we're likely to figure that out too okay and salt printing for you let me show you a couple other uses of it actually do you have I want to stop because I don't want to barrel all the way through do you have any questions or anything like that no this point okay any questions I have I will let you know okay let me show you another kind of cool thing that you can do I have this is my animation for the meters when we drop the meteors I'm and as you know if you know me I'm a little crazy I've got 63 frames of animation for this rotating medium that's what I do my explosions got something like 200 frames of animation those are all PNG files that do that exploding at the bottom right so I go a little crazy but one of the things that would be very cool to do in the meteor class that's right there I just opened this up in Visual Studio right I just double clicked on my asset out there I hit control a to select all control C to copy and now I'm gonna go into my meteor class and I'm just gonna up at the top here in this comment I'm just gonna paste and then now what I've done is in my meteor class I've got a picture of the class some visual representation it's a sign post right and what's really cool about this is when I'm flipping through files right I'm going from one file to another right and then all the sudden I land on it I immediately get that visual recognition I am I'm on board I with the file I know the file that much faster instead of having to look at the code and recognize right right because you're using a serial process which takes so much more time to recognize instead I instantly see it right so that's kind of a cool thing you can do you can also you can do things like this where I've got here look at this I've got a setting that's not default that which bots oo auth token and right next to it I've just embedded an image at the end of the line I've hidden the comment right so if we come over here and we look at this there's that little the back tick to hide the to hide the comment there's what it really looks like and what's going on let me right click this so you can see this if I right-click this and choose link when I click it it's going to execute a visual studio command project properties so I'm here in the code looking at one of my project properties right this setting it's out here I can click on this like this and it opens it up for me and now I can see it make changes write code code that connects with acid tools or control commands a visual studio in some way you can invoke those commands codes that are related you can get to those other places let me show you something else let me jump over here into Excel and I've got some shortcut here that I need to implement I haven't implemented them yet right right okay I'm just going to select that choose copy I'm gonna come back over here and that's gonna be my main that I need to do look hey there's more key bindings that I need to add right here that's this comment well let's just put that in while I'm working right so I've got the spreadsheet from Visual Studio write anything that's out there with regards to you know any application that copies and supports a copy is an image we can put it in here and even if it's a temporary thing like this is an example what just while I work right it's information in parallel instead of having to switch over to it now you know the spreadsheet come back I've got it right in the code I can work a little faster and it is an image it's not a live link back to bright red sheet right right right more cool you ready for more cool yes all right so you can see why it's a little bit excited about this right so here I'm in this formula over here called distance a point right here and there's a comment says hey it's based on this formula to calculate the shortest distance well the formula is given to me in latex which is essentially a structured way of representing formulas now you can go online right over here there's a link right here in the editor you can go online and type in your equation well you can use these buttons so I'll just paste in what we had there and you can see there it is there I'm gonna make it a little bit bigger so we can see it maybe even bigger than that very large like that there's the formula that's what was happening in the code right there I'm going to right click it copy it to the clipboard come back over here and I'm going to just kind of replace all of this with the formula just like that cool so I can put that formula right out there right one last thing let me switch over into I'm going to switch over into f-sharp now so I'm in F sharp now I'm not an F sharp guy yet I do not I'm not an expert I'm barely barely holding on okay you're learning it right but I do know math and I know mathematic symbols so when I'm in here looking at this code right here this code says it's based on the have her sign formula and if I were to just look at this I'd be like a little bit lost I'll go look it up but if I look at this I see oh I think I see what's happening here now I understand the f-sharp I am getting myself up to speed faster because somebody left a comment here that included the formula and also if I hover over there's a link and if I click on the link it takes me out to the Wikipedia page on it and I can just if I want to augment this I just would take this image for example right click it copy the image come back over here and let's put it right up right up above so we just put a comment here paste it in let's use that symbol to hide those hide the beginning let's Center it on the page okay like that and there we go and that's it very cool so that's it that's like that's like the high speed run through and I'm just like I'm like I would say well I could take go long or you go short you know depending on what we do but I think I have a feeling if I look at the clock it's gonna be like said we're under 20 talk to us a little bit about what it took to make this okay because you were telling me earlier that even that this has been something you've been working on for a very long time yeah I tried this in Visual Studio before there was net and I had only linking and embedding mm-hm where I drop them in but the problem was storage is the problem one of the biggest problems with this always is storage and we might want to take a look at behind the scenes how that magic is happening yeah but but the first what I was doing is I was just encoding the comments into essentially a base64 and putting these giant comments in the code the problem is is that you changed the compile times right you compile times grow as the file size grows right right it's not not a good idea the advantage is it's there and if I give it to you and you edit the file it's it stays in this position mm-hmm right I tried that and and and that's how far I got ultimately I got to a point where I was like you you cannot release it the upside of all of that though is that I could actually at the time in beared actual spreadsheets actual audio files any the object could go in right right now we're just scaling back to be only images now we're saying only images with this with this release and then I tried again when I was in when I was working on code rush for Delphi and and I I kind of got close again but again we ran into the storage problem so I was storing I think externally at the time I had you know a file it there but you run into problems when you're storing externally separate from the file right what happens if somebody like you know is also pasting in images for example that sort of thing how do you resolve all of that so there's never ever any collision right and then how do you have you open up a code file without having to download the external image or if it's stored loped or stored remotely how do you work offline there's all kinds of issues right there there are loads and loads of issues in solving this problem um in fact most of the most of what you've seen most of these examples are really showing you the UI solution to the UI part of the problem mm-hmm right how do we get it so it's it's it's so crazy easy to take it from one place and stick it somewhere else right how do we get it so what it feels like it's really there right I can take this and I can click on it with the mouse right and there it's selected right I can change the size just like I can anywhere else right and there it is there's the resize right there right let me go ahead and I'll restore the original image right there so we can get back to that right so how does it how do we get it to work with cut and copy and undo stack and reduce tack right all of those that's the UI part of the problem right the storage part is trickier but we have a really clever way and this was I was telling you this so we we basically I think about a year ago or half a year ago we were like let's try it again because we had the rich text comments right right up here to notice real time is Boulder right to emphasize it right so we've got that ability right up there we had that going and I was like let's give it another stab and one of my developers sent me essentially a prototype and and then the prototype the file name was curious to me and I'll show it to you right up here so if we look at this file name right up here we look inside this we have to go inside it and there it is there's the file name and I'm like what is this finally miss I didn't go in because we talked about using Goods and and there are even problems with using goods because if you copy an image and then you paste it into several files you're gonna now have multiple copies of that image stored out on disk and we don't want that either we want to have an efficient efficiently stored set of images out on disk in fact if I take if I take this image and right-click and copy it just like that let's go we'll go over here into PowerPoint and I'll just paste it in here I should be able to paste it in there it is right there but it looks like that had transparency so it came in black on there in the background but I think we're probably gonna see the same thing with transparency here but I'll right-click here copy that because that also has transparency Oh looks like that one's okay so maybe it doesn't either it doesn't have transparency or it could be an issue in the face but but the hold on I'm like totally I was so like distracted by that I'm like we're only back image name oh the image name right so if we were to take this like say we're going to take it from here and copy this to the clipboard and then come in and like say okay let's paste it either multiple times in the file or through multiple files in my project right so the first time I paste this in the image name is three two starts with 320 alright next time I paste it in right if we were using goods we would advance it but this is not the second time and it's a bitmap that's on the clipboard I'm not pasting text it's a bitmap right mm-hmm so what's going on here and he says oh I'm using a hash of the image and it was like oh and I started going through all the problems that we were having before with storage and I realized oh hash of the image really is nice because what happens now is when I when I paste that in right the I only get one file that's out there right the other thing that's cool about that is you you go out to that file and you modify it it updates everything and where is that file stored let's look at that so if we come in here and we go into the solution and we right-click and we say open file and file explorer like this we jump up over in here there's a folder inside the solution dot CR okay and inside there is a folder called images and if you take that and you can just upload those contents right there that's what you can do now we're seeing several DS because of what I was doing in the demo prior to this but but they're not all not all of these are used here we go back over to the other one I think you'll see something that looks a little bit cleaner because I cleaned them all out before I started today let's open that up and go to see our images and there are all the images right there and then you can just add these to source control and they go up with with the codes exactly and come down with the count as well yeah and I just it just reminded me of another thing that you can do if you have a code that's not so good like for example right here I've got a lot of hard-coded strings in here right I might be able to I think I have a template in here called scary do I know I don't well I can create one I do have one called nice I think right like that well that's not what I want I might want to have I have another one called P you like that this code stinks right like that and so you can put a message to your fellow developers right to get their attention and get the whole team's attention yeah as you're scrolling through the code right so you can put icons in there and what I just demonstrated there was a code rush template right I'm if I type in a slash nice I created a template that is just going to expand to the image right then it's already part of the project and put it in there very cool I may be the only time this emoji has shown up I'm gonna scroll that off screen so we don't get in trouble this is so awesome alright so to wrap up this is a feature of code rush it available now it is it as it is and people can we'll put a link to it in the show notes people can go check this out as well as figure it out look at all the other things that code Russia does horse I'll put outside just put in some of mine right there you can use it also for branding right I can't you stop right the beginning yeah yeah and it's if you go to DevExpress comm slash Holy Grail huh behind-the-scenes on how all of this is done you know there's nothing really proprietary about it at all we're just saying here's what we are here's what we're doing is what we're building this is the experience very very nice thank you Robert so much cool stuff hope you enjoyed that and we will see you next time on visual studio toolbox [Music]
A Whirlwind Demo of C++20 in Visual Studio with Sy Brand
Hey there! Today I'm going to give a short demo of the four main C++20 features in Visual Studio. Those are coroutines, modules, ranges, and, concepts.  So what I've got right now is an implementation of a generator type. If you're familiar with a Python  generator it's much the same thing. This is based on C++20 coroutines. It's also compatible with ranges and it's using modules; it's exporting a module called generator.  And then the single type which exports is called tl::generator. Now what I want to demo  today is I'm going to implement iota, where iota is a function template which is going to give  you back something which counts up in increments of one, so if you start with zero then it's going  to give you zero, one, two, three, four, five, six so, on so forth. Could start at 20 and give you 20, 21,  you get the picture. And I'm going to implement this using my generator type. Now I want iota to be exported as a module, so I'm going to go and create a new item.  One of the options down here now is C++ module interface unit, which has an .ixx  extension. It's going to go ahead and create an iota.ixx. This will create a new file which is  exporting a module called iota. Now I want a single function template which I'm going to  export which is going to be called tl::iota. So I'm going to have namespace tl. export,  because I want to export to this from the module. It's going to be a template. I want to take anything which is an integral type,  which i can use std::integral for in concepts. It's going to be going to return a generator  for T. This is where all of the magic for coroutines happens, it's all in the return type.  It's gonna be called iota, and I'm going to take a T or you can just pass nothing and it will default to  zero. Okay so I've got a few errors here because I haven't included ranges and I haven't  imported my generator type. You can see if I hover over here it gives me an error.  So you might think that I want to #include here.  This is actually subtly wrong. Anything underneath this export module will have module linkage and  we don't want everything in this header file to have module linkage, we'll get some weird  compiler errors. The way to get around that is to put it in the global module fragment, which  you do with a single module semicolon, like that. We're also going to need to include coroutine and we want to import generator. And if we save this.. There we go! IntelliSense just found std::integral in the ranges header.  And we should hopefully get tl::generator soon as well. Now if I control click on this import  statement, this is going to go and look for the generator module, and it's taking a  little while because it's having to scan for all the dependencies and all of the the modules in  the project, the next time that you do this it will be a lot faster. And if I ran a build first...  But there we go, we got our generator module. That's handy. For example if I do this again then it goes pretty much instantly because it's already worked out dependencies and you can  see the intellisense has now found tl::generator. We're all good. Okay so our implementation of iota.  We're gonna loop infinitely. You could give this a bound or end, I'm just gonna count up infinitely.  And we're gonna co_yield back n and then increment it. So all this looks like an infinite loop.  And it is, but this function's not going to hang when you call it. Whenever it gets to co_yield it's  going to suspend, return back to the caller, and then this function can then resume later when it's  asked for. So this will stop in the co_yield and then loop round and then loop around whenever you  ask for a new value. That's what the tl::generator is going to be doing.  Okay, so we've got modules, we've got our generator, which is built on coroutines.  We can go and test this out. Okay, so in our generator test I'm gonna import iota.  We're gonna need ranges, we're gonna need coroutine again. Note that we do not get  the imports, the hash includes from here, this is all like firewalled, which is one of the  actually good things about modules. And I'm also going to do some output so I'll include iostream. Okay, I'll just have a single main function and we can test our iota like this. for i in tl::iota,  start off at 10. Oops, std::cout i. And a space. Okay, so this will never stop, right, because tl::iota is gonna  loop around and we'll just get 10 up to you know when this loops around and  we don't want that. So let's pipe this, like I, said this is ranges compatible so we can say  std::views::take 10 to take the first 10 items from this range. So now if I go ahead  and compile this. So what this is going to do is call tl::iota, which will get us back a generator.  It's going to pipe it into views::take and now whenever we go around in this loop, something's going to be dereferenced internally which is going to cause the coroutine  which we defined here to drive forward and give us a new value, and then take is going to make  sure that we finish once we've got 10. So this is kind of a nice way to compose things, this is the  the value proposition of ranges, you know, this is a kind of a silly example, but you can see how you  could compose these things as much as you want, and also the implementation for iota is way smaller  than anything you would write by hand for ranges which, would be, you know, a couple hundred lines of  code or something, it's about 15 with all of the the includes. Okay, so that succeeded, we can go  ahead and run this and hopefully we should see 10 through 19 being printed out to the console. 10 through 19. There we go 10 through 19. Okay now say that we want,  like right now this takes any integral type. Maybe we have something which you know acts like  an integral type um but isn't. Maybe it wraps some integer.  int_like. It could have other things basically anything which you can increment and subtract  to take the difference between. So say we have int_like which has some internal integer, and it has an  operator++ which you can use to increment it and then we also need operator++,  a post increment operator which you know makes a copy first and then increments and then returns  temp, and then we want to be able to take the difference between two.  friend auto operator  minus takes a couple of int_likes and returns the difference. Oops. Just return a.i minus b.i. Okay, so if we compile this right now then we're expecting to get an error because  iota says it requires something which is an integral type, like you know, int, or short, or long and we've  given it something which is not an integral type, so we're expecting a compiler error here. And this is concepts. You know, we're constraining this function template-  Oh, we're getting a different error. I must have class type... Oh, I need to give it int_like here.  Yeah, so we're expecting an error here because int_like acts like we want, all we really need  is to be able to increment this thing, but it's not an integral type, so the compiler is going to  give us an error. One other thing to note here if I look at my output is this is scanning for  module dependencies. This means that the build system is doing all of the dependency handling  for us, for these modules. We're not going to have to tell it in which order to build these  modules and things like that, it's going to work it out automatically, which is very nice, and you  can see here in our errors we did get no matching overload found, because the associated constraints  were not satisfied. So that's what we expect, that's what concepts gives you: the ability to  constrain functions and for the compiler to tell you that something went wrong. You didn't  have the right constraints satisfied. We can fix this by changing this to weakly_incrementable, which basically says you can pre-increment it, you can post increment it, you can find  out the difference between two values. Slightly weaker than incrementable, the difference between  the two is weakly_incrementable supports single pass operations, whereas incrementable allows  you to do multi-pass. So this is going to go ahead and compile again, and hopefully this will succeed. And we will print out, because we're starting at zero then we'll get zero through nine. So again  this is scanning for dependencies. Oh we forgot to return a value here return *this. There. It's one thing I always forget when doing things like that, returning  this. This is going to go ahead and rebuild, and one other thing like I mentioned you can  control click on generator here and it will go to your module, the go to definition will  also work, so if I go ahead and control click on generator then this is going to take me straight to the the implementation for our generator type. As soon as IntelliSense works out we're going. There we go. Okay, that succeeded. We can now run this and we should see zero through nine. There we go, okay, that all worked!  So that was my whirlwind demo of the main C++20 features inside Visual Studio.  Please do give it a try, let us know if you find any issues, we'd love to hear your feedback.  We'll be continuing to work on the IDE experience to make it the best we can, and also please do  check out pure virtual C++ on the 3rd of May, where we'll be talking a lot more depth about  Modules in particular and also our general C++20 progress, so thanks very much, i'll see you there!
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...
-
>> It doesn't matter if I'm short or tall. >> Anxious. >> Or obsessed. >> Loud. >> Quiet...
-
hey you're watching after hours with the visual studio team and I'm really excited about this episode because when I...
-
>> It was an 8086. At the time, 8086 was already out of date, but I had one. It wasn't until about senior year in hi...