Hello World: Let's get Started with GitHub

[Music] hello world welcome i'm frank boucher and today i want to talk about github and i was talking with one of my friend recently and he was telling me frank there's so much stuff that just came out because we did the how do you call like you know what let's introduce him sam sebastian how are you hey frank great seeing you again man uh github universe that's what you were talking about we had github universe a couple of months ago and we announced a ton of great stuff um so we're super excited to be here uh share some of that uh great stuff that we've been shipping to all of our developers around the world uh but just uh yeah uh name is sebastiano calve or seb and essentially i'm here representing github i've been in the company for about a year and my role is just to make sure that github and microsoft are playing well together we have a unified message for our customers excellent and i know you didn't come alone today so who did you bring with you that's right so because i'm the least technical person and i need some help i brought damien with me so demons gonna be joining me hi how are you i know that guy yeah yeah we know each other way back so uh damien you have multiple demo today so do you want to make a little tour so people know what they should expect from today's demo sure yeah yeah so we're going to kind of go from start to finish we're going to talk about planning our work in github and we're going to talk about like doing the work cutting code and things in code spaces and then we're going to build and deploy using github actions so those four demos are going to be issues and projects code spaces and then a couple of actions one so actions and some of the newer features of actions in that second demo yeah that's look awesome and you know what i i've i've been less coding for the past few [Music] two three months i was looking my uh my comment chart recently and i was like oh that was that was quiet i was busy on something else but i used to do a lot of uh get up and you know what during all those demos we pre-record the demo so like we know everything is smooth i learned something new so if you're user of github you may learn too something and if you have questions this is a live show so there's a chat answer and i ask you a question not answer your question that would be very strange but uh ask your questions and the three of us will make sure we'll answer and we'll probably also answer it on camera but during the the show we can we will be also in the chat and if you're watching on the man well write it in the comment section and my favorite thing is reaching out again to uh my guests and telling them hey you know what you have a question please go there and make sure so any all along for the next hour at any moment if you have a question github related because today the topic is github ask it and uh well we'll make sure to uh to make the question find you back i think i'm ready are you ready guys let's let's start right away so uh damien this first demo like first before before like i know you and you're famous already like i mentioned that before but maybe someone doesn't know who's damien you wanna introduce brief yourself what do you do at github or yeah so we know each other because we were on the developer relations team at microsoft and i moved across to github so i do deborah at github which lately because of travel restrictions means i don't fly a lot anymore but a lot of videos live streams um and all that kind of stuff as well so really i get to learn all the cool github stuff that's being released and get to show it off which is um yeah which is really good really exciting stuff and in the next segment that demo we are doing this is not you presenting right no no so we were lucky enough so my colleague rozelle um is based in new york but she's actually on vacation already but she recorded she pre-recorded this demo um and she's going to be looking at um kind of managing your project and planning your project um something that you'd traditionally do maybe using other tools but one of the newer things with that with github is is github issues and the project management has kind of started from scratch so yeah she's gonna show off some of that wonderful so let's have a look so result i heard a lot of good things about issues about in during the github universe so can you tell me more yeah we have a lot of exciting stuff i want to show you about um the new task list um our new project board and also our new issue templating so first i'll start off with like how task lists can help you to create even more issues um so let's say you have a you have a open source project or you're just working on a project and someone says okay we need to do this we need to like redesign the website and you want to create a task list obviously by clicking this you'll you can create a crap tax list but i also have some pre rom written tasks so let's say i want to implement dark mode use k1css and change the typography if i submit a new issue obviously what we're used to is seeing these like check boxes here but now when you hover over them to the right you'll see this little circle what you can do that's really cool is you can convert these to issues so once i convert these issues and you go into that issue you're allowed to like edit it and give a little bit more context into that issue you can also see that um this issue is connected to the one that it was mentioned in earlier so if i click tracked in number four we'll see that this is um it was mentioned here and created in testless that way you'll be able to figure out like why was this created what's what's the history here of this issue of that yeah me too so you could create a nitpick with different tasks or like if some part of the task is not yet done you could like push it to the next print by creating like a sub task or something like that that's pretty cool like that that's definitely useful me too i think it's awesome um and the other thing i want to show you is our issue templates um so people may already be familiar with these and what i'm going to do right now before i go forward is delete this file so i can just show you how it works so what people are already familiar with um is our regular issue templates and refresh one more time okay um but our regular issue templates which are written in markdown um and in markdown basically the issue we have here is anyone can you can't really require certain fields to be submitted and anyone can just say they don't want to answer this and move on or they may miss the fact that you wanted them to answer it so what i'm going to do is create a different type of template that has like required fields for um the user to answer or for the the contributor to answer oh i love that yeah thank you i want to make sure this gets deleted though so that i can recreate it oh i didn't commit it hold on a second changes okay cool so i'm going to create a new bug report um and the way that this works or a good new bug report issue template the way that this is going to work is you have to write it in yaml if you're not too familiar with yaml yet or you're not sure you'll get the indentation right in github's documentation we actually have an example um right here in this tab to get started to get started exactly like you can go ahead and edit it how you want but i'm gonna copy the the code here and then i'm gonna go ahead and paste it in and i'm going to name this bug report.yaml and as we can see um you can specify a couple of things in the ammo where you can specify like the type of labels that you want to be on it you can specify what type of fields you want it to be whether it's markdown whether it's a text area a drop down or a check box okay so that yaml file is really different it's a definition of a form where i will enforce some type of interactivity saying okay this field is required here you need to specify through a list that your your drop down like the version of whatever you're using and stuff like that so like people know what to what what i'm expecting from them exactly um exactly that way you you have like a standardization of how what type of issues you want to come in that way people are not just like this is broken now you can ensure that you're getting the details of what is broken and like what they think happened and what they would prefer so now that i've committed that new issue template if a person comes in and they create a new issue and they say i want to file a bug report what they'll see now is these fields right very cool um and the fields either have a text area and right here as you can see with that red asterisk it's saying this is required like you can't submit the issue it's like grayed out because you don't have all um checked off all of the required fields and as you can see here is the check box as well so it just it just makes sure that like the issues that are coming in are standardized you can work with them and it's more clear to the person that's submitting the issues yeah way more productive because then like you can start working right away like no information is missing exactly and the last thing i want to show you is the new project board that we have so everyone should probably be familiar with our previous project board where you can it's just a kanban style to do in progress or done now if you go to your profile and you'll see that you have the option to do the beta new project or the regular new project i'm gonna pick the beta one so you guys so you can see what it looks like um and here you're met with like this little table and you can add specific issues from your repository so i know we just made one in the repo that i had called deploy with actions um and one of the issues we had was like use tailwind css um which is really cool right like i can put redesign website and all that in here you can choose the assignees i'm the only one in this you can choose the status if it's in progress or not and you can actually add custom fields um you can say like maybe the date it's due and change it to a date field um it's very cool you can even like group it or sort it by the status um or group it by the status as well so it's it allows for a lot of plex flexibility um and i think it's it's going to be a really big game changer i know a lot of people use github um to do pull requests but they're using different platforms for issues i think now you can do it all in one right here yeah i love it and i definitely go i will go change a few uh version using the the latest beta to try that because i'm a big user of all those things well thank you and now let's go join the chat to see their questions okay that was cool yeah i would say as the least technical person this is the one feature that gets me the most excited just to be able to plan it's almost like a to-do list but yeah super challenging like like i mentioned in the the demo i was i really do or used to do live coding session and like that thing the form and everything will will be really fantastic i have a question based on that like i notice in their title it was like between square bracket it was bug is do i need like what what's the purpose of that um i i think really that was just uh the kind of placeholder thing so it's a good way to kind of easily identify when you could just see the title um that you know this this one is a bug the other thing obviously is labels in the template format that you can use or not the template but the issue form format you can specify what labels it has what the default values for fields are and then the title so the docs and i'll paste the link in the chat as well but the example that they have there has that bug colon in the um title and it just means you have a starting point you have something to to start with like links will probably don't works in the chat okay for security purposes but we'll make sure to put that in the show notes so like the show notes ryan you should uh display the show note links like now ryan is packing clicking a bunch of buttons so all the links we'll be sharing today will be in that that page over there or probably just down below that video depending on where you're watching and uh yeah okay so definitely it so i thought was maybe that's how you define a template like using the square bracket but that's not it it was just placeholder yeah yeah it is it's something that a lot of people use though so that's why i do now in our example um the other thing that we tend to use at github a bit um at least in our team is we use emojis like we use uh you get full you know tech support um so we tend to use like an actual little bug at the side of our bugs um just to make it a little bit easier you can do that in the labels as well so you can have the label the bug label having a little bug in there as well um yeah a little bit makes it a little bit more fun i see a question i don't know if you want to answer it right now or wait for a later segment but we have is it possible to add approval flow when you create a project a project so i think an approval flow from the manager to work on a bug or task or release um not really i don't think so the um the general idea with with issues is if you have permission to to look at the issues and the boards and so on then you can self-assign you can do that kind of work i'm just thinking about ways that you might be able to to do this you could probably change permissions for those boards and then only allow certain people to to put assignees in potentially um i don't know the details of that um you could probably do something like that if you really wanted to uh the the way that issues and boards and things have been developed is trying to make it free to to do the work the way that your your organization works so we're not telling you hey everybody should use scrum or this agile framework where putting the tools in place and then you you operate the way that you want so i imagine you could probably work around something like that with permissions but i don't know off the top of my head that one specifically yeah good and any uh quick question sam we have yeah i mean yeah rizzo show the new board which is really cool um but i don't know if i got to see um so there's a question like can you can you change that how you view that board and what are the different types of views that you get right can you customize that view yeah yeah so the the funny thing with the speaking to the team is any the competitor for any software project is a spreadsheet right um there's companies that run on on spreadsheets um so there's the table view that you that we saw and then there's a board view those are the two views that are available to you at the moment but you can filter you can group by fields you can put your own custom columns and group and filter by those just in this last week a new feature has come out where you can choose the column that your boards are used by so any single select or iteration field and iteration is a relatively new custom field as well so there's active development going yeah this huge huge customization ability and there will be more coming not really anything i can talk about right now but there are more views on their way okay interesting you know what that's well we'll have time like so in the chat ask question maybe we'll know more are you at this kind of guy or are you a boards kind of guy yeah yeah i'm a board guy yeah i like boards i i use that too in my streams no like they weren't yeah i use boards in my stream i'm a big fan of gig kraken but you know like it's get up connected and everything so it was all there anyway uh let's transition to the next segment uh damian can you tell us a little bit more about this this next demo coming up yeah so let's imagine we've moved on we've done all of our planning and it's time to actually pick up and do the work um code spaces is one of those things that really kind of changes the game when it comes to developer productivity like the inner loop getting new people working on code and all of that kind of stuff it's it's really really exciting i did a bunch of stuff with github universe with code spaces but um in this next one roselle's going to show this as well she's going to just walk through really quickly using code spaces to cut the code wonderful so let's watch that and we'll come back with more live questions so i do a lot of code with the community and sometimes i need to jump on a repo or they need they want to help me and start working on an issue but they don't know like they don't want to install everything locally and i heard codespace could really help us and you also told me you have a great demo about it i do yes so i would be happy to show you and i completely understand how you feel sometimes i'm demotivated when it's like oh i have to switch and set up my environment just to see this one problem that someone's having so here we are in my repo um called deploy what actions and if you click the green button that says code on it you may be used to like showing how you can set it up locally with github cli or git clone or whatever but now you have a new tab that says code spaces um and what you can do is you can go ahead and click create new code space i already have it opened in another tab um just because it takes a little bit more time so i'm just going to go ahead go ahead and switch over to that tab so the cool thing about code spaces is it's not a lot to set up it looks very similar to visual studio code which most people may be familiar with um here you can do live sharing like you may be used to um you can have get lens you could also install extensions like github copilot and all the other works um but what i really wanted to show you is that you can have your environment um up and running um you can see like your local page right away well local within the browser so what i'm gonna do is run npm run start and once i do that it should start up a new page for me and as we can see it says hello world it's result um what i can go ahead and do is if i wanted to change this to pink this is just a react app if anyone's curious um when we refresh we should see it update to pink it's a little bit bad for the eyes so maybe i'll change it to black um but for me that's code spaces it's very cool where you can go ahead and edit in real time and just refresh the page you can add nodemon now you don't really have to like install of all those new dependencies and figure out what's missing and what's going where um you can just edit straight from your browser and i find it like very convenient and i get my work done much quicker or i get it started much quicker because i'm not dreading the whole setup um beforehand so as a repo owner i can define that dev environment so they like when they spawn like a new instance everything that they need is is there ready and they just like f5 it like you know start debugging or whatever uh so it runs and they they could start helping me or visualizing like the app that is in that repo that's very very useful and like you said like it's just like uh vs code so it's a tool that is very popular that a lot of people already know so feel like home wonderful exactly thank you and now let's let's go see what the the chat has four questions yes awesome awesome demo small boat super powerful um so we've got a question and i'll start with the basic one which how can i turn on code spaces yeah so uh if you uh the docs should show you what plans code spaces are available for um but if you go to your organization settings um which you can do by going to you know github.com whatever your org is and then in the menu at the top going to settings and scroll down to code spaces you can turn code spaces on for everybody in your repository turn it off or turn it on for specific people so you can just say these people have access to code spaces if you want to as well so you can restrict it that way you will need a billing plan and a way to actually pay for code spaces um because everything runs in vms on the cloud it's not free so um yeah you'll need to do that but you can turn it on through settings what what would you say is like why code space is such a game changer you think yeah so i mean the story i always go to is like the first developer job that i got outside like after university um which was for a government department which may or may not affect the story um but it took about a week before i got a machine that i could do any work on and then it took another couple of weeks before i could actually cut any code because there's always that stage at the start of a project where you have to set up the dependencies and the libraries that are being used and the correct versions of everything and then get your ide set up and all that kind of stuff the big story with codespaces is all of that stuff is kind of lives in the repository and is on the cloud so our hero story is github github which is what we call github.com github github so the repository that builds github.com yeah a lot of github words in there um we can go from scratch brand new code space ready to code in about 10 seconds now with code spaces so we actually use code spaces to to write github.com um which means for a new developer or somebody jumping onto a new project you know you're productive immediately there's none of this installing the right versions of node and net and whatever else you need um yeah it dramatically speeds up productivity that's cool i like that i like that uh uh there i see a question uh in the chat and and i wanna change it a little bit so um is codespace available like can we use codespace for free with some limitation or like is it always paid or like how does that work yeah codespaces itself is always paid um but codespaces is built on a lot of technology that you can take advantage of now so one of the extensions that you can install for visual studio code and you can do that for visual studio code in your own machine right now is it's changed its name a couple of times it's the i think it's the github repositories extension and what that allows you to do is connect to a repository remotely and so you don't have to clone locally on your machine what that doesn't give you though is you know local debug and things like that so that's kind of part of the way um you get that same behavior as well by the way in github if you press the dot key so i don't know whether you've tried that um i thought it was a little bit gimmicky when i first started but any repository visit any repository and hit the dot or period or full stop key on your keyboard and it will open github.dev which is a web-based version of vs code that you can legitimately do work on um it's just there's no server behind it so you can't compile or debug i use it all the time like i thought it was a gimmick but honestly i reckon about 75 of the time i'm changing code i'm just doing it with that because it's so fast yeah there's tons of times where you don't need a full ide and you just want to edit a couple of lines of code and recompile it or that's that's kind of the benefits but for code spaces it is available right now for for teams and enterprise for the full code spaces with the server name okay now what i would i use the dev uh environment or like or the online editor what i like about that one is when i need to edit or compare quickly different files in different folder using the web interface and like go up go up go up and now i have the full kind of three view of the files the folder structure and now i can navigate like faster not that i use that a lot for this and then like trivial update yes like you know a yaml file we'll talk about that very soon but yeah you know those things that doesn't require like a compiling or something like that exactly the other thing that the web editor is really good for by the way um is reviewing pool requests so if you go to an actual pr like a pull request in github and press dot then you get the web editor but you get it in the context of reviewing that pull request so you immediately see the diff like the changes for the files watched files are changed and you're given a web a window to leave your comments and approve and those kinds of things so in the context of the whole project in the like in vs code that you're used to yeah okay so we have a question and i think it's a really good question from uh gossel so like i want to know the difference because we talked a little bit about the two so what's the difference between like the full-fledged code space and the dot editor the online editor so like clearly like one what's the difference between those two yeah the big difference is the server so pressing dot ultimately just takes you to github.dev slash whatever the the repository is and there's no server behind that all of that is running in your browser um it uses the remote repository extensions to kind of do do that a lot of that work but if you hit f5 it's not going to work or if you go to the terminal that's not going to work there's no server behind the scenes what it means in practice is you you can't debug um you can't run run npm or anything like that but you can install some extensions so you still get things like syntax highlighting um linting in some cases uh your any other extension that can run entirely in the front end you can get that as well code spaces though is basically vs code running on a hosted vm so you get you get the power behind it you get the machine behind it so you can debug you have a terminal you have root access by default as well to that vm so you can do anything you want in that environment yeah and in result demo she was using like i forgot there was a javascript framework so like it was very simple but it could have been like a net one so compile it and run and i don't have the code locally it just create a vm or container whatever something on the server side and it runs there so that's the full-fledged version of codespace that's right yeah it's basically just like a machine that you can access in the cloud that's fit for purpose it's specifically for that repository ready to go for that project and you can choose the size of the machine as well by the way you can choose how many how much memory what's the cpu so if you have really beefy environments and you want something more beefy you can actually do that oh excellent so the time is flooding so quickly when i'm sharing that does people start with like my environment or like with the recipe of that environment and then there will be another instance yeah so out of the box if you just start a code space in a in just an environment that hasn't had code spaces configured you get what we kind of nicknamed the kitchen sink repository kitchen sync image and it has tools for net and python and you know javascript and all of those kinds of things but you can set up a dev container that specifies anything you want and a docker image that contains anything you want so you have pretty much full control over what what environment you're going to be in but out of the box you get a lot of tools that can can work with you know net and node and python and all sorts of stuff if you start one you'll see there's a link to the specs of the machine and the environment wonderful so we should i see the time is flying so let's start let's move on to the next segment and now we're going to so we we did the project management we start working so what's next damian yeah so next you know we've written all this great code we want to actually put it somewhere so we're going to look really briefly at ci so continuous integration but mainly we're going to look at deployment so github actions is really good for all of this stuff but deployment it's it's actually quite powerful to do that as well so i thought we'd start and look at deploying to multiple environments perfect so you know while we're watching that video if you have any questions leave it in the chat and we'll get back to you just after this so damian what resell we saw that we had we can manage your project we can code but i know there's a way to make some automation so can you tell me more about that yeah absolutely so the the next thing we normally talk about is like how do we get that code into production how do we build it make sure it compiles do all of that great stuff with pull requests and all that kind of thing and github actions is your answer there um now most people kind of know that github actions is a great way to build like do continuous integration and build your application run your tests but there's a little bit less understanding that it's also good for deployment so what i thought i'd show you is a deployment process or a couple of ways you can do some deployments through environments in a safe way using some of the features in github actions so yeah so i'm actually going to switch projects because i'm a bit more familiar with this one rather than the one that resale is using so this is just a basic.net web application uh it looks like this it's um an asp.net core with a little bit of ascii art going on um that's not so important yeah do you like the little.net guy and and mona of course the github logo perfect uh github mascot so um i'm gonna make a little change and we're gonna talk about um what i'm actually doing it's a really simple just i'm just gonna change that background color so i'm going to use the web editor which means i can just hit the dot and it will open a web editor for me um it's kind of like a serverless code space there's no server sitting behind it it's just a really nice way of editing so i'm basically in vs code i'm going to change this background to let's see if we can just get a rough.net purple there we go um in that cli example and then my change i'm just going to undo that change don't need that one um my change is just going to be this change to purple so i'm going to commit this change and because i'm working kind of on the server already it i don't need to do a push i'm not cloning this locally nothing's on my local machine i'm just using this kind of feature of github so let's go back to that repository and we'll go to actions and i want to talk about some of the actions we've got going so the ci1 is the one that you'll see straight away so this is our ci build now i'm actually doing a couple of funky things here i don't want to talk about this one too much it's not that interesting this is just your compile what i'm actually doing is doing a matrix compile so i'm building it across ubuntu windows and mac on hosted agents in parallel across multiple versions of.net so this is just a bit of a fancy way of doing a continuous integration so i know that it compiles and my tests run um so i'll end up with you know an artifact a thing that i can deploy um i know that my change has worked that one's not the interesting one though so i'm going to move on to publishing we're going to talk about actually deploying this out to production so what i could do here and it's a great way of working is when my change gets pushed to my main branch i would do this build and then i'll deploy to a test environment and then i'll deploy to production for example what i've done here is actually used a workflow dispatch event so this is a manual trigger and the main reason is just to kind of make it easier to show you these things working we'll have a look in our repository i'll just jump back to this web editor and you can see this publish yaml file now all of the builds let's collapse that all of the builds or the workflow definitions are defined in yaml in github actions so you can see i've given it a name there's a series of triggers so when i create a release in github it will trigger this this deployment to happen and i've also got a workflow dispatch so this is a manual trigger and i'm asking for an input which is am i going to go to staging or continue and go to production beyond that this is pretty um standard github action stuff i have a series of jobs these jobs are can run in parallel but in my case i'm going to do them in series so do staging first the first job is deploying to staging and i'm going to use environments now i'll talk about environments in just a sec because that's pretty important i'm even giving it a url so this is my staging environment i'm running this deployment on an ubuntu machine i'm checking out my code i'm setting up.net i'm building i'm publishing and then i'm using the uh azure web apps deploy action so the series of steps that you can use in github actions include a bunch of ones to deploy so in my case i'm using this one published by azure which will deploy a web app a couple of things to notice here i'm using some secrets here this is a syntax for for pulling some secrets out and the environment is going to change as a result i'm deploying to the slot the staging slot in this case as well when that staging deployment finishes i'm going to go to my production environment now this says explicitly that it needs staging to have run first and it's going to do the same steps the same set of steps i've basically just copied and pasted these it's using the same secret name and we'll talk about how we get that out in just a second but these are basically the steps we can jump back to actions and that's actually continued all the way through i think um actually no it hasn't we didn't we didn't kick that off i'm going to kick that off now let's do publish i'm going to run that workflow and i'm going to say this is going to go all the way to prod so we'll run that workflow and you we can see what happens as that fires off we'll just wait for it to refresh the ui and you can see there we go that's running so this is going to deploy the staging and it's going to hopefully update the background color to that nice purple in staging now what it's also going to do is it's going to stop before it gets to production and the way it's going to do that is by using those environments that i specified so if i go to settings for my repository up and top right scroll down to environments you can see i've got two environments set up the same names as was in the definition staging and prod if i go into prod you can see two interesting things one is environment protection rules i'm going to zoom in a tiny bit for that i'm basically saying i have to approve a deployment to this environment so it's going to stop and wait for me to say yes this looks good the other thing that's in here is we have these environment secrets so this same environment name exists for staging and for production and this is my web app publishing profile so i've basically just put that in here when i deployed a staging it will use that value when i deployed a production it'll use the value for the production environment and that's really all there is to it if we jump back to this action we should see it's sitting there with a little clock on there saying it's deployed to staging and we can click on that link and there we go it's purple so we've made that change in staging production is still blue we haven't changed that yet and i can review that deployment and say you know it looks good to me let's approve and deploy and it will run through those tasks those steps to deploy to production and then production will be updated as well so just in that really simple way by defining the environment and then the environment protections and then using any any steps any tasks any actions that you want to use you can kind of control those deployments through your environments really easily that's excellent and today you show us this using.net and employing an azure but there's many different combinations possible correct yeah yeah i i chose azure because i'm familiar with it and.net because i'm familiar with it but there's there's more than 10 000 actions available in the marketplace all sorts of languages all sorts of platforms you can build anything and deploy to anywhere wow amazing 10 000 it means so many questions so let's join the chat and see what we have thank you that's awesome what a great what a great demo um i'm gonna jump into it um when we think about automation in the devops space we usually think about ci cd mostly but i've seen actions used for many other things uh damien what other things can use with that with actions uh yeah so it's definitely good for ci cd um there's a huge list of triggers that can basically kick off a workflow run and they're not just you know pushing stuff to a repository or doing a pull request there's things like leaving comments on an issue you know working with apis as well so you can do manual runs and you can also do api driven runs you can do scheduled runs uh you can call workflows from other workflows so some of the things that that we've seen i know we do this a lot inside github we actually manage all of our permissions across various applications by leaving by making changes to a repository but there's also actions that we run when people leave comments on issues so i've run a demo for example a couple of times where people leave a uh hex color code in an issue comment and then it'll change my light to uh that one that my light to um that color so you can do all sorts of stuff and yeah uh you reminded me as well there's 11 000 actions now more than 11 000 in the marketplace so you know we haven't gained 10 since we recorded that but sorry i haven't gone into a thousand since we recorded that but um keeps growing it keeps you scrolling and now in the demo you didn't build for ci and then you did a build for staging and built for production is that redundant yeah yeah it is um so that was mainly for demo purposes just so i could click a button and kick it off rather than having to make a change and then and so on um what i would generally recommend is having that multi-stage kind of workflow uh which is what we did to you know staging in production but do a ci run and a build and then get that artifact and upload that artifact and then in your staging deployment pull down that artifact then when you go to production pull down the artifact again and deploy it that way you're deploying the same compile code to staging as you are to production that's my preference um i like doing it like that because you know you're deploying the exact same bits um but a lot of people will do it by branch or they'll do it a different way um yeah so i mean there's a lot of different ways to do it i would probably not in real life do it the way i did in that demo but um yeah demo code yeah demo is not real life and now we need to to move on to the next segment and it's uh diego's wall so always happy to uh to have diego on the show and like today my question is do you know what having in common or can you make the connection between comics mona lisa and i t let's watch the video and learn what it is hello diego how are you hello frank and hello world i'm doing good i'm diego as you know i'm here in my office in seattle i surrounded by these walls and as you know frank i use them to nurture my sense of wonder but i also use it to share it with others with you today what we have for us today today oh today we have a funny story frank funny story the question today is what is the most famous painting in the world what would you say if i asked you the most famous painting in the world the jokom the jokon the mona lisa yes by leonardo da vinci who was by the way a great man i highly recommend people to read his biography not just in any format but in graphic novel format i actually been reading i want to recommend this i've been reading this campfire heroes series and they have these biographies you know gandhi real life heroes mother teresa abraham lincoln nelson mandela even the beatles the beatles right here my favorite band and they actually it's illustrated for kids but also for adults now no why is it the most famous painting is it because the smile is special like many people say that sometimes he's smiling sometimes he's not smiling is it because the way it looks you know the symmetry of the face i heard it all no those are not the reasons i want to share with you that the reason why the mona lisa is the most famous painting in the world is because of this paper that i have right here it's a newspaper from 1911 and it shows two people stealing the painting so if you can put frank the picture on the screen so we can see it better that is actually a newspaper from 1911. turns out that in 1911 there was a gentleman called vicenzo perugia who wanted to steal a painting from the museum and he chose the mona lisa there was nothing special about it of course it's a great work of art but by by davinci but it wasn't as special as it is today so just like in the movies vichenzo stay he hid in the closet straight up till night when the museum was closed got out of the closet and took the painting and he started to run with painting under his jacket and it was funny because when he tried to open the door of the museum to get out the doorknob actually fell off and a plumber happens to be walking by outside and he called the plumber and the plumber actually let him out the mona lisa was missing for two years and it became like the news of the moment here's another piece of newspaper from paris and what happened is like back then there was no internet so this picture became the it became the most printed piece of art in history so now everybody in the world knew about this painting you know and that's why when it was recovered two years later it became a sensation and to this day the louisville museum takes 10 million visitors a lot of them drawn by the mona lisa i went myself a few years ago and i couldn't really enjoy the painting because i there was a crowd you're gonna you have to look at it from the very far you know but what i want to say is that sometimes there's more than meets the eye it's okay to take reality at face value most of the time but it's very important that we question why things are the way they are especially in the tech industry when we research how people use our products you know everything we think the way it is it's not like that for example we think that dni diversity and inclusion in the tech industry is a problem because there are not enough candidates to hire from diverse from under represented minorities that's not the case there it goes much more deeper than that or there are people who now don't want to get the code vaccine because they're afraid of the side effect that's not the reason why they don't want to get the vaccine there are more it goes deeper than that a great example is yummy food frank for example i love bacon and i love chocolate and ice cream do you like those yeah i like those too any kind of ice cream to be honest i see those actually there's nothing yummy about those food like they there's nothing inherently yummy about bacon because to a rabbit the bacon is not yummy to a rabbit for example chocolate ice cream is not yummy because he needs different nutrients we humans need this nutrients so for us is yummy so we don't like this food because it's yummy the food is yummy because we like it all of these and more can be summarized in a field called behavioral economics and i want to recommend you the podcast free economics radio all the freakonomics books they give you an idea how there's more than meets the eye on the way things are and i lived most of my life frank in a very naive way taking the world the reality at face value and i learned in these two new years at microsoft that there is always more than meets the eye there is a hidden story to things and we gotta exercise curiosity to actually understand and then be able to build the best products that we can that that is gonna empower the people across the planet so frank that's what i have for you today but i have more for you next time see you next time bye always so funny i didn't know why manager was uh stolen for two years yeah i know excuse me i knew i had no idea either so i see the time flying and i want to make sure after this last demo we have time so briefly damian what's this demo is about yeah so we're going to take that action that we have and we're going to kind of reduce the repetitiveness so you might have seen it's a lot of kind of copy to paste coded copied and paste code so we're going to try and fix that excellent so let's run the demo so damian in a previous video you show us in a previous demo you show us like how to ci cd and deploy to a to our environment different environment but i noticed that there was like a lot of copy paste in your uh yaml file so and i know you know copy paste is not the best thing so is there a way we could improve that yeah definitely um there's a few ways that you can reduce copy and paste so i mean this is all demo code obviously so i'm not doing things exactly the way i i would want to do them um one thing that yeah you picked up on was the fact that i'm duplicating that for each of the deployments i'm um i'm building my application i'm packaging it up and then i'm deploying it to azure when really all of those steps could be in one group of of steps so the couple of options available to me there's i could write my own action so my own composite action and that lets me you know build a few different steps together so i can reuse them a little bit later but there's a new feature that's come out very recently called reusable workflows um and i thought i'd show you that as an example of kind of reducing this this yeah it looked way simpler than uh coding my own action yeah yeah and i mean the composite actions are relatively straightforward and quite similar but the reusable workflows mean that you can you can actually just call them from other workflows in a much nicer way rather than having to use you know this specific action that i've that i've made somewhere it's just another another thing in your repository that you can call into so um yeah i'll jump into this i'm going to come back to this is the publish yaml file that i showed before and just to highlight the repetitiveness here i've got um some unique things so the name of my um name of my job and the environment that it's deploying to but beyond that it's pretty much the same i'm choosing that runs on there here my steps the steps are all the same the only thing that's really different is that url here the secret is going to be different and then the slot name is going to be different as well so there's only a couple of things that are different and i'm repeating them over here as well for production so what i'm going to do is i'm going to actually create or i've already created a reusable version of this so this is a little bit different and i'm going to highlight a couple of them we saw last time that there were two ways of of uh triggering this release and we're going to use those same two ways here so when we publish a new release in github we can we'll fire off this workflow and then workflow dispatch so we're going to do the same thing here but my steps are all my jobs are much simpler there's my staging job which uses this published azure reusable workflow passing in a few variables so a few inputs and then some secrets as well so my my secret for that um for that environment and then i'm gonna do the same thing in production i'm passing in the same details but just for prod so you can see already that's a little bit shorter if i was going to do another environment like you know pre-prod or something like that then i just need to reproduce this rather than all of those steps and and to use where you call that other flow like it needs to be an absolute path yeah it does at the moment um so it's also um qualified by a ref so i get ref basically so i can choose the branch or a specific commit or a version for example um so basically i'm saying here is the path to the thing that i'm using use the one that's this version or the one that's in this branch for example oh that's cool so so this is the caller so this is the one that's calling that reusable workflow let's have a look at the workflow itself because that's a little bit different too so let's look at the uh callee like the workflow that i'm actually calling so this is the publish to azure workflow and the first thing you'll notice is that the triggers are much more comprehensive you know there's a lot more in here our trigger is just a workflow call and what that's saying is um this workflow can be called from another workflow and then i get to define my inputs so we get a lot of control here we can define the type of the input whether it's required or not default values and description and so on um this just gives you a bit more information when you're calling it um so we're asking for the environment we're deploying to the url that's going to deploy to the name of the slot and by default that's going to be staging and then we're also specifying that we want a secret called this and that's required and then our jobs we're just doing this once now so we're deploying to that environment defined by environments now if you remember in our last uh demo we had pulled the the secrets from that environment and we've set um you know the the process to to mean that i have to approve environments i have to approve a release to production for example so if this environment name comes through with production all of this takes effect so i get that environment protection for whatever environment name i pass in and i get the variable that i use further down for that environment as well so i can kind of pass these things through really nicely and then we just do it once we just do our deployment to that slot using that secret that we've got from that environment now it ultimately works pretty much the same way if we just jump back to our actions we can see um we've got our um workflows i'll just zoom out so you can see what it would normally look like we have our publish to azure action which hasn't really been run specifically because i can only call that from another workflow that's the only trigger i've got but publish reusable ultimately does exactly the same thing we can choose where it's going to go and the ui works exactly the same way it's just less repetitive and if i wanted to add another environment i can easily do that so exactly the same workflow just in a nicer way oh that's awesome so like if there's something that change in an environment or like you something change now you don't need to apply those changes everywhere just do it once and then like because of that structure that you created like everything will just fall into places that's cool so in my case i just have a staging and production environment but i could have a pull request environment for every pull request that comes out or you know a one for every branch and i just have to use that one reusable workflow and if that process changes for deploying then i only have to change in one spot love it love it thank you so much for that demo i'm sure we have a lot of questions so let's join the chat and see what they have oh my god i was having so much fun i asked in the chat like hey did you learn something i'm always curious when we do this show like does people learn something or is it something they all knew already so i asked in the chat and please answer in the comment or in the chat and i was very surprised by damian say yes i learned that when eliza was third yeah yep yep uh i didn't know that but i can totally relate to the uh standing behind a row of 15 people to look at the mona lisa uh it's much smaller than you think too yeah what do you think if we fall back on track so any question on on your sides about you uh yeah there is a question and by the way this is to frame it um this is one of the features that is super important in the enterprise space when you have a lot of enterprise developers to reduce reusability or reduce the amount of code right and so one of the questions that i have is can can i make sure that people in the organization use a specific reusable workflow kind of yes so at the moment you can't force people to use that workflow if they want to use um you know their own version of that uh then you can i think generally the the pattern we take at github is allowing people to to work the way that they want to work um what you can do though is you know encourage them to use it because it's the easiest way to do things so um that's generally the the process we take but yeah you can't you can't make people use that rather than the individual ones right how about sharing a reusable workflow yeah so that's the other side of it making it really easy to use those reusable work workflows uh is is really important too so there's two things that you need to be able to use a reusable workflow um either the workflow is in the same repository or it's in a public repository so in your organization you could have that workflow defined in a public repository and then any any other repo can use that in that workflow which is why we fully qualify you know where that where that definition comes from so yeah it makes it really easy to share across your repository that way awesome you know what the time is flying when we have a lot of fun and we are already at the end of the show i want to make sure i share so coming next oh i have a nico coming up next we have uh stay tuned to learn about foundation of data science for machine learning very interesting topic and i will be giving you a rendezvous for tomorrow for the last episode of l a word last episode of season two and of course all the links are in the description so any information to get you started are provided by damien and sebastien and rizelle so share a bunch of links while doing the recording so everybody have a nice day and i see you tomorrow bye [Music] you

Channel: Microsoft Developer

Views: 1,046

Keywords:

Id: 2NvwxgW0-Bs

Length: 59min 31sec (3571 seconds)

Published: Wed Dec 15 2021