This VS Code AI Coding Assistant Is A Game Changer! - Subtítulos bilingües de YouTube

This VS Code AI Coding Assistant Is A Game Changer! - Subtítulos bilingües

In today's video, I'm going to explore yet another VS code AI coding assistant.

Yes, I know what you're thinking.

There are tons of these things now, but this really just might be the best free alternative to GitHub code pilots.

So let's check it out.

to take a look at Cotium.

Cotium is the sponsor of today's video, but the viewpoints expressed are my own.

I will give an unbiased analysis.

So they call themselves the modern coding superpower.

Let's take a look here.

Love by hundreds or thousands, hundreds of thousands of developers.

Over 40 IDEs supported.

That's crazy.

All right, auto completion.

What I'm seeing here is multi-line auto completion.

So that's pretty cool.

Chat and search.

And let's see how they are comparing themselves to co-pilot here.

And I think this is the big piece here that it is free for 40 plus IDEs, and 70 plus languages, which is pretty crazy.

Full context awareness, interesting.

Not is this a SaaS,

but it can be deployed on-prem and NVPC, which is great for companies with proprietary code, and SOC 2 type 2 compliant.

So let's see what we get, individual 1C free for us.

Auto completion,

AI chat assistant,

unlimited usage,

that's pretty big,

and then it's trained on permissive data,

which means it is not trained on code bases that are not open source to some degree,

and then for teams,

let's see what do you get if you pay $12 a month, you get admin dashboard, seat management, okay, GPT-4 support.

So that's interesting.

So assuming the individual one is 3.5.

Alright, so we've got all of our different IDEs, different languages, looks like your tailwind image here is broken.

We'll look past that.

A of partners and a of cool reviews.

Oh, I noticed this one from Swix.

Pretty cool.

Alright, so let's check it out and see what it's capable of.

I installed the extension in VS code and I did have to sign in.

But now this is what I get here under the codium chat.

Let's start out by seeing if it can create a basic Node.js express server and create some custom endpoint.

So I'm going to ask it using Node.js,

how do I create an API endpoint for an HTTP server that dynamically converts currencies by fetching real-time exchange rates from a third

-party service and the endpoint should accept yada yada.

Okay.

So let's see.

Okay, so it is pretty thorough here and fast as well.

Let's see what it did.

So it's us use the HTTP package and node fetch.

And I think this would technically work.

Let's see.

Let's also, let's modify this.

I to say let's use express for this instead.

Okay, all right.

That seems to be pretty good.

So it looks like require express node fetch.

We've our app going.

We've got our get-in point here,

our from-in-2,

we're getting that from our request query using this API and then doing the conversion and it's got even some error checking in here and then

it's running.

So it seems like that would actually work.

So let's do a thumbs up.

This is actually one of the best parts of the app.

I when you get something right, you give it the thumbs up and you get confetti.

That's pretty amazing.

I love the developer experience there.

Okay, so what are our options?

We looks like we can copy the code or insert the code.

So having a server.js file open.

here and let's go ahead and insert it and pretty easy.

Okay, let's see if we can get it to explain a code block for us.

Let's say let's just highlight this bit here and I'm not sure the proper way to go about this.

Let's go CODM, explain selected code block.

All right,

says this code snippet creates an endpoint slash convert currency,

which takes query parameters from in two and the amount fetches exchange rate,

external API from in two parent currencies and calculates the converted amount and sends it as JSON So, yeah, that's exactly what it does.

Let's see how well it does creating a JS doc style comment.

Okay, so it looks like it's going line by line.

I'm hitting enter for each line.

Okay, so it keeps giving us the same example over and over there, but this is this is pretty good.

So we've got our params from two amounts.

Each example was basically the same thing, but pretty good.

Now, maybe I want to do that same thing, but with the bun JavaScript for one time,

well, I want to check out this as well, Codium Live.

So Codium also has on their website this feature, Codium Live, which has various contexts aware AI chatbots.

So they have one for bun, lane next and several others.

So let's use the bun chatbot and let's ask it a question.

How do I use BUN to build a simple HTTP server?

Show a code example.

Okay, so giving us this example here that's importing serve from BUN, BUN run server.ts and it's giving here this context items here.

What does this bring us to?

Okay, so it looks like it's pulling most of its context directly from the button repo.

That's pretty cool.

So this is really nice to be able to chat with some specific AI chatbots for different technologies that could be helpful right here.

Let's try a different use case.

All right, so I have a next JS app open here.

Under the app directory, I have an actions.ts file here and it's blank.

I to create a server action to bring in movies from a database.

So, let me write a comment here.

Alright, so we'll create a next JS server action that imports movies from the MongoDB sample database that is called sample inflicts.

Alright, so first option here is import Mongo client that is not what I want to do.

I actually have a lib file here that controls the MongoDB connection.

Let's see what the next suggestion is.

Okay, that's right.

Client promise from my local file.

Export function, get movies, that looks good.

And client is going to await client promise.

Sure, my DB is going to be simple conflicts.

Yep.

Movies is going to await.

Okay, dot collections is going to be movie and then find all limit of two to array that looks good.

And then let's return movies.

The only thing that I'm not seeing here is It probably should be a use server up here.

And now I'm seeing these things above here.

Codeium refactor explained and generate JS doc.

That's pretty cool.

Let's do the generate JS doc real quick and see what that does.

Let's say, yeah, and it.

Okay.

That looks pretty good.

Let's see what happens when we hit refactor.

Okay, so it's giving us some options, add comments, and doc strings to the code, add console

log statements, clean up this code, check for bugs and null pointers, implement the code for the to do comment.

