Google's Duet AI: A New Challenger to GitHub Co-Pilot?

--- type: transcript date: 2023-12-15 youtube_id: j0aBI3w7N9c --- # Transcript: Google's Duet AI: A New Challenger to GitHub Co-Pilot? in this video I'm going to be showing you doet AI for developers which is Google's response to Microsoft's popular GitHub co-pilot so I'm going to show you an example within VSS code but there are a couple other editors that you can go ahead and set this up in if you're using something like jet brains or if you're using Cloud workstations so the nice thing with this is it is free until February 1st so if you're looking for something just to play around with especially over the holidays if you have a bit more time this might be a good candidate for something like that now once this trial is over it is going to cost $90 per month per user with an upfront annual commitment so about twice the cost as GitHub co-pilot right now and I'm just going to run through an example and you can sort of decide for yourself on whether it's worth the cost so I'm just going to run through a simple example so all I have is an index HTML in my vs code here and the goal that I'm going to have is I want to have it create a UI for me as well as the logic where it will essentially take an input of a stock ticker I want it to go ahead create the endpoint that I'm going to use so I'm going to ask it to find a free API to use and then I want it to render a chart of the historical data and I'll just run through some of the steps on how you can get started so to get started within vs code if you just go within the extensions Marketplace and search for either doet AI or Google Cloud code you'll have to install the extension enable the extension authenticate with your Google Cloud account and then you'll just have to make sure that you have the coding assistant turned on So within the bottom right of your screen if you have any errors they'll show in the bottom right here where it says do at Ai and you can also click that if all uh lights are a go and you can turn it on and off from here as well so a couple things with duet AI so just before I forget the one thing that you can do is if you h highlight the code and you right click you do have a handful of things so within this context uh some of these don't really apply but you can say explain this uh as you might sort of expect with integrating a service like this with using an llm having a a complex code base having something where you can just click explain that's a nice feature you can generate code from it and then you can also generate unit tests if you'd like now the other nice thing with this is there is also something similar to GitHub co-pilot check where you have this interface here where you can go ahead and prompt questions about your code or just arbitrary things uh from this interface as well so what I'm going to do is I'm going to go ahead and just save out this file and I'm going to start my local server here for what we're going to be working in so I'm going to make my code editor just a little larger here and I'll make this window just slightly smaller since mostly what we're going to be doing is within vs code so what I'm going to do here is what you can do is you can write a comment of your intention of the code that You' like to have written so I can say I want an input that will take in a stock ticker then I want to use a free historical stock API that will render a chart after a user submits the form so you can see right at the end there it started to autocomplete even what I was asking for it to do and then what you can do is if you just go ahead and make a new line here you can click control and then enter and it will generate suggestions in line here so right here we see that we have our H1 we have our form it wants to make a canvas so you can just start to tab through this so here what's interesting so it says it wants to reference a chartjs file that's local so if I wanted to scaffold this out I could make that file and continue on in there but just for Simplicity sake I'm going to actually stop it here and say I don't want that suggestion and then I'm just going to go within here and then I'm going to further clarify my comment and I'm going to say I want to do everything within this HTML file okay so let's carry on here so we see that it's opening up a script tag for us and so you can see that you can either tab uh one line at a time or section by section or at any point you can just go ahead and click control enter so I'm going to go click control enter going to see that it's generated an awful lot of code for me so we see that it's uh setting up the variables that I need for the different Dom elements it's adding the event listener to submission on the form it's actually going ahead and looking to make a request to chart now what I'm going to further say here is I'm going to let's go and clarify this even further let's say I want to use free Alpha Vantage so Alpha Vantage is a really easy API to get started with it's free you don't even need to make an account or log in rather you just have to put in your email and they'll give you an API key and you can query it and play around with this example if you'd like so let's see what it can do from here so here this is a little bit closer to what I was sort of hoping for so we have our Alpha Vantage endpoint we have the time series daily which I assume is the historical data and we see that it's doing a little normalization of the data and then it's doing some work to actually create the chart so to get the API key so you see your API key here so we'll have to just get an API key from alpha Vantage and all you have to do is you just have to put in your organization an email and then you'll have have the API key that you can grab right in line here so I have mine just in another screen here I'm just going to go ahead and paste it over here and then I'm just going to move this up and then let's just save this out so let's just try this with our terminal or console rather open and I'm going to put in the Apple ticker and submit it and there we go so so right there with just a little bit of finessing we have a working stock example so obviously it's very ugly so you could go in and you could say I want to use Tailwind CSS for styling and let's just test this out so if I get rid of this whole form and the H1 so it didn't quite do it there but let's try and contrl enter so again it isn't quite generating the form so let's say I want to use Tailwind CSS for styling I want to have my input and button use the Tailwind classes so again it didn't quite do it in in the example that I used prior it actually did this pretty well but if I just go ahead here and if I just say let's highlight it let's test a different approach let's highlight this and let's say generate code so it didn't give me any suggestions but let's say I paste that in within the chat window here so here it's saying I could either install Tailwind CSS or use the class here so let's just copy over the CDN and then within here okay so it has a little bit of something uh I'll hand it to that but it's not really visually appealing let's say let's make this more modern so I'll go in here I'll find the portion that I want to use so we have now we have a main and a header so some good HTML practices here and if I just go ahead and replace that section and save it out there we go so now we have something that looks a little bit more reasonable and if I just go ahead again say AAP submit there's our stock chart so that's it for this video I just wanted to give you a quick look at duet AI I really encourage you to check it out especially if you're watching this video and it's still within the free trial period it's a really neat tool just to play around with you saw in this example you can sort of get some interesting results it's really nice that it's integrated right within your code editor so the difference with something like chat GPT you might be uh copy and pasting things back and forth whereas this it's just integrated right within so hopefully you found this video useful if you did please like comment share and subscribe and otherwise until the next one