Showing posts with label the. Show all posts
Showing posts with label the. Show all posts

Wednesday, 23 October 2024

Building Blazor applications on a Mac

hello so welcome to the building fleas their applications on a Mac and definitely check out the weather app that Scott hunter just mentioned it's really cool but we have some kind of simpler stuff to get started to talk more about what blazer is and take you through an intro app how to get your feet wet and then we'll move to a more realistic app and make some changes there as well yeah oh and I'm Kendra havens I'm a program manager on dotnet and Visual Studio and I'm Dan Roth I'm a program manager on the asp.net team cool okay so Dan what is blazer is boy so much talk about it and so much excitement so Blazers a modern web framework for building client-side web apps using c-sharp and net instead of JavaScript it's cross-platform it's open source and it's based only on open web standards now we've had ways to build web apps with dotnet for a long time a traditional don''t web app you take your dotnet code and you put it on the server and then the browser sends requests to your server and it responds with dynamically generated HTML or Jason that's pretty typical dotnet web application but if you wanted to do anything that ran in the browser well that meant you had to use some Java scripts like using one of whatever the popular JavaScript framework of the day is and that's cool I mean Java scripts great I mean yeah it's great you kind of have to switch context though and that can kind of slow you down so they can stay in dotnet code that's kind of convenient if you can use the same language the same frameworks the same tools same build system across your entire application that's what blazer is all abouts enabling you to build full stack web apps using Donette and c-sharp that's what we've been working on sweet okay so Blazer you build client-side web apps using just net and c-sharp code it also comes with a component model so you can build reusable web UI components you can package them up as NuGet packages and libraries and share them with your friends it also enables you to use the same code on both sides of the wire if you have some common logic like validation logic or data models that you want to use both on the client and on the server you can do that with Blaser it's full stack web development with net at the same time if you have existing JavaScript code or you want right so we're sharing dotnet code so even like working and like f-sharp or Visual Basic if I have libraries that I want to call from blazer yeah you can do that it's just normal donít assemblies that you're calling is your into in your blazer application absolutely and also if you have JavaScript you can still use that as well you can call into existing JavaScript libraries from your blazer code and even call back from the JavaScript code back into net through JavaScript Interop you can use that to also leverage all of the native functionality of the browser okay so if I'm not-like or if I'm slowly migrating my app to blazer alright trying it out in some section I can still use javascript elicit don't have to throw your JavaScript away you can just you reuse it in your existing blazer application how does that work is that possible I know it seems like magic well there's two ways that blazer apps function the first mode we call blazer server the way blazer server works is that we set up a real time connection with the browser we use signal R to do that it's basically a WebSocket connection Brady has a talk on all on signal once we've got that real time connection with the browser we run your blazer UI components on the server any UI events that happen in the browser we send them over to the server dispatch them to your components the components run they render and then blaze are very cleverly figures out just the parts of your UI that have changed and see arises that diff back down to the browser to then be rendered and updated so it's a kind of a thin client model you're you're still running your UI components on the server but you get that rich interactive field that you would expect from like a JavaScript based single page application ok and in server all of my c-sharp is compiling on the server still not at all inside the browser all the compiled compilation happens at Build time but your build code is gonna be running on the server on dotnet core it's not actually going to execute in the browser right but you still get the rich interactivity of being able to handle all the UI events and update the Dom seamlessly without having to do a full browser refresh but I have heard about things you started to do that you know I are not compiling but executing executing that's right in the browser with blazer webassembly your web assembly what we do is we we can download with your app a full dotnet runtime that's implemented in web assembly now web assembly is an open web standard it's basically a bytecode for the web if you can compile your code to web assembly that code can now run in any browser on any platform at near native speeds native as in like browser natives well pretty close to the wire like it's almost like an assembly language that's been standardized for the web so it's pretty fast super fast and it's so we built a dotnet runtime in web assembly that you can bring with your app it's small and compact and then you just download normal dotnet assemblies into the browser and execute them using that runtime the same come you I components the blazer components in this case they're running in the browser itself they do they handle UI events they calculate the diff in process in the browser client side so I see our little slide here says preview that's right so please our web assembly is in previews lays our web assemblies in preview laser server however is ready to go for production I want to use which one here server versus web assembly so Blaser server shipped with dotnet core 300k also shipped with three one LTS LTS is a long-term support release so Blaser server is ready for production use today you can put it in your websites put it out in production it's fully supported with a long-term support life cycle blazer web assemblies still in preview isn't quite done yet but we're working real hard on it we expect to have that finished up in just a few months later this this year how do you pick between the two well there's there's some some trade-offs with blazer server the benefits there is well your your well first of all its production yeah if you can actually use it right now but if your code is also running on a full dotnet core runtime so it's super fast on the server and it treats the client as a basically a thin client it has less demands on what the the browser or the client device needs to do so for example if you want to support older browsers like IE 11 you can do that with the blazer server application because there's no requirement to support web assembly blazer web assembly on the other hand gives you that option of pushing and offloading load from your server onto the client because it's a true client-side application it can support things like offline scenarios that's still in preview so it's not ready for use today but it will open up some really cool scenarios in the future oh my gosh I'm so pumped now regardless of which model you pick though like don't don't get too hung up I'm picking one versus the other because the component model is the same you write your components once and then you can use them in either hosting models so you could start out for example with the blazer server app and if you want to switch the Blazer web assembly in the future that's pretty trivial maybe when it goes to production we can switch our components over if that's what you wanted a oh my gosh I'm so pumped shall we get let's get started ok you say laser I know you can get started by going to blazer dotnet so we have a really simple URL to remember just Blazer dotnet and it'll take you to our main blazer and I guess landing page and we can go to this get started documentation and this will walk you through everything that you need to do to get started with blazer all the stuff you need to install and if you're on a Mac like I see that you are there's a tab there that gives us to do for Mac that has all the steps for getting Visual Studio for Mac set up with blazer so it's already installed dotnet core 3.1 and actually since you're here I won't read this I'll just I'll just launch Visual Studio and you can walk me through since you've already done it you've already installed Visual Studio from that you have dotnet core 3-1 on your machine which comes with Visual Studio for Mac so you're all ready to actually to go with blazer development right now alright so since I got 3.1 installed I already have a blazer server template and if I didn't see that there I could actually just find that in just the regular app templates blazer server under dotnet core that's right oh ok didn't see it's already targeting 3.1 they have a little authentication tab so on the latest preview of Visual Studio for Mac we they now have support for the authentication options for blazer server so you can create blazer server apps that support auth using asp.net core identity cool all right I'll go ahead and initialize one I called it blazer at seven that's a one seven just my favorite number it's nothing to do with the precise number of times we practice nothing at all just lucky it is so this will create you a new blazer server application it's all ready to go a blazer surfer app is just an asp.net core application with a couple of additional things wired up to support blazer server why don't we go ahead and just run it so we can see what the application looks like yeah that sounds good so the visual studio can now build your application get it running you can debug you have full support for blazer development within Visual Studio for Mac once this gets building and actually running we should see a sort of you know standard single page app style style UI and give it a second it's coming slowly will blame blame that on the browser yes you can tap around you have different tabs for different different pages this is all being handled through client-side routing on the home page you have some simple static markup nothing too fancy going on there on the counter page though you have a a button that you can click and as you click the count goes up there's no page refresh happening here the Dom is just getting fluidly updated normally that would require some JavaScript to do but that's all happening using c-sharp and on that neat not to see how that's working yeah and then this is fetch data page is basically a dynamically generated table of weather forecast data so let's take a look at that counter page so that's implemented in this counter dot raiser file and you can see it's pretty simple it's mostly just H standard HTML markup at the top it says that this is a routable component so app page says that we browse to slash counter we should end up here so if you go to the browser you should see in the URL at the counter tab yep slash counter that's where we're at and then you have some normal HTML markup we've got a button that we can click and there's that onclick attribute normally that standard HTML onclick attribute would have some JavaScript in it but here we're using razor syntax a little at sign to say no no I would like to use some c-sharp we've got c-sharp code here go down to that and it's pointing to your c-sharp method increment count that's incrementing the current count field which then gets rear-ended on the page now to show that that really is running c-sharp code whenever every time we click that button set that breakpoint let's see we can hit a breakpoint counter page yeah there you go we're in our C sharp method neat writing client-side web UI using using blazer let's see what else is going on here well the nice thing about these components like all these don't razor files they they get turned into normal dotnet classes as part of the build and now you can reuse them like you if you wanted to have another counter component someplace in your app you can do that by just adding that component wherever you'd like it to be so for example if we wanted to add a counter component to the home page like let's say we wanted two counters one on the counter tab bone on the home page if you go back to the let's go to the index dot razor file that's the home page for the application okay so here it just has markup there's nothing really interesting going on but let's start typing bracket counter angle bracket counter on here so yeah and you can see you get awesome intellisense in Visual Studio for mac and now it's showing up purple that's that's signaling to you that this is a component yeah you know what a blazer component if we rerun the application is purple or brown I think I might be a little bit color dot net purple everyone you learn new things about how you perceive the world yeah okay so I added the counter component and I'm going to go ahead and f5 again and so now when I go to the index yeah it has a completely new component a part of it so I didn't need to like copy in the counter code or anything it's just inheriting that component a reusable chunk of UI you can click on it it works just like the other one did and if you go to the other counter page you see it has a an independent count that's separate from from counter on the home page you can also pass data into components like components can have parameters to define a parameter on the on a component let's let's go to counter and make it configurable you parameterised how much it counts with each click so to do that you just add a property and the property can be made a component parameter by attributed it with the parameter attribute gotcha I have a little tip I want to show in here Visual Studio for Mac does indeed have snippets so if i just type prop and tap Todd OH it automatically loads in my property okay save some typing what st. yeah and let's call it increment amount I think would be good and let's default the value of that property to just one yeah give it give it the parameter attribute to that's that's cool that's what's really gonna make this a parameter for the component that we can pass in so by default it'll be one and now in the increment count method instead of incrementing by one each time doing a standard increment will increment by increment amounts of current count plus command amount perfect you get lovely intellisense for your c-sharp code inside your razor for local variables now go back to the index page and let's use that parameter let's pass in an argument so if we go to index now just add some space after they are and you can see incremental mount shows up wait way you set parameters and blazars just using standard attributes in tax and now the counter on the home page or in commit by 10 whereas the one on the counter tab should just default to the standard increment domenica the one i just kind of chose 10 I hope that's a good number that is a great number 10 times better that was before and we should see okay let's check this yes and now it's incrementing by increments of 10 whereas the counter on the the counter tab should still be doing by 1 because we didn't pass of past any parameter value the houses working like we said this was all based on that magic real time pipe we can actually see that happening if you yeah inspect the in the browser dev tools let's look at the network and if do a do a full reload so we can see all the stuff that's being downloaded holding a shift key or something there we go so you can see that this app's pretty thin it's not downloading very much stuff it's just a little over 400 kilobytes of download and all the magic is really happening in that first request that underscore Blaser WebSocket request yeah you see when you look at the messages you can see there's all these binary messages flying on that WebSocket connection yeah it's updating as you speak if you clear it lets clear them all out and then go click on the button on the sorry there's lots of try the yeah a lot of work yeah then click clear I'll click me thank me but nothing you clever every time you click we send the UI event to the server your counter component gets the message it rear Enders itself and then the Dom updates get sent back to the client that's what's happening here this is how that's how this app is working this is ablaze every base that cool so that's that's counter now I know if you go back to the code real quick on the counter dot razor file some people really like you notice that there was that act code block at the bottom yeah right there so at code that's basically a chunk of code that's going to get added to the generated class for this counter dot razor file it's like a bunch of class members and some people really like that that code lives in the same file because all your UI codes in one place other people would prefer to have that in like a normal C sharp file like in a code behind file which is totally cool you can do that in blazer as well what you can do is add a let's add a c-sharp file to the pages directory let's call it counter crazier dot CS that's sort of this the standard naming convention for a code behind file look good yeah it's good what it automatically put it underneath I put a whole bunch of they got Razer license information I was messing with my header demo later today for the productivity talk a delete that we won't you don't get to see this yet you have to wait till this afternoon I'll talk about how to put header and we don't automatically license like all your c-sharp files I'll get at it no no no that would be bananas right specifically chose that mighty license cool well we have a counter a class now now this matches the name of the class that would be generated from counter dot razor so let's make it a partial class ok grab you grab that code go ahead and grab that that's fine go ahead and copy that out of there and we're gonna move it into here we don't need the constructor so we can just copy over the constructor but make the class a partial class so it'll be combined with the generated class for the component and then you probably need to resolve some namespaces right and I can do that with alt enter so that opens up the little light bulb that I get so I can automatically add using beautiful so I guess all the normal C sharp productivity enhancements and features now are available to you in this I'm getting another little suggestion so this actually might have annoyed some people and I did this originally use a compound assignment it was all part of my plan yeah so vo Cermak gave me the suggestion that I can simplify that it does look better yeah well so this should be the same as what you had before like there's no difference in their code it's just that we've refactored they run it to prove it yeah go ahead and run it to make sure it's still working that's pretty nice like the C sharp so I've got a lot of nice features my gosh all of the little things that's what I work on that's nice t-shirt little things productivity that looks like it was before so she should still have like you know income increment looks good what other c-sharp stuff can you can you do and in yester Mac does it support all the the visual studio it does so right now we actually share the same editor so basically everything that we've added actually latest and like Visual Studio and Windows 16.5 preview 2 I believe is what we're on all of those are actually already piped into Visual Studio for Mac I can demo those later today with Mikaela there's a whole talk on that yeah there's like a shared editor so it's all piped in okay yeah so like like adding an overload like is that is that oh yeah so if I do alt enter um our keyboard shortcut to open the little tooltips I can't override sorry terminologies do something like as you can see all of the component life cycle events in this UI like the on initialize on parameter set these are all standard events in the life cycle of a component so yeah if you wanted to like run some code when this counter component is first and after it's initialized you would override on initialize or on initialize async if you have some async logic I think the fetch data component actually does that so this is this is the component that was generating that dynamic table of weather forecast data and if you look at the bottom all the way at the bottom there's a yeah there so you see uninitialized async there's exam distracted by how cool it was to have a c-sharp for each blue printing out your people we're cool okay continue so yeah there's uninitialized async that's that's when this component gets initialized you see it's using that weather forecasts service to get all the weather forecast data where's that forecast service coming from if you scroll all the way back up to the top there's this @inject directive what @inject is doing is it is a way to do dependency injection into your components you can get services that you've configured here we have a weather forecast service that we're injecting into this particular component and then below it's just normal razor syntax lucky where you were saying it's mostly standard HTML markup but intermingled with C sharp logic statement yeah if statements for each loops like we're just looping over each weather forecast instance to generate the rows in that table that's how that weather forecast table is being generated super cool so we started sort of to get more into realistic scenarios this was just the file new template is the basics they're like a level 2 app that we can use and show us short so I've been working on a recipe app in Glazer to like you know manage the list of recipes and do recipe ratings and those types of things why don't you pull that up yeah that's my repo you give you guys one if you want to download it and see my code like ok got it best for you recipes best for you recipe all right so let's see if I can open this up now usually I've been developing this on window is actually on Visual Studio but it opens great on Visual Studio for Mac builds runs debugs all those things just work as expected once this opens up why don't we just go ahead and run it first just to see what the app is capable of I'm gonna wait till I load my workspace documents perfect and maybe restore my new get packages that's probably always kind of always that restore your new get packages before you build and run its lifestyle choice okay so I'll try to it's saving might have gotten a weird thing well we're yeah we for that we can go ahead and look at the home page of these let's sit let's open on index dot dot razor so we can see a little bit what the when we see the app we'll have an idea of what the code looks like this is the home page for the application and you can see at the top it's mostly just there's a search box and then a little bit of an if else then just to see if the recipes have loaded and once they've loaded it's just generating an unordered list with the list item for each recipe that it loads from a recipe store and again we're using dependency injection to get a recipe store service and to initialize the the list of recipes so that's all that's doing that search box at the top is a custom component for handling the searches once you scroll back up to the top and we can look at that real quick yeah so you can see that on the search box we're passing in normal HTML attributes to like specify a placeholder but we're also able to specify a delegate for when a search has occurred so that we can hook into that and actually then run the query against our store so looks like the app is now up and running yeah so here's that home page that they actually read beautiful nice nice images design is not my forte you can put down recipes you can see details about the recipes some basic functionality you sort of search bar search for chocolate stuff yeah now notice that as you type the search is updating like you're not hitting enter as your house your typing is just looking at the current state of the search query and running a search but it's not doing it on every single keystroke it's like a little visible pause then it waits to see if you're done typing and then it does a search and that's nice because it's throttling all the searches to your database you're not just hammering the database with every single keystroke so it's interesting to see how that's implemented in Blaser if we look at the search box component that's where all that logic is encapsulated so search box that razor there's off now this is that component that just implements the search text box and it's handling all that debouncing logic where every time you search it'll wait a little bit until the even two you're done typing so mostly you can see that this is just an input like Scrolls we'll see the mark up at the top is an input and that's not about timers yeah and it's bringing in the timer's namespace the attributes attributes attribute there what that's doing is allowing you to grab any additional attributes that are passed on the component and sort of splatting them wherever you want them to be that's how that place total holder attribute is getting on to the input and then that app bind is binding the value of the put to the search query text search group property so as you type blazer we'll see that the text has changed and then set that text on to the search query property which I think you have below yeah right there it's actually even specified as a parameter so if you want to pass it in you can do that and we know that it's gonna do that on every single keystroke because after at bind back at the top at the end of the the input all the way the end see that at bind : event that's specifying which event we want to use for the bind like by default we will do it on change here we're saying no no no I want it on every single input every time you type please update the value of the search query uh property and then now let's look at search query cuz there's some of that's where the little bit of cleverness is happening search query when it's set like when the value gets bound it just starts a normal net timer and this is just you know like you saw up above system timers or whatever whoever the name space is it's a normal dotnet timer from the base class library where it will stop the timer if it's already been started and start a new one and if that timer completes then you know there was a pause without any keystrokes hit and that's when it'll actually call back into the the search query changed then call back that was passed in so I thought that debounce parameter there about 300 milliseconds that's that's the the amount of time we want to wait and you can see in an on initialize there's that component life cycle event again that's where we're moving up the timer setting up the defense time frame and wiring up the event handler for when the timer actually completes so all the event handler does is call into your delegate that you passed in and then you get your search results that's the balancing logic and you know 50 some odd lines of code all done in c-sharp no JavaScript required that's great and so should we go back to slides are we short on time I think we want to make one change oh we got five minutes okay let's make a change to this out okay so um if you go back to the yeah let's go back to the app and look at the reload oh right I stopped yeah so the we can click on the recipe that brings you to a recipe details page okay and most of that's just markup and there's even a form where you can do star ratings but there's also these tags and currently if you click on a tag they are links but they don't they don't go Oh like they don't think okay so what we want to do it is it is going to a new URL it's going to slash tag and then the name of the tag that we that you clicked on let's wire that up so that we actually end up on the search page but with the correct list yeah of recipes okay so go back to index dot razor what we want to do is grab that value out of the URI so in order to do that we're gonna add another route so add another app page directive and make a slash tag and then slash now if that's in curly braces cuz this is the value we want to grab out and we'll call the value that we're gonna grab out tag okay now to get that value we're gonna bind it to as a parameter on this component so add a new parameter remember we added a property before to create a parameter do in the code block let's create a new property so property anywhere thank you drink call it tag okay so and then put the parameter attribute on it so now what the Blazer will do is it will take the value from the route and set it on that property so now we can just pass it in to the get recipes yeah it's no it's not specified yet then we probably just will pass empty that will give us all the recipes when the attack is initialized one more thing is up above in the in the search box let's make sure we populate the search box with the tag if there's one there so set the search query parameter a little space in there [Music] sign and tag oh so we're actually getting into the c-sharp property there you go that's all you so now it should populate the tag so go ahead and run it okay let me start it and that should populate the search box with the tag as you click on tags that will filter the search to just that tag whenever you click on a tag like on the page and it should be just that easy okay so click on a recipe let's go down to the tags let's know fruit there's only one food that that works and it populated it you just added a feature to my heart right you're welcome now top back to slides real quick sure so that was getting started as blazer and some blazer in action um we know the number one question on a lot of people might people's minds if we have time for Q&A and stuff as um what is an expert blazer webassembly when wouldn't cute when we get it when will it be out of preview yeah so so this was all blazer server work that we were doing with Visual Studio for Mac Visual Studio for Mac fully supports blaze a server which is great blazer web assembly is still in preview it hasn't shipped yet it is the the focus of the blazer team right now and we are planning to release it in May of this year as a supported release and that will include full support in Visual Studio for Mac the initial release of blaze our web assembly will be based on dotnet course redone in fact we plan to add the template in an update to the dotnet core 3.1 SDK it will be a current release not on LTS release so it's not gonna inherit the LTS status of the rest of dotnet core 3.1 it is the first release of blaze or webassembly we want to give it a little bake time before we bless it as an LTS release to try and make that clear we're going to update the versions of the packages to be 3.2 we've actually already started doing that so the latest previews our version does 3.2 after may blazer web assembly will become part of down to 5 and will then be just part of the normal dotnet update release cycle so you just need to remember to keep clicking YES on that update prompt keep updating and look in May for the the released version of a blazar webassembly got it so in summary we talked a little bit about being productive in blazer on vs or mac blazer server is what we show today it is in production you can go and use it with dotnet core 3.1 and get excited for May 20 2002 a time question in turquoise that's exactly I'm glad I actually start with a statement somebody said I won't Don Ross Visual Studio you know what we have some exciting t-shirts for this event and we'll be giving them out as part of our party so make sure you stick around for until the end of the day so notice but more and we actually have some questions as well so the first one is habeas from a is there any way I can explore on blazer webassembly in Visual Studio Mac that we were just talking about that you can actually open a blazer webassembly app in vs for mac today you'll need to do is the a smith core hosted version of the template the standalone version of the blazer webassembly template isn't working just yet mb/s for mac but it will by the time we ship blazer webassembly in the May time frame you don't have the ability to create laser webassembly apps from vs for Mac just yet but that is coming as well so you can create apps from the command line as long as they're hosted in a nascent core app and run and develop your components and all that the rest of the functionality will be cut will be coming later as we get closer to the may release that's great well there you have it and next one is just close this one down is there performance benefit using blazer server over a blazer webassembly yeah so blazer server runs on a full dotnet core runtime your components are running on the server so you get all the performance benefits of dotnet core which is honestly one of the fastest stacks on the planet it really treats the the client machine also as a thin client so it has very little requirements on the client side of the of the application blazer webassembly runs on an isle interpreter based runtime today so if you have components that are doing really computationally intensive stuff it can drag a little bit when you're running that type of code in the browser so you might want to offload that to like a web api somehow on to your server so you're running on the folder core runtime perfect I think we have time for just one more question so yep question is is there a benefit using blazer over angular react or some other spa oh yeah I mean you see sharp yeah context you get all that syntactic goodness like productivity features in Visual Studio yeah it's a full stack solution for web app development with net and c-sharp I think also there's just a lot of really nice simplicity that comes from the the blazer programming model and tooling like it's really easy to get started file new project and you're up and running in less than five minutes so that can be really nice that said if you if you love angular and react in view and you want to continue to use those for your front-end development you can absolutely still do that and still use net core for your back in api's G RPC services signal our hubs and so forth great well thank you very much for your time it was fantastic to hear about all the Blazer cool myths out there and I'm looking forward to the 2020 build announcements that we're probably gonna have

