This VS Code AI Coding Assistant Is A Game Changer!
Summary
TLDRこの動画では、無料で提供されているVSSコードAIコーディングアシスタントであるCodiumを探索しています。Codiumは、GitHub Copilotに代わる最高の無料オプションである可能性があります。40以上のIDEに対応し、70以上の言語で動作し、リポジトリ全体のコンテキストを認識。個人ユーザーには無料で利用可能で、チームは月額12ドルでサポートや管理ダッシュボードを提供。Codiumの機能を試して、基本的なNode.js Expressサーバーを作成し、リアルタイム為替レートを取得するAPIエンドポイントを実装。また、Codium Liveの機能を利用して、BunやNext.jsなどの技術に対応するAIチャットボットと対話。Codiumは開発者のエクスペリエンスを向上させるために、コードの説明、リファクタリング、問題の解決を提案する機能も備えています。
Takeaways
- 🌟 VSS code AIコーディングアシスタントの新製品、Codiumが紹介されています。
- 🔍 Codiumは、GitHub Co-pilotの無料の代替として注目されています。
- 💡 Codiumは現代のコーディング超能力者と自称し、400以上のIDEと70以上の言語をサポートしています。
- 🆓 個人ユーザーには無料で利用可能で、40以上のIDEと70以上の言語に対応しています。
- 📚 完全なリポジトリのコンテキスト認識を提供し、プロプライエットコードにも対応しています。
- 🏢 企業向けには、管理者ダッシュボードや席管理、GPT-4のサポートが利用できます。
- 🚀 CodiumはSaaSであり、プライベートクラウドのデプロイも可能です。
- 🛠️ Codiumはエラーチェックやコードの改善提案も行います。
- 📝 コードブロックの説明やJSドキュメントコメントの作成もサポートしています。
- 🎉 正しいコードを生成した際には、コンフィettiと共に「Good Job」という称賛が表示されます。
- 💬 Codiumのチャット機能では、特定の技術に関連するAIチャットボットと対話できます。
- 🔧 コードのリファクタリングや問題の解決を提案する機能も備えています。
Q & A
VSSコードAIコーディングアシスタントとは何ですか?
-VSSコードAIコーディングアシスタントは、プログラム開発者がコードを書く際に助言や自動完成などの機能を提供するツールです。
codiumはどのようなツールですか?
-codiumは、現代のコードスーパーパワーと自称するVSSコードAIコーディングアシスタントです。GitHub co-pilotの無料代替として注目されています。
codiumが支持されているIDEの数は何ですか?
-codiumは40以上のIDEに対応しています。
codiumがサポートする言語の数は何ですか?
-codiumは70以上の言語をサポートしています。
codiumのFull repo context awareness機能とは何ですか?
-Full repo context awareness機能とは、codiumがリポジトリ全体の文脈を理解し、その文脈に基づいてコードの自動完成や提案を行う機能です。
codiumのAIチャットアシスタントはどのように動作しますか?
-codiumのAIチャットアシスタントは、ユーザーが入力したコードや質問に対して、リアルタイムに助言やコード提案を行うことができます。
codiumの有料プランにはどのような機能が含まれていますか?
-codiumの有料プランには、管理者ダッシュボード、席管理、GPT-4サポートなどの機能が含まれています。
codiumが培養されるデータの種類は何ですか?
-codiumは、ある程度オープンソースであるコードベースでのみ訓練されます。つまり、許可されたデータのみを使って学習されています。
codiumが提供するコード生成の精度はどの程度ですか?
-codiumは高速で正確なコード生成が可能ですが、完璧ではありません。AIが全てのコードを書くわけではなく、開発者が理解し、調整する必要があります。
codiumのコード説明機能はどのように動作しますか?
-codiumのコード説明機能は、選択したコードブロックを分析し、その機能や動作を説明するコメントを生成します。
codiumのリファクタリング機能はどのようなことをすることができますか?
-codiumのリファクタリング機能は、コードにコメントを追加、バグを修正、コードをより効率的かつタイプセーフにするためにasync/awaitを使用など、様々な改善を行います。
Outlines
🚀 VSSコードAIコーディングアシスタントの探求
ビデオの第1段落では、多くのVSSコードAIコーディングアシスタントの1つであるCodiumについて探求しています。このアシスタントはGitHub Copilotの最高の無料代替として注目されています。Codiumは現代のコードスーパーパワーとして自称しており、40以上のIDEに対応し、10万以上の開発者から愛されています。このツールはマルチラインの自動完成、チャットと検索、そしてコパイロと比較して注目すべき大きなポイントは個人向けの無料利用、40以上のIDEサポート、70以上の言語対応、そしてフルレポジトリのコンテキスト認識を誇っています。また、CodiumはSaaSであり、Proprietaryコードにも対応し、SOC2タイプ2のコンプライアンスを維持しています。
🔍 Codiumの機能と実践
第2段落では、Codiumの機能を実践的に検証しています。Codium Liveという機能を通じて、BunやNext.jsなどの技術に対応したAIチャットボットと対話することができます。これらのボットは、特定の技術に関する豊富なコンテキストを持っており、ブラウザ上で即座にサポートが可能です。 また、Codiumはコードブロックの説明を生成し、JSドキュメントスタイルのコメントを自動作成することができます。コードのリファクタリング機能も豊富で、コメントの追加、バグのチェック、コードの最適化など、多数のオプションを提供しています。
🌟 Codiumのパフォーマンスとユーザエクスペリエンス
最後の段落では、Codiumのパフォーマンスとユーザエクスペリエンスについて述べています。Codiumは非常に高速であり、エラーの特定や修正を正確に行うことができます。また、コードの改善提案や、Unitテストの生成など、開発者がより迅速かつ効率的にコードを書くための多くの機能を提供しています。 ただし、AIコーディングアシスタントは完璧ではありません。自動ですべてのコードを書くことはできませんが、Codiumのようなツールは開発者の助けとして非常に役立ちます。最後に、Codiumを試してみることを勧め、コメント欄で意見を共有し、他のAIコーディングアシスタントのレビューを希望する場合はライクや登録をしてください。
Mindmap
Keywords
💡VSS code AI coding assistant
💡Codium
💡Auto-completion
💡Chat and search
💡Free for individuals
💡Repo context awareness
💡SO2 type 2 compliance
💡GPT-4 support
💡Tailwind CSS
💡Error checking
💡Code refactoring
Highlights
探索VSS code AI编码助手,可能成为GitHub co-pilot的最佳免费替代品。
介绍Codium,一个现代编程超级大国,受到成千上万开发者的喜爱。
Codium支持40多种IDE和70多种语言,具有完整的仓库上下文感知能力。
Codium对个人免费,提供无限使用、AI聊天助手和自动补全功能。
Codium可以在私有云和NVPC上部署,适合拥有专有代码的公司。
Codium遵守SOC 2 Type II合规性,适合企业使用。
Codium的团队版提供每月12美元的订阅服务,包括GPT-4支持和管理员仪表盘。
Codium的AI聊天助手能够创建基于Node.js和Express的HTTP服务器和API端点。
Codium提供了代码块的解释功能,帮助开发者理解代码逻辑。
Codium的AI助手能够生成JS文档风格的注释。
Codium Live提供针对不同技术的AI聊天机器人,如Bun、Next.js等。
Codium Live的Bun聊天机器人能够提供使用Bun构建简单HTTP服务器的代码示例。
Codium的AI助手能够为Next.js应用创建服务器端行动以从数据库获取数据。
Codium提供代码重构建议,如添加注释、生成单元测试和优化代码。
Codium能够快速准确地识别和修复代码中的问题。
Codium支持Tailwind CSS,能够为电影标题添加样式创建卡片。
Codium虽然不是完美的,但能够帮助开发者更快地编写代码。
视频作者推荐尝试Codium,并邀请观众分享他们的看法。
Transcripts
in today's video I'm going to explore
yet another VSS 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 co-pilot so let's
check it
[Music]
out we're going to take a look at codium
now codium 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 loved
by hundreds or thousands hundreds of
thousands of developers over 40 IDE e
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
individuals um 40 plus idees and 70 plus
languages which which is pretty crazy
full repo context awareness interesting
not only is this a sass but it can be
deployed on Prim and nvpc which is great
for companies with proprietary code and
they're s SO2 type 2 compliant so let's
see what we get uh individual one seat
free forever autoc completion uh 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 uh support so that's uh
interesting so I'm assuming the
individual one is 3.5 all right so we've
got all of our different
idees uh different
languages uh looks like your your
Tailwind image here is
broken uh we'll look past that um bunch
of Partners and a lot of cool reviews oh
I just noticed this one from swix pretty
cool all right 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
no. JS how do I create an API endpoint
for an HTTP server that dynamically
converts currencies by fetching realtime
exchange rates from a third party
service and the endpoint should accept
yada yada okay so let's see what it does
okay so it is pretty thorough here and
fast as well uh let's see what it did so
it's having us use the HTTP package and
node
Fetch and I mean I think this would
technically work let's um let's Also
let's modify this I want to say uh let's
use
Express for this
instead okay all right that seems to
be uh pretty good so it looks like uh
require Express node fetch we got our
app going on a port uh we've got our get
in points here our from and two we're
getting that from our request query uh
it's 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 like when
you get something right you give it the
thumbs up and you get confetti that's
pretty pretty amazing I love the
developer experience there okay so what
are our options we can looks like we can
copy the code or insert the code so I
have a a server JS file open here and
let's go ah 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
codium uh explain selected code
block all
right says this code snippet creates an
endpoint slon convert currency which
takes query parameters from in two and
the ount fetches the exchange rate
external API from in two currencies then
calculates the converted amount and
sends it as Json response um 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 um but this
is this is pretty good so we've got our
prams from two
amount each example was basically the
same thing um but pretty good now maybe
I want to do that same thing but with
the bun JavaScript run 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
context aware AI chat bots so they have
one for bun Lang chain nextjs and and
several others so let's use the the bun
uh 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 it's giving us this
example here looks like it's importing
serve from
bun uh Bun Run server. TS and it's
giving us some uh context items
here what does this bring us
to okay so it looks like it's pulling
most of its context directly from the
bun repo that's pretty cool so this is
really nice to be able to chat with some
specific uh AI chat Bots uh for
different technologies that could be
helpful right here in the browser let's
try a different use case all right so I
have a nextjs App open here and under
the app directory I have an actions. TS
file here and it's blank so I want to
create a server action to bring in
movies from a database so let me write a
comment here all right so create an xjs
server action that Imports movies from
the manga to be sample database that is
called sample
inflix let's see what it does all right
so first option here is import
client that is not what I want to do I
actually have a lib file here that
controls uh the mongod to be connection
let's see what the next suggestion is
okay that's right client promise from my
local file export async function get
movies that looks good and then client
is going to await client promise sure my
DB is going to be sample inflix yep
movies is going to await DB do okay do
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 uh use server
up
here and now I'm seeing these things
above here codium refactor explain 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 add it okay that looks pretty good
um let's see what happens when we hit
refactor okay so it's giving us us some
options add comments and dock 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 uh generate unit tests
make oh there okay generate unit
tests make this code strongly typed make
this faster more efficient use async
await instead of promises verbosely
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 and accept well yeah so basically
just added a comment for most lines so
wait for M to be client to be ready
connect to the sample inflix database
retrieve all movies from the uh movies
collection limit to two and convert the
results to an array um it
didn't um say anything about the return
but I guess that's
obvious um and if I didn't explain it
should basically tell me that same thing
uh just in a very short paragraph
retrieves a list of movies from the
sample inflix database uh uses mongodb
returns a promise that resolves to an
array of movie objects pretty cool okay
and I see here it says ask anything use
at symbol to mention code blocks so
let's see if we can say at get
movies let's say
rewrite this function to remove all
comments nice so we could use that to uh
refactor probably or to add additional
functionality so I like that let's uh
let's get some confetti and copy that
now if we have an error let's see let's
remove one of these awaits and we're
going to get an error 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 property DV does not exist
on type promise occurs when variable
client is assigned to client promise
directly which is a promise that
resolves toong to be client to fix 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 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 overwriting the existing code here
but that's a a feature request um if I
did insert code it's going to kind of
just insert it wherever my cursor was so
I need a c copy this and
then uh actually it's going to copy the
entire thing probably from client
promise all the way
up there but now it works so let's now
implement this into uh a page here so
let's go over to our page and I want to
bring these in so let's see uh here at
the top go right here and this time I'm
going to do control I and I'm going to
say use the get movies server action to
display the movie titles on this page
and let's see what it
does pretty good let's accept it uh we
need to get rid of this page that we had
below
that and this is coming from our server
actions that's let's see is this cannot
find the module
actions okay so let's uh 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 I think we're going to
need to await this and then uh this is
going to have to be an async
function and then we should be good all
right so even though it 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 um 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 Tailwind so I want to add
some Tailwind classes to this so let's
select that control I 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 um
some rounded corners and a shadow I mean
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 working 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 and but they
should be able to help you to code
faster and for what what I've seen I
think codium is very capable of that and
for the price it's a no-brainer so give
codium 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
5.0 / 5 (0 votes)