Get Started with GitHub Copilot in VS Code

coding has changed in fascinating ways get some co-pilots GitHub co-pilot GitHub co-pilot GitHub co-pilot GitHub co-pilot co-pilot co-pilot co-pilot co-pilot co-pilot co-pilot co-pilot AI has arrived and co-pilot is all about it one way to describe it is right from its documentation GitHub co-pilot is an AI pair programmer that offers autocomplete style suggestions as you code but what does that even mean to say your AI pair programmer in short it helps you code quickly if you've ever pair a program you can get work done twice as fast and that's what co-pilot's goal is by offering autocomplete

style suggestions as you code but to really get a sense of what I'm saying you gotta see it so let's take a look before we can get started with copilot we need to have a GitHub account and if we don't have one all we need to do is just come to this page here and use your email to sign up with GitHub once you do that just hop on over to visual studio code under where the extension Mark in place is search for copilot and install extension after that's installed copilot will prompt you to sign

in to GitHub with the prompt such as what you see here and these are simple instructions to get set up if you need to reference it you'll know you have everything set up correctly and copilot is working when it starts giving you predictions as you start coding such as what you see here that's shaded in the gray and also what you see here also in Visual Studio code at the lower right hand corner there will be a copilot icon at the bottom before we get into any coding I want to show you something that's pretty

cool you can just ask copilot technical questions directly so let's say you're studying up for some technical interview you could ask in a comment with a cube followed by a colon let's think of a good interview question what does solid stand for in object oriented programming once I see a suggestion by copilot in Gray I just hit tab to accept it and there we go single responsibility principle open close principle lisco substitution principle Etc and now if I wanted to ask specifically about one of these answers here let's say I wanted more information on the

single responsibility principle it figures out that's what I'm about to ask and it is right a class should have one and only only one reason to change meaning that the class should have only one job beautiful let's ask one more and the hope and close principle was exactly what I was going to ask and there you go objects or entities should be open for extension but close for modification which is correct but now let's turn to coding and we'll start with an HTML example and see how copilot speeds up the experience so for example if

I just started off by specifying doctype and hit enter it already knows that HTML tag is going to be the next obvious tag to add and within that I can add my head and it immediately suggests a title right below that I'll close the head and sure enough body is suggested along with an H1 tag and paragraph So let's see how things look so far I'll open up my preview by clicking Show preview here which is using the live preview extension so on line seven we have one H1 tag but let's say we want to

have one we had some styling in it we could just say n H1 with inline styling and there you go I could also ask for a bulleted list create a bulleted list and boom as easy as that now Styles should be in a style sheet so I'm going to go ahead and remove this H1 tag here and use this items dot CSS that I already have which is going to remove the bullets from our list once it is referenced so if I go to the head and ask copilot reference the style sheet named items.css let's

see if it understands and sure enough it does and our bullets are gone and if we modify our H1 tag add blue H1 headings I tab over and there you go but now let's look for a more appealing example where we're trying to add bootstrap so in this HTML example here I I have some text that represents various types of alerts so I'm going to open up preview for this document here it's looking very plain but once we add bootstrap copilot should create a link to reference it and you can see the text format has

changed just a little bit and as I scroll down if I just go right above line 17 and start a div once I hit the space bar it can already figure out that most likely I want to add a class for a success alert which is correct so I'll go right below to line 18 and close that div and repeat the same thing right above line 20 and continue for the rest and there you have it within a few seconds fully styled using bootstrap if you've ever dealt with regex you know how confusing it could

be to interpret the patterns but with co-pilot by your side life could be a lot easier because you could ask copilot to write a particular pattern for you so for example if I wanted to regex to match the phone number and the format of that's exactly it area code plus seven digits separated by a hyphen if I hit enter it will give me a variable in this case call phone regex with that pattern so I'll select that and now I might want to test it though so I'm going to test the variable name which is

phone regex and sure enough it pre-populates it for me saying against the phone number and that's good so I will hit enter this solution almost looks good but I wanted to be able to be written to a console so let me add with console.log and when I hit enter there you go so now I can run this and if the test pass it will return a Boolean of true so when I run this it is true since all these are numbers in the correct format so why don't we add a letter in here and run