Azure Functions Building serverless apps for Azure using Visual Studio Code

hi everyone welcome to the session at connect on Azure functions my name is Ansari and today I'll be speaking to you about what Azure functions is how you can build your very first serverless function and all the capabilities we provide to help you develop publish and monitor using visual studio code so let's get right to it I do want to talk about what Azure functions is at its core as your functions is server less compute that is the ability to run custom code on demand and at scale in the cloud whether it's written in c-sharp node Java or even Python you give your code to Azure and will manage and run it for you all dynamically based on events and to help you accomplish this we provide various options for integrated development using tools such as Visual Studio we as code maven Eclipse or even just a cross-platform CLI today we'll be looking at one such example for functions using vs code so let's get go ahead and get started let's take a look at how anyone can get a function up and running in just a few minutes for this I'll use huius code and the azure functions extension so here I am in huius code on my Mac and I've already got the azure functions extension installed since I'm logged into Azure I can see a list of subscriptions that I have access to the functions extension enables us to create new function projects add new functions to that project and even publish to Azure directly from within we S code just at the click of a button so let's go ahead and create our very first function once a picker directory will be presented with a menu of languages to use to initiate the project for the purpose of this demo let's go ahead and pick JavaScript and so what this did for us is initialize the functions project with a couple of files namely the local and the hosting configuration now we can go back to the azure functions extension and add a new function to this project again we'll be presented with a menu of templates that we'd like to use to create the function interestingly these templates directly correspond to the triggers available to us to execute the function let's go ahead and pick HTTP trigger provided with a friendly name and secure the HTTP endpoint with a function or an API key so what did this do for us going back to our directory it created a new sub directory with the name we gave for the function with a node script and a function JSON configuration file looking at the node function it consumes an HTTP request input and parses the contents of that input to find the name property in the body of the query string it then uses the name property to construct an HTTP response which is returned back from the function you can see the function JSON configuration describes the HTTP request input and the shippi response output binding right here within function JSON now that we have our function we can go two ways either we can go ahead and publish to Azure and trust our fate for it to work out of the box as it is or we can use the open source functions runtime to debug and test locally and the great thing is that we as code enables you to do all of this simply on the click of an f5 in fact if you've got the node extension installed you can even go ahead and set breakpoints in your code to debug and look at the call stack now let's take a look at a slightly different function here I've got a node function that triggers off a message or an event received on an IOT hub it then grabs the contents of this message and out puts it to the console now that I have my function I can go ahead and f5 into it to test locally and I can also go ahead and deploy this function to Azure so let's take a look at how to publish the app I can go ahead and pick a subscription and create a new app with a unique name let's call it connect demo and then we can pick a resource group for this function app as well as a storage account to contain the contents of the app and the files and now that we have our function app provisioned we have one more step to configure any settings or secrets for the function app picking the subscription again and here's our app now these settings while running locally are saved as either environment variables or properties in the local settings file for a function to connect to IOT hub we'd configure the IOT hub connection string that we can now go ahead and provision as an app setting on the function app and once we have that we're pretty much ready to go ahead and test our application running in Azure for this will connect to the streaming logs for our function app again picking the function app and we can go ahead and start seeing the application inside slogging and to simulate these events on the IOT hub I've got an app that will register multiple devices and start sending notifications to the IOT hub and we should notice shortly that our functions started to pick these up and output those events or messages back to the console and that's it we developed an end-to-end service application tested a locally published it to Azure and even looked at the monitoring logs right here from within a local instance of vs code with Azure functions we strive to keep improving developer experiences and provide support for the languages and tools that you're most familiar with so you and your team can be more productive to find more information and get started please find the link on the screen we look forward to helping you with your service mission thank you