Oh, generate unit tests, make other, okay, generate unit tests.

Make this code strongly typed.

Make this faster, more efficient, use async await instead of promises.

Or comment this code so that I can understand what's going on.

Let me see what that does.

Okay, so let's see, let's just apply it in.

Yeah, so basically just added a comment for most lines, so wait for Mon to be client to

be ready, connect to the sample inflicts database, retrieve all movies from the movies collection, limit to two, and convert the results to an array.

It didn't.

Say anything about the return, but I guess that's obvious.

And if I didn't explain, it should basically tell me that same thing.

Just in a very short paragraph.

Retrieves a list of movies from the sample inflicts data.

base uses MongoDB, returns a promise that resolves to an array of movie objects.

Very cool.

Okay.

And now I see here, it says, ask anything.

Use at symbol to mention code blocks.

So let's see if we could say at get movies.

Let's say rewrite this function remove all comments nice so we could use that to refactor probably or to add additional functionality

so I like that let's get some confetti and copy that if we have an error let's see let's

remove one of these awaits and we're going to get an error here.

here.

And now we can see this new link here, CODIUM EXPLAIN PROBLEM.

So let's do that and see what it says.

Okay, I just want to reiterate the fact that it's so fast.

It's crazy fast.

So the issue of property dev does not exist on type promise occurs when variable client is assigned to client promise.

is a promise that resolves to MongoDB client.

To this, you need to await the client promise.

So it very accurately found the issue and is fixing it here.

So it's notices that we need the await there.

And what did it comment?

Yeah, it even commented here, await the client promise.

All right, so this is great again, and the only issue I see here, though, is copy code and then insert code.

I wish that this had some way of just overriding the existing code here, but that's a feature request.

If I did insert code, it's going to kind of just insert it wherever my cursor was.

So I need to copy this and then actually it's going to copy the entire thing, probably.

And promise all the way up.

Yeah.

But now it works.

So let's now implement this into a page here.

So.

and I want to bring these in.

So let's see here at the top,

go right here and this I'm gonna do troll eye

and I'm gonna say use the get movies server action to display the movie titles on this.

and let's see what it does.

Pretty good.

Let's accept it.

We need to get rid of this page that we had below that.

And this is coming from our server actions.

Let's see, is this cannot find the module actions.

Okay, so let's.

See what happened here.

This should be actions like that.

So it was going up too many directories there.

Then we have an issue here with our map.

It says map does not exist on type promise.

Yeah, this, so this is a, let's think we're going to need to await this.

And then this is going to have to be an async.

function, and then we should be good, right?

So even though we got it mostly right,

there were still some little issues,

which kind of goes back to the point of can AI really do it all, but it's definitely helping and assisting.

So this seems like it should work.

Let me just go ahead and save this and run it and see what happens.

Okay, so we've got movies and two titles from movies and it actually worked, which is pretty cool.

All right, I want to try one more thing here.

Let's see how good it is with it.

So I want to add some tailwind classes to this.

So select that control eye and say add tailwind classes to create cards with the movie titles, the cards.

should have a black background and white text.

Let's just see what it does.

I really like how it does this diff here.

So we see what it was before and then what it is changing it to.

That's pretty cool.

So black background, text white, some rounded corners and a shadow.

I that's pretty decent.

Let's accept that.

And let's save that and then go back and check it out.

Well, we've got some interesting looking cards there, but it is.

Codium is pretty cool.

Now, none of these AI coding assistants are perfect, and they're not going to write all of the code for you.

You still need to know what you're doing, but they should be able to help you to code faster.

And for what I've seen, I think Codium is very capable of that.

And for the price, it's a no-brainer.

So give Cody a try and let me know what you think in the comments below.

And if you want to see me review other AI coding assistants, let me know.

And if this video was helpful, give this video a like and subscribe.

Idioma de traducción

Seleccionar

Resumen Exportar Práctica Oral

Desbloquea más funciones

Instala la extensión Trancy para desbloquear más funciones, incluyendo subtítulos de IA, definiciones de palabras de IA, análisis gramatical de IA, habla de IA, etc.

Compatible con las principales plataformas de video

Trancy no solo proporciona soporte de subtítulos bilingües para plataformas como YouTube, Netflix, Udemy, Disney+, TED, edX, Kehan, Coursera, sino que también ofrece traducción de palabras/frases de IA, traducción inmersiva de texto completo y otras funciones para páginas web regulares. Es un verdadero asistente de aprendizaje de idiomas todo en uno.

Navegadores de todas las plataformas

Trancy es compatible con todos los navegadores de plataformas, incluida la extensión del navegador Safari de iOS.

Modos de visualización múltiple

Admite modos de teatro, lectura, mixtos y otros modos de visualización para una experiencia bilingüe integral.

Modos de práctica múltiple

Admite modos de dictado de oraciones, evaluación oral, opción múltiple, dictado y otros modos de práctica.

Resumen de video de IA

Utiliza OpenAI para resumir videos y comprender rápidamente el contenido clave.

Subtítulos de IA

Genera subtítulos de IA precisos y rápidos para YouTube en solo 3-5 minutos.

Definiciones de palabras de IA

Toca las palabras en los subtítulos para buscar definiciones, con definiciones impulsadas por IA.

Análisis gramatical de IA

Analiza la gramática de las oraciones para comprender rápidamente los significados de las oraciones y dominar puntos de gramática difíciles.

Más funciones web

Además de los subtítulos de video bilingües, Trancy también proporciona traducción de palabras y traducción de texto completo para páginas web.