the test again and it should return false which it does I'm going to test one more time but this time I'm going to add four digits in the prefix and it should be false again perfect now let's chat about unit testing which can be a bit involved but copilot can assist here I have a calculator function that takes in a string and you could choose what operator you want whether it's addition subtraction Etc and it will return a value so why don't I ask copilot to test our calculator function and see what it returns so

it looks like it's going to console.log each of the operations addition subtraction multiplication division but what I want is to create actual test conditions so we can ask copilot to create unit tests for the calculator function and it's starting like with one approach but what I want is to use asserts I'll go ahead and set up a variable for assert and begin with my assert a statement and sure enough it knows to calculate the first condition and I'll add a statement that says calculator can add and now it knows that my Approach is to use

assert so it can go ahead and check every other condition such as subtraction multiplication and also division so imagine if you're using a really large application and there's a tedious amount of conditions to add you can get a good picture of how much time copilot can save you with unit tests let's turn our attention to SQL now I personally always had a hard time remembering SQL syntax so I was glad to see how co-pilot can an assist like in this SQL example here in my go file all I have right now is a category struct

online three through seven that defines a structure that has three fields and on line eight create tables will create the table tasks in the database so to get going on line 13 I'll start writing a function called create category summaries that takes in a database connection and returns an array of categories summary and from here I could see what copilot is suggesting and I like what I see so I'm going to accept this by tabbing and ultimately we see on line 14 we create a list of category summary along with the error object referenced then

after that we run the query line 20 we Loop through the results and fill in the list of categories summary and last but not least return the list of category summary all this within a few seconds now we've seen how pilot give us a suggestion and several examples but I want to point out that you don't always need to choose the first suggestion for example if I put in a request to create a function that takes a string and I wanted to return it backwards I can start tabbing to begin accepting what it's going to

present to me however if I wasn't satisfied with this solution I can just hover over it while the text is still gray and then either navigate to the next solution that it gives me except that or accept it one word at a time but in my case right now what I want to show you is that you can click on the ellipses over here and choose open GitHub Copilot and at the very top it'll say that it's synthesizing the various solutions that it offers for what I requested I can see there's a variety of different

ways that it could reverse a string I'll go ahead and choose this solution right here which is nice and short I'll click on accept solution and right below it I can ask to test this function I'll hit tab here and run the app and sure enough it Returns the word that was passed in hello spelled backwards we just talked about choosing from copilot's multiple Solutions but now I'd like to show you that when we're prompting copilot we can have multiple conditions take this python file for example let's say I wanted to parse a list of

expenses with some conditions and just to save some time I'll paste in one line at a time and this is me just pasting a couple of pieces of code and not co-pilot so starting on line four I'll just paste in my AI function definition parse expenses that accepts a string and I'm going to want copilot to do three things that I'll prompting my comments the first is to parse the list of expenses and return the list of triples date value and currency next I want to ignore lines starting with that number sign and I also

want copilot to parse the date using date time format now on line 10 I'll create a list to store the parsed expenses and now I feel good this is a good starting point where I can ask co-pilot its suggestions so I will hit Ctrl enter to see the different solutions it offers and as I sift through the different solutions what I'm looking for is what is closest to what I want with the least amount of work to modify everything's looking pretty decent and I'll go with this one I can see it meets my conditions parsing

the list starting on line 11 and on line 12 it ignores the lines starting with the number sign and next on line 13 through 16 we split the line into three part date value and currency and then append the parse data including the correct date format that we specified in the comments to the list of expenses and lastly we return the list on line 17 and this is all pretty cool because imagine if you're writing a lot of code how many times you could actually Leverage The Power of referencing copilot's Solutions the better you get

at prompting it the more effective it's going to be and the more time you save for pricing information you can just come to this site here and click on compare plans or if you want to go straight to the free trial just click over here but if you are a student you'll definitely want to hop on over to this site here and under students sign up for the student developer pack we covered quite a bit but there is so much more on the horizon with AI in general and specifically co-pilot I'm planning on releasing several

more videos on copilot so subscribe to be notified about them and if you got value out of this one definitely hit that like button thanks for joining and I will see you in the next one but there is so much more on the horizon with all with AI in general so subscribe to be notified for a company that sucked and if you got value out of this video definitely hit the like button that's better I say videos too much video video I only said video once oh thanks for telling me with the video so we

covered so we covered quite we'll do one more final take Final Countdown thanks for joining and I will see you in the next one all right about to Rob