Azure DevOps & Azure Pipelines Launch Keynote

welcome to the launch of Azure DevOps my name is Jamie cool I'm the director of program management for the Azure DevOps team we got a ton of exciting things to talk about today here with me I have mr. DevOps himself Donovan Brown thanks for having me Jamie I'm really excited to get started because some of the demos we're gonna show today I'm really gonna highlight the power that we have with a chanela what I want to make sure people realize is that you can also be a part of this conversation it's not just the two of us but if you're out there on social media make sure that you use the hashtag as your DevOps and if you want to learn more about what we think about DevOps here at Microsoft make sure that you go to a sure com forward slash demo right now we're gonna be talking about DevOps you know for this next hour I think it'd be important for us to level set well we actually mean when we said DevOps and I've been led to believe that you might have a few opinions on this particular topic a few and it's really important to level set because if you ask several different people what DevOps means you're gonna get several different answers so it's really good to make sure that we level said on what we believe DevOps is here at Microsoft and we believe that it's the union of people process and products to enable continuous delivery of value to our end-users the most important word of that definition is value too many people focus on just moving files or automation but it's the value that you're trying to deliver to your end-users and what I've found is that it takes the products to support the process what your people have chosen that's empowers your people to deliver that continuous value what I think is even more important than that is that when you start to take that digital transformation when you're on this journey the gains that you get are staggering and sometimes almost unbelievable as I go and I visit our customers all over the world those that have started this transformation are deploying sometimes like 47 times more frequently than they were before and historically there used to be fail fast but they're not failing fast they're succeeding fast because they have seven times less failure eight yeah you know when I hear some of those numbers on the surface they just seem kind of staggering and crazy when I step back and I think about it I realized you know what like I've experienced that you know firsthand you know it wasn't that long ago that a Microsoft you know the average chip cycle was two years sometimes longer you know now I look at just last week last week we shipped hundreds of changes just as your DevOps itself you do the math between a couple you know a couple years and hundreds of changes a week you get these big numbers and it's not like the folks today are just that much better than the folks ten years ago it's that we've gotten smarter we've learned we have better processes we have better products and that's a lot of what we're going to talk about today and what I'm excited about because we're now providing the products that we use that we've invested in and bringing them to you so you're going to be able to take advantage of them and that's what as your DevOps is as your DevOps are a set of services that span the entire DevOps lifecycle you can use them all together for a full solution or if you just need a one with a particular problem you can use just that or you can put it together with other tools that you're already using that you want regardless of how you use it it's going to provide a lot of value for it for you and I know that because inside of Microsoft we get that value we see that regularly just in the last month over 80,000 folks here at Microsoft have used a shred of ops to deliver our products to you from both the smallest all the way up to some of the largest so let's start by drilling in and what we actually mean by ours our DevOps and let's start with Azure pipelines so Azure pipelines is really the heart of the DevOps process it's a CI CD system it's a continuous integration and deployment system and you use this to keep the quality of your application up to make sure every change that you make is taking you forward instead of backwards and that's really the key thing if you want to be able to ship whenever you want to keep your code quality high you can also use it as a launchpad to get your code up into the cloud whether it's our cloud Google AWS or any other because as your pipelines is a system that works for any language any platform and any cloud we have hosted pools and machines of Linux Windows and Mac that we manage for you so that you don't have to because everything we're trying to do with this is to make your life easier as a developer and as your pipelines doesn't stop with what we've shipped it's highly extensible we have an ecosystem of over 500 extensions that have been contributed for both the community and from our partners from slack to Soner cloud all right you know one of the things that always excites me the most is when I see a new extension showing up and seeing what someone's been able to to do and extend you know with are with our product now you can use it for any type of application in any type of deployment mechanism but containers are increasingly becoming that unit of application deployment so as your pipelines works great with containers you can use it to build your containers to test and validate your container to publish it to whatever register you want and deploy it to whatever service you want including kubernetes now it's a lot more interesting to actually look at it then talk about it so Donovan can you give us a walkthrough of Azure pipelines so Azure pipelines is the CI CD system that we have that can build any language targeting any platform and that's what excites me about it as Jamie said earlier we give you access to max to Windows machines and to Linux machines there's nothing to install you just give us code and we'll build it for you Here I am on my dashboard and what I'm going to do is I'm going to click on this icon for this particular spring MVC application this is a Java app over here I happen to have a no js' application again any language in any platform clicking on this icon is then going to take me to my build results of some of the bills that I've been running previously if we look over here I can see exactly what branch I was building I can see if I was actually working on a pull request or not and clicking on one of these builds is now gonna take me to a summary page and a log that I can quickly review as we can see here I had an error on this particular build if I go ahead and drill in on here I can see this log file I can see this great map on the right-hand side and if I scroll down to this huge palm file build you'll see that we actually had some errors down here so it's very easy for me to diagnose but this isn't the only way that I can see my test results and I'll show you some other cool ways of doing that here in just a moment another thing that we can do is we can use this histogram at the top and start to see other builds that have already run and luckily we've had some of whom that have succeeded and as you can see here I have the same log but better than that I also have this great summary the summary here allows me to see my test results it allows me to see any associated work I can come down here and also see any deployments that may be running a matter of fact you've already successfully deployed this build into our dev environment and it's pending my approval to go all the way into our QA environment you get to see the real power of our pipeline system when you go back in and you start to look at editing one of these it's a really nice graphical user interface that allows you to simply drag and drop town again I want to highlight over here if you look at this drop down here you can see all the different hosted pools that we give you what I mean by hosted is there's nothing for you to install all these resources are provided for you and they come in a variety of different platforms you need to build your iOS application we have a Mac sitting in the cloud ready to build that for you you want to build your containers on Linux we have multiple Linux images and containers running for you so you can go and build those images and once they're build you can deploy it in the docker hub or to ACR wherever your images need to be stored in addition to that where can you get your code you can get your code from the most popular source control systems your doing open source work and you want to put your code in github no problem you want to have private repositories because you want to secure your code and you don't want anyone else to see it you can use our get support as well you already have your code in subversion or some other form of source control don't worry about it you can still use as your pipelines to get your code wherever it exists today and be able to start running CI and CD against it again adding new tasks is very simple you simply click on this plus here and you can simply drag and drop from hundreds of tasks that we have available for you right out of the box what I really like about the out-of-the-box tasks is that they're all open source you can go and see exactly how we wrote all of these hundreds of tasks and use this as a way for you to learn how to write your own if you already know nodejs or PowerShell you know how to write these particular tasks but before you go off and write your own adriaen courage you to go and look at our marketplace as jamie said earlier hundreds of our partners have gone off and written extensions that add a lot of value and all you have to do is simply click on it you get them for free and add them to your pipeline and you know you have new value not only in your building your release but new hubs and widgets and all other cool places that you can extend our system now I love our graphical user interface but I've known a lot of people prefer to use yamo they want everything in source control now what's really nice about this is you can just simply click on this link here and we will export the handle for you so you don't even have to write it what I really like about this is I actually keep both of these up because I want the best of both worlds I love the visual representation I love the ease of editing I can come in for example make a quick change to a particular task and then export just the Amal for that task I can copy this to my clipboard I'll run over here to get hub where my code is currently sitting I can find that Yemma file that I created earlier and I could edit it right here inside of github so let's just go ahead make a quick edit I'm gonna paste the code I did I just want you to see that we can have a really cool pull request let's make some changes I'm gonna come down here and save this into a different branch because I want to show you some cool stuff here so I'm creating a patch branch for the change to my llamo file and when I do this and create this pull request I've wired up Azure DevOps to my github repository sets that every pour request that is submitted will actually have to run that build and succeed before I'm even notified as we can see down here we now have a bill that is queued it's currently in progress now if I go ahead and click on the details I will be able to jump right back inside of Azure DevOps see the pipeline that it actually started running for me and in a moment here once it connects to the agent I'll be able to see a full live log of everything running against my particular build that way I can get quick verification that if the pull request is good that it passed my test and doesn't need the attention of the moderators and the contributors to go back in and review that particular pull request another thing that I wanted to talk to you about was the testing that I mentioned earlier so if we to go back to that definition let's pick this one here for some fun and I'm gonna click on analytics what analytics does for me is it actually watches the test results over the history of this particular build and it gives me a report letting me know how successful our testing has been over the course of a period of time if I click on this I get to drill down into these analytics and I actually identify the tests that we need to go back in and verify there's different ways that I can slice and dice this data find out which of my tests are taking too long so that we can focus to get our build times down I can figure out which tests are flaky for example the about test was the one that was broken and then and spend some time going in and investing to make sure that is safe once I know I have a high quality output from my build the next thing we have to do is release that code and that's where our release product or what we call pipelines as you'll see in the navigation here is where we take the output of the build and we run it through a pipeline deploying it into multiple environments and even allowing you to do approvals between those environments to make sure that your code has safely landed in the target environment if I were to go back in for example and look at one of these releases we'll be able to see that I'm actually deploying this application into kubernetes if you wanted to use helm you could I'm a newbie when it comes to using containers in kubernetes so I just went ahead and do some coop cuddle commands to get my code into the cluster and as you can see here I did a coop cutter will apply and another coop cuddle set and then I was able to deploy my code if I go back in here really quick and edit it well you'll be able to see here is that if I go and look at my tasks I can see exactly what it was that was doing before I was playing with infrastructure as code so I was actually able to take an arm template and deploy my entire kubernetes cluster into Azure before it even existed which is really nice as well I could come in here make some really quick edits the tasks are so well written that even your pool secret is automatically handled for you again allowing you to take your code from the fingertips of your developers and putting it into your hands of the users using Azure pipelines so that just shows you some of the power that we have inside of Azure pipelines for any language in any platform all right Jaime show us some more stuff thanks Donovan so over the last six years or so we've been on a journey here in Microsoft that we often talk about internally as the new Microsoft and it really starts at the top but at this point it's percolated really all throughout the entire company and it's someone that's been here for 20 years this has been a really exciting time to be part of Microsoft you know a big part of what it means to be the new Microsoft has been the embrace of open-source and if you look over the last six years you know the amount of things that we've been doing in this space continues to grow up go up year after year after year you know it starts with things like simply making sure that we're embracing the projects that the community has chosen to embrace a great example of this would be kubernetes on Azure another example that I was directly involved with seven years ago was get right it seems obvious now but back then it wasn't such an obvious question about whether we should embrace git or whether we should try to compete with it we chose to embrace it and now seven years later almost all of the development that happens at Microsoft happens in gets including windows and just step back and think about that for a minute the windows team uses the source control system that line is built to build windows it really is a very new Microsoft another example is open sourcing more and more of the products that we deliver vs code and typescript are great examples as your pipelines itself has core parts of its infrastructure open sourced so I'm excited today because we're gonna a bolide amiss list and that is free CI CD with Azure pipelines for any open source project that wants it this means any open source project can use Azure pipelines you get unlimited minutes up to 10 concurrent jobs running at the same time access to our Linux Mac and Windows pool we use the same exact infrastructure for open source that we use internally for our own builds and that we use for our customers this means open source gets the same quality of service that we can that we give to everyone we also want it to be really easy for projects to get started that includes open source and really all of them since most open source projects live on github as your pipelines is now part of the github marketplace this means that you can discover configure and even pay for Azure pipelines through the github marketplace so if you already have a billing relationship with github you don't have to set up a new one with us and again the key theme of all of this is just about making the lives of developers easier and if they got one less payment vehicle to manage your life just got a little bit easier I'd like to show you that in action so let's switch over here and I'm going to show you as your pipelines as part of the github marketplace so I'm looking at your pipelines I can configure my plans or I can set up a new plan we scroll down we can see that you could configure a free plan and like I said it's just free for open source we also have a free plan for private projects you get up to eighteen hundred three minutes if you want to use it for private projects you can add more parallel jobs you can run more of them at the same time you can do that for $40 each and again you can configure this and pay for it right through github itself let's go ahead and choose the free offer and let's set this up we're going to configure this in the Raleigh labs github organization and now what's going to happen is we're gonna consent to grants as your pipelines access to the repositories it could be all the repositories it could be just individual repositories in this case we're gonna just grant access to some repositories and then we'll go ahead and create a new Azure DevOps organization and what this is going to do is it's going to set me up with everything I need to use as your pipelines and as your DevOps so it's going to create our organization and then it's going to set up our first project and land me an experience where I can configure my first pipeline on for whatever repo that I want to in that github organization so let's go use the node container repository once I select that we'll go and analyze that repository to see what's inside of it and we see that there's a node app in it so we're suggesting a whole variety of different node templates that we have out of the box but we also saw that there was a docker image so our default recommendation is to use our docker template now Donavan mentioned config is code we're gonna use that in this situation and this is the definition of my build process and it's simply saying it's going to use our abun to pool and then it's going to go build our dock it's gonna build our docker image I could go and modify this process as part of it but I'm just gonna use the default state and now I'm going to save it you and we're gonna check it into a new branch so what this is gonna do this is gonna create a pull request when the github repository to add this yamo file to that repository which will then have configured pipelines and ensure that all changes that go into that repository from now on are validated then it's going to kick off the first build to do the validation of the actual configuration of pipelines being added to this repository so as that kicks off we can jump back over to the github repo and we can see that there's now a pull request and go into that pull request see the file that we're adding is the actual pipeline yamo file to go back to the conversation we can see that pipelines is in the process of actually validating this change itself we also support the github checks API which is a rich experience for showing the status of a variety of check of all of the sources that are hooked up to this repository so here you can see as your pipeline's publishing that status into it so this just gives you a taste of how easy it is to get started and you know the type of integration that we have with github as part of Azure pipelines now as part of the run-up to the launch of Azure pipelines we've been working with a number of open source partners to do some more early onboarding and we've been really enthused with both the feedback and the reception that we've gotten so I thought it'd be interesting if we invited some of them to come join us so we have folks from a number of from a number of them the first is github desktop so we have Bill hack from github and he's here with Donovan to share his learnings Donovan thanks Jamie so again we have Phil here from github tell me what you do it github hi I'm Phil hack a director of engineering at github I and in charge of the client applications team so we're the team that builds all the software you use outside of github such as get a desktop atom which is text editor electron which is a framework for building cross-platform apps using web tech okay and then we also have a team that builds extensions to third-party editors such as a visual studio just to do code and unity awesome so I would imagine managing that many products something is crucial to CI has to be important so what is CI really mean to you and what does it bring to your development I think one of the best ways to understand CI especially when it comes to open source projects is to imagine a world without it and how people would collaborate with open source so imagine you know someone named John is right and you know approaches github see the repo says I want to contribute to this fixes a bug pushes the code up and now Egret you know who's if one of the project maintainer comes along and she notices that oh this person submitted this fix let me try it out so it pulls the code down and hits the build and it doesn't build and I'm like oh darn it you know so Wright's comment you know nothing you know good fix the build and then the next day you know John's back let sees that you know okay fix the build pushes it Ygritte takes it down the next day runs a test and and realizes oh the tests fail because you know maybe John only random in the dev configuration not the prod configuration and what continuous integration brings is it really tightens that feedback loop so that rather than you know John having to wait for some human to look at it he pushes up the code all the tests run in all the proper configurations and it gives immediate feedback it can run your tests your static analysis your linters and that way like you know you take the grunt work out and really tighten a feedback loop and then force your project standards and all of that and so that's one of the beauty of CI for open-source project yeah I remember the days when I used to come into work do a get latest and the build was broken and because someone left right and then that person has to bring Donuts the next day and when we had CI it was really cool because it would point the finger at the person who told us donuts but you knew not to go do a get latest because you had that signal saying the build is broken which also protected us that way as well yeah a lot of people would try to do the whole traffic light thing exactly in the office right now they're doing raspberry pies with LEDs and like you know if it's if it's okay or not so there's a lot of CI systems out there we've been doing CI for a while what is exciting you about a sure pipelines in particular I mean the thing that most excited me about as your pipelines when I first heard about it is the cross-platform nature of it with electron apps like I mentioned before you're targeting Windows Mac and Linux and that it means that you often will have three different CI providers each of them with a different yam will file sure and it becomes a bit of a maintenance headache and with that your pipelines you know we could have one provider with one Yamma file and have it build on all three targets absolutely I always get on stage and I'm saying any language any platform and people think I'm bluffing I'm like no look at our our queues right there any platform you need is in there for Mac for Linux if you're doing mobile if you're doing containers that's amazing and I've it was interesting I was going around github the other day and every time I'd go into a repository I see three and four llamo files like I don't understand like why are people doing this right don't they know that they can get one yeah mole to rule them all and get you all the platforms well I mean that wasn't an option not too long ago right that's true and it's particularly nice the other thing about Azure pipelines is you know through your generosity you're all are offering it to open-source projects are free so I think yet we have millions of open-source projects on github I think that's a great option for them especially for electron projects who really want to target all this all three platforms cool so you show me what you did yeah so here we have get up desktop and this is our git git and github GUI client okay and it's an open source project we develop it in the open and if I scroll down here you can see that we have badges for our builds and this is the azure pipelines build and then you know let's take a look at pull requests so you know these are submissions by the core team as well as people outside and so let's say you know I'm looking through here and I see oh here's a submission from an external contributor and the build failed let's investigate so I click on that you know hey thanks Damon for contributing I'm going to scroll all the way down to the checks API and we can see that we can see that for there's for failing checks and when I expand that we can see you know each of the individual checks and I see that you know the azure pipeline's build is failing so I can click details and takes me right to logs for this build you can see that you know it's it's building on Windows Linux and Mac and it failed for all three platforms if I scroll down here on the right I can see each of the steps of the build and how long those steps take and here I can see oh the linting had an error and if I click on the error I get the full log output so it helps me see that I needed to leave some strange characters from somewhere and then you know I now know how to fix my bill and if I want to go right back to the pull request I click there and I'm back where we started awesome and this allows like I said I don't have to as a I maintain open source projects too and this just saves me a ton of time as you mentioned earlier just having to allowing them they get the feedback from the system and not having me stop what I'm doing clone their repo try to build their code find out it's broken like oh my god I was like five minutes of my life I'm never getting back again please someone help me do this and now or sec the build fails I don't even look at it all right great that's someone you get the same notification that I do go fix that and then when you're ready I'll finally go ahead and take a look at it so yeah saved me a ton of time as well that's exactly right awesome Phil thank you so much for coming and showing us how you at github or actually using Azure pipelines all right Jamie go ahead and take it back you know what really excited and resonated with me from that conversation was the notion of being able with one product with one pipeline with one llamó file to be able to validate across all three operating systems and not have to deal with managing any of those machines itself it's a pain point I hear again and again and again you know so the next project we're gonna look at is in the Python space so Steve dower is here with Donovan Donovan so I want to go ahead and address the elephant in the room I just heard Microsoft and Python what in the world that you do here at Microsoft that has to do with Python I so I've been here I've been here at Microsoft for about six or seven years now and the entire time being working on Python stuff Wow so a whole lot of the visual studio integration Visual Studio code support for Python a whole lot of the Azure services support for Python has kind of come through my team or out of my team so I've been working on that few years and I'm also a core contributor to Python itself so I'm one of the one of the team of volunteers distributed around the world that work on C Python the reference implementation awesome design and build a language so how did you start to use Azure pipelines when it comes to Python so I've been using agile pipelines internally for years now say all of our products are built on it as we've already heard earlier Visual Studio has been building on it for long time now so I had a lot of experience you know getting pipelines up and going with that and then I saw the cross-platform support was cured because early on that wasn't there and now and now it's here and I start looking at that I'm like oh I could be doing a Python builds on this across all the platforms with a single setup right and then the open source offer comes along it's like oh yeah let's let's get pipe and running on this so I just kind of went out and started doing it cool and just just to put a bit of context on that I've got the the Python home page up here we can see we've got three badges going for the Linux Mac OS and Windows build but Python runs on so many more platforms than that if I run over to this is our our existing build bot site this runs tests against all of the configurations that Python supports on every single commit and you'll see this is a really really long list sure and so you know the the value and being able to get off all of these manually configured manually managed configurations onto something that's you know cross-platform continuous integration in a single service is like really appealing ok and so I did that for the main platforms and so we have all of these pull request builds and commit builds running now for the main platforms and that was really just I went to the dev guide that we have we have all the instructions for all the platforms on how to build we have all the instructions for the existing continuous integration systems and I just pulled them over into that visual designer that you showed earlier sure and just got them running in their view llamó exported out check it in and now it's in the repository and we've got all these builds running out of the Python repository configured as code now what I've noticed is that we offer a lot of hosted agents and a lot of different platforms but we don't offer all the platforms you just showed there so how did you tackle the fact that you needed to run on even different platforms than that yeah so so so far this is not the hundred different configurations right we're not at that yet but the potential is there because as your pipeline supports private agents so I can set up any machine anywhere I want virtual machine and the cloud physical machine on my desk old Raspberry Pi sitting under the under the chair wherever it happens to be put the the pipelines agent running on it so it's dotnet core anywhere don't gotta run I can run that thing if it's connected to the Internet I can start running builds on that machine from the edge of pipeline service that's all still going through the one thing one pleasure I'm already doing that it's actually the windows release build so one of my jobs for cpython is doing the official releases so the the python.org downloads for Windows built by me code signed published all of that is is one of my jobs as a volunteer and so you know that's a manual process right I log into a VM and type all these commands and and you know sit there wait for it to finish to the publish I want to automate that so I put all of that into a a pipeline build which you can see here basically my commands this is not running on one of the hosted agents because it's got kind of some special requirements to it we do profile guided optimization on on every release build so we want you know much more powerful machine faster CPUs to get through the training that much quicker gotcha just to save us some time there's also code signing so it's every single binary and the Python package is signed with authentic code certificate under the Python Software Foundation name it's valid on every Windows machine in the world basically that's that's a high value we don't want I I don't want that you know bouncing over the internet every time I do a build that's locked down on a private virtual machine that I have running on Azure here's my cue or my pool you can say it's offline at the moment I don't even turn the machine on if I'm not building anything that's encrypted at rest it's encrypted while it's running it's BitLocker the whole way through the machine and so I just log into the azure portal start this machine up queue up my builds let them run shut the Machine down and we have like a custom secured machine that no one else has access to no one no one's making one of those poor requests where they just like download all your certificates and send them off to their own site absolutely because we never even run poor requests against this machine yeah so having that private agent there as an option to be able to expand beyond not only the platforms that we provide but also very unique secure scenarios like the one that you just described where you're able to no there's no way anyone's getting to that file because there's only it only exists in one place and that one place is encrypted to the enth degree but I can still use that machine to run my build which is incredible yeah and so as far as getting cpython building there's there's integration steps more to do like there's a whole lot of cool features that we're not using on pipelines yet but the flexibility is there the potentials there and so I'm really excited to keep building on that I know I'm gonna be building on more of this this week so if people log in at the end of the week then they're probably gonna see changes in this already yeah but this is for what I understand the engine that most of this code is actually in see that actually drives a Python but what if you actually want to build a Python app is I mean are you able to do that just as easily yeah that's yeah one of the the newer thing that's that's showing up in pipelines with you know this you know being released right now is a whole lot more Python support and we actually reached out and got a couple of projects on board they were very excited to do it talks pip pip End Python developers will be familiar with this because they're very well known projects there but I want to have a look at talks actually because it's one of the the more thorough and complete integrations that they've done and there's some really cool aspects to it so ok talks is actually a tool that is used in CI systems people it lets you specify a configuration file with all the build steps and run that across all of your full matrix of target platform ok so a Python project is normally you care about Windows Mac Linux you care about Python 2 7 3 3 3 4 3 5 3 6 there's a big matrix of C test against talks helps you with that it lets you write one set of instructions if I pull up their file you can see there's a lot of environments that they care about and they have all of these steps and this was already there ok this was already there in talks like people have this file so when they came came on board the pipelines and started using it they set up a build that like they wanted to reuse that file you guys they didn't want to go oh we have to rewrite everything in a completely new form so if I pop open their most recent build which I've got here we can see that in fact let me jump to there there yeah more file because I made a yellow file 3 because that's you know they want everything in code yep and it's not it's not even as long as the other one there's a few steps in here but essentially all it does if I look at one of these examples they're picking a version of Python we have them there we let you choose the version you want at the start of thing okay then they install themselves they install talks and then and then they use talks to test okay but what they have done is they've actually inverted it so normally you'd say run talks run everything sure and it does all of the platform's all the configurations in one go they've inverted this they're actually using our multi version so our matrix support okay so they have the matrix here of all the versions and then they use talks to run each one and let us do it in parallel gotcha so if I jump to the build and have a look at the logs you can see all of these jobs down the side which is every configuration they care about all the operating systems different queues for each one of these so this one ran on Mac this one ran on Windows different versions each of these ran in parallel yeah because we'll run them in parallel each one is running talks just a single environments you're inside it so they're actually getting the same result as they would have if they were running talks on a single machine but it's all come in parallel some of the cool stuff they've done here is they're using these guys you know really good at using kind of the standard tools that exist in pythons so they use the standard code coverage tool that most Python projects use this generates a cobertura file okay which we can upload and give you the summary right here and so that integrates nicely with pipelines because we understand that file format tests they run in PI test which connects port j-unit perfect XML they then push that up and we get the summary here if I jump over to the Test section we get all the results they have good results right now so let me clear that filter and all of the test results for their process sorry about the size here that's fine here we go we can see all of the tests that have been run and if any of these had failed then we'd get the information from that so all they've really done is taken their existing build and test tools and switched it over they've inverted the matrix a little bit to run on pipelines and they they get all this really nice integration they haven't had to rewrite their entire system to keep using the standard Python tools that is already out there and they're really just bringing over you know what what shell command should we run at each step and it's really nice to not have to learn something new yet you get this really rich first-class experience like you showed me the code coverage and the test results and it's integrated into your summary it's not as if yeah we know how to run your stuff but we don't know how to display the results to you but we do which is really amazing that you can now use it again any language any platform but you don't sacrifice anything when you do write we don't care we whatever you want to bring us we're gonna build it for you and help you deploy it so I really enjoy and I'm really glad that you came and shared with us how Python is actually able to leverage as your pipelines as well so thanks again for coming and Jamie back to you thanks Donovan so the last project we're gonna look at is Visual Studio code and I have Amanda silver here with me from the Visual Studio code team and Amanda everywhere I go I see people using Visual Studio code developers really of all types have just embraced in an amazing way you must be thrilled yeah I mean I joined the Visual Studio code team about two years ago and since its release in 2016 it's actually become one of the most beloved code editors that's out there in the planet and part of the reason for that is because we have a really rapid cadence of updates and releases that have new features and the way that we can support that is we have actually a lot of community contributors we have over 4 million monthly users of v/s code and we actually have one of the it's one of the most popular open source projects out there on github in terms of people contributing to it we've had about 15,000 non-microsoft contributors to the vs code project wow that must take a lot of work to take it out many contributions yeah it is it's actually a lot to manage and our development team definitely says that that one of the most challenging things to deal with is actually code reviews and in fact even when we interview other developers who are users of our tools they also say that code reviews can be really really painful senior developers are just bombarded with requests for reviews and when they actually go in to do a review it's really hard to figure out kind of where to focus and even further you're oftentimes using a web editor or something that's kind of not your usual tool set so we've been working with the github team over the last couple of months to see if we could address some of these problems and actually we've just released a new version of es code that some new API is in it and the github team just released a new extension for PRS that allows us to kind of have a PR experience directly NBS code so that should make it a lot easier awesome one out sure okay so what you can see here is I have my vs code at code editor right here and you can see that I have all the colors that I expect all the theming that I'd like to see I have the get like it lens extension here which is a super popular community contributed extension to the vs code community but I might have a pull request to do and so if you go to the source view right here we can go right here and look at the in addition to kind of seeing the usual changes viewlet i now have a new viewlet in here called github color pull requests and i can further just go ahead and expand that and see that there are some new pull requests that are waiting for my review so what I can do here is expand that as well and even look at the description now right in the context of of BS code now what I probably want to do is then actually go look at the code changes so I can come in here and I can see a dip few right here in vs code which is pretty awesome and that allows me to do that kind of you know first glance a review that I might want to do looking at the two deaths and but I get the the color the colors and theming that I'm used to you for the you know typescript code that I'm looking at in this case if I want to do a deeper review though what I can do is go back to the pull request here and go ahead and check that out and what that's going to do is it's actually going to switch vs code into a code review mode and bring all of those changes locally so now I can go ahead and look at the changes in that pull request go to the files look at that same file and I'm going to just expand this so that in the full kind of view I actually get all of those same extensions completely running in this in this code editor right here and so what you can see here is that I actually get a squiggle and the reason I get that squiggle is that because all of the extensions are running on my local copy of the power of the changes the typescript compiler is actually checking statically analyzing the code here so if I mouse over this you know we can see that we can see that this variable is declared but its value is never read so what I can do is then just go ahead into the gutter here and just add plus and make a comment looks like this isn't used and go ahead and add that comment and then the other thing that looks really weird to me is that these hard-coded values so again I'm going to just add another comment here and say hard-coded values and go ahead and add that comment and then I can go back to the description page for this pull request and just go ahead and add a top-level comment left a few notes so add that comment and now what I can do is actually go ahead and look at this change directly in github and what you can see is that the comments that I added are still there just right here hard-coded values looks like this isn't used you know immediately what I what I just showed is now in github now even further if I go back to vs code what I can then do is go ahead and just exit review mode because I'm done with this review and just go ahead and exit it and just go back to my normal coding go back to my normal view but now what I want to do is go ahead and look at that look at that pull request one more time just to make sure that you know the build past and that's really where as your DevOps pipelines come in so if I look down here what you can see is I can go directly to the vs code build and this will bring me directly into the azure devops pipeline experience and what you can see here is that we for the vs code project we really have as your DevOps pipelines and the reason is because it allows us to build for Windows Linux and Mac OS all simultaneously using all the same kind of infrastructure all the same scripts and so what we can see is that we have all of those builds and all unfortunately failed so let's just go ahead and look at one of these compiled sources and what you can see down here is that yeah so we also have the zoom level default is declared but its value has never reached so you know well that error would have been picked up in the CI which add your DevOps pipelines really would help with as well you know now because I could run that as part of my review it it might not even get to that level I might actually be able to to say hey you know before you actually merge this you probably should fix this error this looks really cool I can see how a lot of folks are gonna get a lot of benefit out of doing this and it's going to make their their review process and just a lot of what they do every day a lot simpler and I'm happy to hear that as your pipelines is able to make the actual development of vs code simpler in and of itself yeah we really appreciate it and definitely our development team I think is going to you know feel super powered by having as your pipelines behind them if other folks want to try out the the github pull requests review extension it's actually available with the latest vs code and in our extension gallery so they just need to search for github pull request awesome thanks a lot Amanda cool thanks Jamie so we've talked a lot about open source projects and you know the thing about Azra devops is that it works great for open source but really for all types of applications from both the smallest to the largest we have organizations of all shapes and sizes using it today shell is an example of a large organization they have over 2,800 developers using average or DevOps all over the world Hawaiian Airlines when they moved to Azure DevOps was able to increase their bill to improve their build time by over 400% you know because as your DevOps is a cloud hosted service getting up and running is really simple so Accenture is able to spin up new projects in no time with Azure DevOps now really the largest of all organizations that use Azure DevOps is Microsoft itself we have over 80,000 people that use it every month to ship our saw and the numbers are just staggering in terms of the scale we do over 4 million builds each month we do 500 million tests executed every single day every single day every we have over half a million work items to get updated and the number that I find the most satisfying is that 78,000 deployments are done with Azure pipelines every single day which means there's a much smaller window from when we write code to when it gets to you which is better for you and frankly it makes our customers our developers happy too because they have a much shorter wait before what they've created gets in your hands so I thought it'd be interesting to actually show you how we use Azure DevOps on a regular basis so of course we use agile devops to build Azure DevOps so Donovan is going to give us a walkthrough of our actual engineering system the actual system that our engineers are using right this minute to build Azure DevOps so Donovan let's taken us have a look thanks Jamie I love that inception kind of work that we have where you actually use the product to build the product and we're not the only ones inside of Microsoft that uses it we obviously have the windows team some of the Xbox teams and everyone's moving to what we call our one engineering system so what I thought it would be cool to do is take you through like the day in the life of an engineer on the azure DevOps team and what they experienced to get their work done using the product that they build to build a product that they use so here we have a dashboard imagine you're coming into work and you see this dashboard on your plasma screen or on your surface and you can see exactly what your team is working on what sprint you're currently in how many days are left you can go and see what work is currently assigned to you how many bugs you have out there you can see the health of your builds your team members what features you're working on and make sure that you're focusing on the most important things first this dashboard is completely customizable yours can look completely different have a great library of widgets that you can use to build it and what they're able to do here very quickly is see exactly what they're supposed to be focusing on so that they can deliver the highest level of value not only do we have great dashboards but we also have product backlogs backlogs are a priority list of all the things that you want your software do you can simply drag and drop items from here to assign them to a particular sprint so you can start doing some sprint planning as well I won't drag anything now because as a Jamie pointed out this is literally where we're building the product and I don't want to assign work to the wrong sprint I love the fact that I can expand this and get a really nice view of exactly all the work necessary to turn one of these ideas into a working piece of software we also have the ability to have Kanban boards this allows you to visualize the movement of an idea from creation all the way to being done and actually being run in production and done for us means it's actually being monitored in production so that we can learn from the telemetry and decide if our priorities are in the right order and go back and use that data we call it monitor and learn again this is a very rich user interface where we can simply drag and drop these tiles are already assigned to people and one of my favorite things that we can do here is actually create a branch right from the board for the work that we want to go off and create so now I'm using git we're using feature branches I have a feature I want to go implement I don't have to go off and create the branch separately I can create the branch right here from this board and what happens up happening is that work item now becomes associated to that particular branch and that traceability lives throughout the entire course of this work so not only do I have the branch tied to the work item every commit is also associated every CI build that is triggered every release that is deployed is all traced back to this particular work that I was doing here I like being able to see every line of code that I changed so I can do test impact analysis and I don't have to go running around to find it the system actually gives that to me by simply creating a branch once that branch is created I go off and do my work and here's our git repository and you can see on the left hand side how all these branches start to come back together this allows me to visualize the branches that were created the pull requests that merge them back in the master to make sure that we're delivering on our goals we don't just go merging back into master willy-nilly right that could be a recipe for chaos so what we do instead is we use a process called a pull request a pull request is an opportunity for our peers to review our code before it gets merged back into master because master is the law this is our golden master and we want to protect that and we protect it through a process called a pork if I were to come over here to the pool request tab it shows me all the pull requests that are currently running a pull request is a chance for your engineers to review each other's code it also has the ability to run tests and run builds against the code as well if I were to drill in on one of these for example I'll just pick a random one here we'll be able to see everyone who's involved in the commit we'll be able to see everyone who has made changes what lines they're on I could actually leave comments on each individual line discussing with the engineer what's good and what's bad about these particular changes if I wanted to I could see if there's any conflicts the commits and we also have policies applied to different branches and the policy that we have applied to our master branches you have to survive a build and in that build we run a lot of tests I believe if I remember correctly we're running somewhere near 83,000 unit tests every single time you do a pull request and if a single one of these fails your entire pull request gets stopped so we want to make sure there's a lot of quality a high level of quality because these are unit tests we can actually run 83,000 of them in less than 20 minutes we're getting that signal back to our developers very very quickly and because they are supposed to pass we've all had flaky tests in the past and people start to ignore those we worked really hard to make sure that these are solid they're fast and they're reliable such that if a single one of them fails no one ignores that we go immediately and figure out what failed and we fix that code and we start this process over again to ensure we only ship the highest quality code to our customers and to ourselves because we are our first and biggest customer here at Microsoft running all these unit tests allow us to ship the highest quality code to our end users and it doesn't stop there we continuously run tests against build after build release after release to make sure that we only ship high quality code and it behooves us to do this because we're the first people to get the code that we ship we don't put it on to our customers unless it survived time with us here at Microsoft when you use the tool that you build to build the tool that you use you cannot risk having bad quality software because it could stop everything that you're doing as a matter of fact here is our deployment plan and what's really cool is we actually use safe deployment here at Microsoft which means we deploy two in a production environment and we let the coat sit there for 24 to 48 hours and it has to survive our telemetry and our monitoring and our daily use before we then allow it to deploy to another environment this first environment which is identified here as ring zero is actually where the Azure dev ops team actually works so when we're pushing out new features we're the first to fill those features if we make a mistake or the only ones to feel the pain of that mistake we go back in and recorrect it after we let it sit here and we monitor the telemetry we check for any new work items that have been logged for particular bugs we make sure that it's healthy and can sustain our traffic we then promote it to the next string of our deployment and we rinse and repeat this until it gets all the way out into production for all of our current users so this is how we ensure and how we use Azure devops to produce Azure DevOps for our end users thanks Donovan now as you saw as your DevOps is really a full end-to-end solution across the entire DevOps chain with great traceability from the start all the way through to the finish it's highly scalable from the smallest team all the way up to the largest team its Enterprise ready you can run in whatever geo that you want so you can keep the data close to home you can run it in our cloud or we'll take care of everything for you or you can run it on premise with Azure DevOps server which lets you install and manage a cert the azure devops services however you want you really have a choice between a public and a private cloud now Azure DevOps is the evolution of visual studio team services which is why we're able to capture so many of the learnings and innovations that we've had over the years and this evolution is really based on the feedback that we've gotten from customers and that cost that feedback is about choice you know lots of folks want to be able to use the full end-to-end solution the way Donovan just showed you but others want to have the choice of just choosing a particular part of it just using pipelines or just using artifacts or just using boards and putting them together however you want and you're able to do that so you can choose which parts of Azure DevOps you want to use and assemble them with other solutions so for example if you wanted to use Azure boards to do your planning and github to store your source control and do your pull requests but use Azure pipelines for your CIS CD and take the artifacts that were produced and put them in artifactory and then use ansible to deploy them to AWS or Google great you can do that you want to mix and match you know however you want if you want to use Azure artifacts instead of artifactory and jenkins instead of Azure pipelines it's up to you you can assemble these solutions in whatever form make sense to you now this is really an evolution and in a broadening of the azure ecosystem so Azure DevOps now provide a juror with a new set of services to help developers make their lives better we're really making a charade developer first cloud as ur already has very broad support you know there are hundreds of tools and technologies many of them open source that are part of that the azure ecosystem from terraform to Jenkins to chef to puppet you name it and Azure itself has a whole set of first-class services that are really important to the DevOps lifecycle one category of those is really focused on telemetry analytics and insights you know when Donovan talked about what DevOps means to him and the definition of it it's really clear that DevOps does not stop with deployment you have to get telemetry in your application you have to know whether that application is performing well how folks are using it you know in this day and age data is becoming a core part of how we build software and asher has a whole set of services that help you do that from Azure monitor application insights and log analytics they provide predefined defaults so that you know what the thresholds are you should be expecting from a high-performing applications it helps you visualize all of this data it's coming in and customizable dashboards and it has infrastructure to help you separate the signal from the noise because as we move into this more data-driven world there's so much data coming in it can often be hard to really tell what the important signals are from all of the different noise and of course all of these services are highly extensible and work with existing processes and tools like ServiceNow and this includes of course as your DevOps so one of the really powerful things that you can do is take all of this telemetry insights and tie it in to the actual workflow processes and in terms of how you work and Donovan is here to give us a walkthrough of how you can do that Donovan thanks Jamie like you said going back to the definition of DevOps we want to continuously deliver value you can't just randomly copy files to a server and assume that you delivered value if no one uses them you didn't the only way that you know is that you monitored the application and here inside of azure we have an amazing offering that allows you to monitor not only the application itself but the infrastructure upon which it is actually running I can make sure that my infrastructure is secure see if there's any patches that need to be run I can see my application health and I can configure all of that using application insights in addition to that application insights ties in really well inside of Azure DevOps and Azure pipelines here I can go to our dashboard that I've created this is the actual application insights container or all the data from an ojs application that I've written is actually being pumped in I'm able to see if I've had any failed requests luckily I have not I'm able to see what my server response time is if that starts to go up or down I can go back in and make adjustments to my code ship out a new version and come back in and check these numbers to make sure that they're looking good I also have availability tests running it's been rock-solid since I deployed this I've had a hundred percent success rate if for any reason one of my applications is unaccessible I will actually get a notification saying I can no longer reach your particular application and I can actually test from several different locations so it'll test from all the different regions that we have available for you from Azure to make sure that your app is accessible from everywhere and if not I'm able to go back in and make it a fix for that what I really like about this is that I can actually incorporate this information back into Azure pipeline so what I mean by that is earlier I talked about how we use safe deployment how we deploy our application into a production environment and we monitor it there well that monitoring historically has been manual people would go and run queries against our work items to see if any new bugs had been logged someone would go and look at a dashboard like the one I just showed you to see if there's any spikes in our traffic or increase in the number of we have but we want to automate everything that we possibly can and thanks to release management I can do just that I can come here and enable something called a release gate a release gate is an automated way for me to take those tasks that I used to do manually and verify them as I move through my pipeline for her to add a node new gate here you'll see there's several different types I can run an arbitrary function so this is an Asscher function that can go off and do whatever it needs to do and then send back either a positive or negative response letting me know that things are good or not I can call a REST API maybe I'm deploying a API myself and I want to be able to call a few of those api's beyond just normal testing but specific API so let me know the health of my particular system and this one I like a lot is I can actually query application insights that I just showed you directly from Azure pipelines and make sure that our we have my really healthy deployment and that everything is going as it's supposed to go and if and only if it is move on to the next environment I'll show you how to configure one of those in just a moment and also we have the querying the work items this is the ability for us to go back in and run queries and see have there been any new bugs logs or new issues logged against our software while it's being deployed and if so you probably want to stop our release and go look at it right go ahead and click over here on Azure monitor I just have to configure a few things it's going to ask me for my Azure subscription because this is where my application insights lives this is where the delet telemetry is being collected and it allows me to then find the exact application which I want to monitor so I'll pick my Azure account here inside of my Azure account obviously have resource groups the resource group I'm looking at that has my kubernetes cluster in it and also my application insights is expressed now I want to look at application insights information one more time I'm going to tell the exact resource that I'm looking at because I can actually have a different application insights container for every environment I don't want all my telemetry going into the same place I want to be able to know how my production environments doing but might be different than my QA environment and or my development environment as I go between one gate and another I can go and review the previous environments gates right here using application insights then I'll choose a particular alert and if I have any failure anomalies during the deployment of my code release Menace what we'll be able to protect me and stop my release and give me a signal letting me know that I need to go back in and investigate that this is a potential bug that would have been able to escape into the next environment had I not had an automated way for me to be able to monitor that information so we're taking the monitoring and we're automating that was the review of that monitoring for you the final thing is having that single pane of glass it's great to have those really rich dashboards in Azure but I want to be able to bring the data that's being collected by application insights directly inside of Azure DevOps and I'm doing that here with a dashboard that I've been able to create as you can see I have tiles here from my dev environment my QA environment and my production environment I can see how many events have been triggered I can see what my response time is and down below I can see my team members the health of my build and the health of my release this again is taking all the power and the data that we need to make a good decision and have a really high functioning piece of software and we're surfacing it here right here in Azure DevOps on a single pane of glass that we can use so again I hope you realize any language any platform and everything that you need to turn an idea into a working piece of software thanks Jaime thanks Donovan so to pull all of this back together aser now has five new services that are going to help you as developers to be more successful to collaborate to ship faster with higher quality they work for any platform any cloud any operating system you can use all of them together or you can use them individually it's all up to you they embrace open source as your pipelines has free open source for any project that once it they work for projects of all shape and size from the smallest up to the largest and it's really easy to get started if you want to get started you can go to as recom slash DevOps and Donovan I think that's about it did I miss anything actually I have a few questions because I'm gonna go on tour here soon and I'm gonna speak bombarded with questions now you said it's free for small teams but what if I'm not a small team how do I pay for this yeah so for Azure pipelines you know if you're an individual doing private build you get 800 3 minutes if you'd like to grow up from that you buy units of paralyzation you know you can run more jobs at a time each one cost $40 ok so if you buy a 10 new jobs you can buy it run 10 jobs at the same time $40 each gosh yeah most of the other services you buy per user for about $6 you can go to the pricing page on our website and get more details great so obviously we've been using V STS for a long time looks like the URLs are changing like what is my experience gonna be as a current V STS user moving over to Azure DevOps yeah this is gonna be a good thing for existing users the transition is going to be seamless and automatic the existing customers will get to decide when they make that transition so they can decide when the right time to go do it for them is okay if you're using all of the capabilities of VST s all these as your DevOps services like you showed work great together they're not going to lose anything they're just going to get more choice so if they want to set up a project and only use it for planning and only have as your boards on it for example they'll have a much cleaner and better experience for doing that sure yeah cuz I've noticed that I've done that on a couple I maintain a couple open source projects and all I needed were pipelines and it was really nice to be able to streamline my experience right I mean I and as the team gets bigger and as we grow I think I'm gonna start turning back on some of those other things but for now is really neat to be able to just streamline it and just let's just focus on what it is that we want to work on which is great but now we talked about bsts but I always say that there's a twin the bsts called TFS does how does that transition work yeah so TFS is now as your DevOps server okay it's still the vehicle that we use to deliver all the value we provide in the cloud one premise the way that we ship it and update it and the way you use it will continue to be the same we'll continue to update it on the same cadence that been doing forever so it'll be again a nice seamless transition for EFS users as well right so that next quarterly update I get it'll just gonna magically change its name from one to the other next major the next update of TFS will be the azure DevOps server gotcha awesome okay so the last thing I want to talk about is just how do we get started if I'm not an existing customer I'm brand new I've seen this I'm excited I see the value of cross-platform any language any platform in one tool chain how would I go and get started there's a couple ways you know one if you want to use as your pipeline and your github user you can go to the github marketplace like we looked at earlier sure otherwise I suggest you go to Azure calm slash DevOps pick the service that you want to get started with and go from there awesome well I thank everyone for joining us but be sure and join us also on September 17th we're gonna have a live stream and a Q&A where you can ask some more questions and interact with those of us who helped develop this amazing product and can answer your questions and and make you productive on your DevOps transformation thank you so much for joining us thank you you

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...