Coding with AI: 8 Tips for Using GitHub Copilot

hey everyone it's The Eclectic Dev today we're going to look at eight tips using GitHub co-pilot to make sure we use its capabilities to its fullest let's check it out all right so let's get into the eight tips using GitHub co-pilot now these tips are in no particular order so make sure you'll stay to the end so that you can get all of the information also these tips do not matter which IDE you're using whether that's Visual Studio code Visual Studio or one of the other supported idees it doesn't matter which language or technology stack you're using these tips will work across all of them also if you're new to the channel welcome make sure to hit the Subscribe below and let's get into these tips starting with tip number one know your GitHub co-pilot agents and slash commands all right so if I go over to GitHub co-pilot chat which is right here there are ways to be expressive in nature with our code files more quickly than having to type out long prompts and the way we do that is through agents and slash commands the easiest way to get to them is to say slel now I know in some tooling when you ask for the help you get just uh inundated with commands but the cool thing with GitHub co-pilot as you can see right here all of the agents and slash commands that are available are really able to take a look at within almost one ey shot and so what are the differences between the agents and the slash commands so the agents are what start with the at symbol like at workspace at vs code and at Terminal these are really specialized experts that can assist us with specific tasks for example at workpace gives us the context of our entire working codes space so all of the code files within our specific project no matter what you're working with so in the example of all these files it would have access to everything that I could ask a question across it have it build code for me many many different operations so that's the at workspace agent also asking Visual Studio code a question at vs code maybe we want to ask at something like at vs code and say how how do I increase the font you know something in that in that realm and then you can see after a few seconds here the agent and the prompt comes back with how to actually increase the editor font size and what I really like in this case is it provides these buttons that you can click and then it'll bring it up immediately so that's a way you can interact with an agent about the IDE itself going back to the original list again you can also ask a question about the terminal like how do I run the unit test or how do I run the application so those are the agents the slash commands are then paired up with the agents as you can see here nested underneath and you have all of the different slash commands especially the ones that you should be using often like explain and test or fix so these ones right here you can highlight a block of code or an entire file or give it and you can say slash explain now when you do slash explain notice that there's a terminal option and a workspace option so depending on what you're targeting and you can ask it to explain some code same thing with tests so while you can longhand uh type out these prompts like explain this code to me or generate tests for this block of code the slash commands provide a very concise way that quickly you can interact with co-pilot and don't forget this is available as well when you're working in line with co-pilot chat so these different slash commands you can highlight a block of code and say explain or fix or generate tests based on that so knowing these agents and slash commands will help expedite your use with GitHub co-pilot and make sure you're using it efficiently with your code all right so let's move on to tip number two which is understanding prompt engineering so prompt engineering is the process of how we interact with GitHub co-pilot what we ask it to do for us in our IDE or wherever we are using it now in reality this could be an entire video onto itself but wanted to spend just a couple of minutes talking about it so that we can maximize the results and the efficiency that we get back from GitHub copilot so again the prompts are the way we interact so looking at this code file right here maybe I need some sort of sort method so if I say generate a sort method it's going to give me one but that's not very specific so it does a good job but what if I had other details that I needed in that so I like to make this analogy a lot with GitHub co-pilot which is say your friends are going out to lunch and they stop by your desk at work and say what would you like for lunch and you say food well they go off and they get you something and they come back with a soup and a sandwich and you say I didn't want that I wanted a piece of pizza with a salad and a soft drink well they would have gotten you that if you were specific on what you had asked for but you were generic working with GitHub co-pilot is very similar to that if we are too generic we won't get back the completions that we want so in this case when we say generate a sort method we're not being very specific but what if I say something along the lines of generate a sort method using a supplied parameter from Cabin which is a model and return a new collection this time we get a method that mirrors exactly what I was looking for with the cabin type and a sort field and it will return me what I was looking for now again don't worry about the language or the technology stack whether you're in python or Java C or any language it doesn't matter the process of how you interact and what you ask for is the same when using GitHub co-pilot let's go take a look at now generating a unit test for this over in co-pilot chat so ordinarily there's a lot of ways we could do this but typically you could highlight something whether it's just this method or maybe a series of methods in the files and you want to generate some tests well we know now with our slash command we could use workspace tests but let's show that with our prompt we can be very specific and detailed about exactly what we're looking for and this is important to know with GitHub co-pilot because again it's not like a genie in the bottle with only three wishes you can be as detailed or as specific with the requirements of what you're looking for so in this case let's use our test/ Command but let's add on some detail here I'm going to say Ure to use mock cabin data for the unit test and ensure to mock out the cabin service that's an injected service that makes HTTP calls I don't want that to make any real calls so I'm telling it to mock that out and do not call through to the actual code make sure to include positive and negative test paths using null values for cabin service being returned all right so now it should operate on those requirements and give me ex more specifically what I'm looking for and this is what prompt engineering about now listen if it gets you there 60 70 80% of the way we may not always need to get 100% so that prompt engineering you know we can iterate with the results a little bit but if it gets you 80 90% of the way there you've have a massive Time Savings and really that's one of the goals of using something like this uh a generative AI tool like get up co-pilot now of course with any of the results no matter how you craft your prompt or what you request for it you always need to validate that code so that's a little aside from today but all of this should never be taken verbatim you would go through and validate these lines of code and after using them maybe you would iterate and say update this part or update that part or do what you need so there's a little bit about prompt engineering again you can be quite specific in what you're doing whether you're working with chat or code to comments or any part with it you want want to be specific and provide details to co-pilot so that it gives you the best solution all right let's move along to GI up co-pilot tip number three which is context matters often the question is how does co-pilot know what my code is in order to offer a solution and so depending on where you're working with GitHub copilot it'll operate differently on what it's able to use so starting with inline GitHub co-pilot so I'm here in a code file previously had asked to generate a sort method now this particular file in this angular application is really dependent on maybe two other files one is the cabin model which is right here which is just an interface defining what cabin is and it's also dependent on a cabin service that's injected also in addition to some angular libraries for some basic operations so if I want co-pilot to have the best context what I can do is ensure that those additional files that I think are pertinent to asking any questions are also open so you notice I already have the cabin model file open but it' probably be a good idea in this case that I also open up the cabin service that's being used that just ensures that it has the greatest amount of awareness and context when when I ask or prompt get a co-pilot for any information that I'm about to do having the additional files open in additional tabs will help co-pilot now co-pilot on its own is incredibly efficient in a vacuum just strictly based on the public data it was trained on in its models behind the scenes but it always can be helped and you'll get the most efficient results if you have open the pertinent tabs or code files that are associated with what you are working with in addition context can also be about what's visually available on the screen so over here in GitHub co-pilot chat I don't have anything highlighted explicitly in my code file right now what's visually shown is roughly lines 45 to 66 with my cursor around 64 right now so if I ask workspace SL explain one of the things you'll notice that it'll do is it'll pop up here and it says give me an enclosing range did you want this method did you want the entire component what did you want so in this case maybe I would say Okay sort cabins and then it would give me the detail and explain that particular method so it was actually asking me what what scope did you want and then it proceeds to explain that code however if I didn't use the slash command and just have my cursor there and I said you know explain this code mod and so in that case what it's going to do is after explaining it's going to just take what is visually available on the screen so again that's the only context that it has right there and then explains that code in a vacuum if I scroll back up used one reference take a note lines 43 to 66 again what is visible on the screen I can also ask it to explain using a file handle so maybe in this case I want to say atw workplace SL explain and I can use this hashtag file and give it a handle and it will open the command pallet with all of the different files and I'm like I really need an explanation on service you know because that's what's being used here and so I didn't have to jump over to that particular file it's a really slick and efficient way that I can say hey I would like you to explain this other file because maybe in this case I'm new to the code and I don't know exactly what that's doing it's also prompting me at the top for which scope in reference to that so I'm going to give it the entire component and then it shows that it's used a couple of references and it will talk about the cabin service and what it is doing that would help give me context without having to necessarily switch to another file and it actually proceeds to go ahead and explain all of the different methods that are in the cabins Service as you can see handle error and get cabins and such so last thing to mention again is at the at workspace agent that is what is giving us context to the entire application so if you need to ask something project wide that's when you're going to use workspace maybe you're also going to have it generate code and ask it a prompt right here and say generate you know some kind of utility method or a data ing method or whatever and by using at workspace it has the context of your entire application to make sure that the solutions it provides are in line and consistent with the existing code in your application so understanding context between inline code versus chat is important and helpful when using GitHub co-pilot all right let's move along to GitHub co-pilot tip number four which is looking at alternative Solutions so this is applicable to GitHub co-pilot inline so whether you're using code to comment or you've hit the return key and you've been offered a method or a line of code there is the opportunity and capability to look at alternative Solutions and not everyone is aware about that so here on line 53 I have a comment that is prompting GitHub co-pilot to generate a sort method using a supplied parameter as we had looked at before now when I hit return it offers a method now that method is is in Gray and not accepted until I hit the Tab Key I have the opportunity here in Visual Studio code to hit control enter that will synthesize and bring up co-pilot's additional suggestions for that implementation again it could be a single line of code it might be a method but it does offer multiple suggestions so you can go through and take a look and see what those additional suggestions would be for example you you know looking at different ways that this sort cabin method could be implemented here's a sort cabins buy here is another one that's got sort cabins with a switch statement so you have a couple of different options you can either go back to your original prompt or comment and try to refactor it again that prompt engineering from Step number two to get exactly what you want or in this case we can look at additional suggestions for what we want what's really cool is we can hit this button right here which says accept suggestion and it will inject that code often it's asked are these in order of how great they're perceived the solution is and they are not there's no Rhyme or Reason I've had to go down to solution three or seven or maybe sometimes it's suggestion one and you can suggest that again that's all inner to bring up that additional suggestions pain looking at another quick example of this maybe I maybe it's just an inline I just want to say sort the cabins you know and uh let's say by name and so it already is telling me that it comes up sort the cabins by name it gives me something again I can hit Alt Enter it will come up before I've accepted that provide me with additional suggestions in the pain here and as it begins to add some additional ones maybe I was after this one again I could use that link and then I could insert it in and it has it it has uh actually duplicated that codee right there so I can remove that out and then I can take that alternate suggested line so again using Alt Enter is a great way when you're in line with co-pilot to look at additional Solutions and suggestions that one of those offered up might be more applicable to you all right let's move along to GitHub co-pilot tip number five which is refactoring and optimizing code so one of the most powerful features of get up co-pilot is to be able to assess and analyze existing code that you have written and see if it could be refactored or optimized you can also assess it for security concerns as well which is a really helpful provided insight to some code that you may have written because you just want to double check before it gets all the way to say build servers and penetration testing and things of that nature and you want to check it on the spot so taking a look here at an example in this cabin service it has this method to make an HP call it gets the data it subscribes to an observable then it has the opportunity to manipulate that data or do presentation layer logic and then return or at least broadcast that data through the observable so maybe this method is doing a little bit too much so we can highlight this method and go over to get up co-pilot chat and then we can do something along the lines of refactor this code into multiple methods this should take it and do an assessment on it it gives us the capability into making multiple methods so here it breaks down a fetch cabins a handle response and an update cabin Source also it has the original method that way that the API surface or the CER isn't disrupted and so in this case I really do like the breakdown now again I was being very abstract about my inquiry to say refactor this method I could have added more specificity like I talked about in tip number two with prompt engineering to be very specific about what I wanted I can also with that same method I could say optimize this code it will go through and it say it's actually quite efficient already but we can break it down to be more readable and maintainable so while refactoring in this instance happens to be a part of that and it makes a very similar suggestion it may not always if you're familiar with like assessment tools especially within the different idees for catic complexity and if statements and nested ifs and switch statements and monolithic methods this is a great opportunity to say take a look at this code and optimize it it's really strong I'd say in the area of Legacy code however that is you define it older code that was written to give an opportunity to look at it and say can you make this code better I can also ask something like is this code secure and the reason I might do that is maybe I had to implement you know it's making an HP call do I have it in the right order and it tells me that it is pretty secure overall there but there's a few things you can consider so for example it's not using HPS for maybe this URL right here or the error handling the data validation so it's giving some pointers now I have highlighted code before that is using known anti patterns and insecure coding practices and it will immediately say no this code is not secure so from refactoring code to optimizing code to checking if codee's secure these are all things that you can do with GitHub co-pilot through GitHub co-pilot chat that'll help us maximize our use with the tool all right let's move along to GitHub co-pilot tip number six which is maximizing co-pilots features to do research directly in the IDE and stay in the flow so ordinarily if you are stumped on something or have a question or needed to research something you would go out to a browser and start searching for whatever question that you had you might up end up on stack Overflow or in Reddit or on some blog post or official docs but the capability exists directly in the IDE with GitHub co-pilot chat to do the research that we need and stay in the flow without breaking context or concentration let's go ahead and look at an example all right so I've added a prompt here that says how can I create a deep copy of an object collection that contains functions in JavaScript and doesn't use the low Dash Library Show an example so the low Dash library is very famous for having the Deep copy functionality but in this case I want to research how can I do it in JavaScript alone so I'm going to ask co-pilot about that and also see an example of it now ordinarily I know I could use a shallow copy with json.parse but I needed to investigate and find a better example of that so it's giving me an example here of a deep copy method and its usage and then it goes in as well as explaining that it recursively copies all the properties on an object it binds the function to the new object to ensure this works correctly if the property is primitive then it simply copies it the long and the short here is that it is being able to provide solutions to me without having to leave the IDE and no this is not an extension of the browser if you're new to co-pilot that didn't go do a search on the web that's still using the large language models behind co-pilot to come up with these solutions that are problemistic in nature so each time you ask you may get a slight variation on it but we're allowed to and able to ask our questions also the questions do not have to be specific to the context of your code or the stack that you're on I can ask any independent technology related question right here in chat for example let's add another one here's something I wanted to ask Azure about in Azure if I place my Azure functions behind apim can I get the off claims that is accessing the functions from the user in JavaScript code so this is an example where I haven't done this yet and I'm looking to ask this question without having to dig through the dock and it says yes you can do that you can get those claims and here's a step-by-step guide including the policy for APM and then on the claims itself here is how we can access the claims within JavaScript within a the Azure function so it gives a full solution and a step-by-step guide so you can really see the power here of get a co-pilot not having to break flow context and concentration we can ask those research questions directly within co-pilot chat all right next up is tip number seven which is managing or dealing with Solutions in GitHub co-pilot chat that are blocked because they match public code so here out on my GitHub account and if you were to go to yours and look at your license under your co-pilot there's going to be a setting regarding matching public code and whether that is allowed or enabled or blocked which is right here suggestions matching public code which is currently blocked now that is controlled at the organization or Enterprise level and in most cases that is the default and should be used option of blocked so let's go ahead and take a look at example in Visual Studio code all right here in co-pilot chat I have one of my previous examples pulled up from the research tip about creating a deep copy method without using low Dash now this is a slightly modified version that it has to be a little bit problematic with getting the response so if I go ahead and submit this to co-pilot chat it will start to offer a solution with a very similar description that we had seen before however once it starts getting into the code you'll notice that you get this message here sorry the response match public code so it was blocked please rephrase your prompt and that's exactly what we need to do it's almost a form of prompt engineering and what's happened here you might be questioning it goes back to that policy setting so the way GitHub co-pilot Works under the covers is the large language models have been trained on public data and it is not a copy and paste solution mechanism it's much more sophisticated in the gener AI techniques and the Deep learning and machine learning that it's using but what it is doing is that if it sees a pattern over and over that it thinks is a good suggestion it may offer that as part of the solution remember get up co-pilot is probalistic not deterministic so it comes up with unique Solutions each time however if that solution matches more than 150 characters which is roughly two lines of code and for IP protection it will block that code and that's what's happened here so we need a similar solution we just need to rephrase what we are asking it to do so let's go ahead and do that all right here is a modified version of that same prompt but this time when we submit it it should bypass that and offer a unique solution that is going to not be blocked by that public code matching so this time we see a modified version of this particular method that it offered up before but this time it is not being blocked so often the solution to that problem is to recraft your prompt with additional information or changing the way that it's worded so that it gives you a solution that's unique and not blocked by public code all right and finally GitHub co-pilot tip number eight which is to learn your specific IDE keyboard shortcuts and so I'm out here on the GitHub docs and I will leave this link in the description below where the mainstream and supported idees all have tabs here so for example Visual Studio code and you can see the keyboard shortcuts for Mac or for Windows or for Linux and the same thing if you're using one of the other support idees as well you can go down and see what those keyboard shortcuts are so let's head back over to visual studio code and try some of these out all right so let's test out some of our keyboard shortcuts so we already talked about the one that when you are co-pilot in line and you're offered a solution that control enter on Windows for visual studio code will bring up the co-pilot additional suggestions and so that one is easy enough to get to and then evaluate those options also if you are in line and you want to use co-pilot chat not in the separate window you can hit control I that is a co-pilot chat inline input that will allow you to type in the same things that you do in chat so if you say something like slash explain then what it'll do is very conveniently it will hop you back over and give you the co-pilot chat window so one of the the things that you may find Convenient is you will be toggling between file explorer over here on the left and co-pilot chat often so you can get to file explorer with control shift e and you can get back to co-pilot chat using control Al ey there's also the capability to get to co-pilot chat at the command or top level window which is to use control shift ey that will bring up a co-pilot chat prompt at the top of the IDE itself if that's where it's convenient for you kind of rounding this off while it's not a keyboard shortcut there are context menu options so if you rightclick and go into co-pilot you have the ability to bring up the co-pilot chat prompt as we shown uh also explain or fix or generate docs and some of the other functionality as well excellent so that's eight tips that hopefully accelerate your use on using GitHub co-pilot within the IDE and your everyday Journey with technology again there may be slight variances between the different idees but the docs will say what those are but overall these tips are indifferent to the again language stack IDE or whatever you're using so get out there and try them if you have other tips you want to share put them in the comments below feel free to give this a like appreciate the support and until next time this is The Eclectic Dev we'll see you later

Channel: The Eclectic Dev

Views: 423

Keywords: ai, artificial intelligence, LLM, gpt, 3.5, gpt 4, openai, vscode, visual studio code, programming, tutorial, license, github, git, how to, unit tests, gpt 3.5, gpt 35, language models, learning, assisted, extensions, visual studio, blazor, .net, dotnet, copilot chat, slash commands, developer, c#, vb.net, asp.net, web app, development, 4-o, python, java, go, tips and tricks, tips, tricks, suggestions, back end, best practices, basics, intermediate, advanced, help, understand

Id: GCpRIoVRQ6A

Length: 29min 58sec (1798 seconds)

Published: Fri May 31 2024