本動画では、VS Codeベースの無料AIコーディングIDE「Trae AI」の最新機能を紹介している。カスタムエージェント機能やMCPサポートが追加され、実際にテキストから画像生成アプリを作成するデモを通じて、その実用性とCursorなどの有料代替品としての可能性を検証している。
4,624 文字
ウェブ開発のコーディングをされている方なら、今回の内容をとても気に入っていただけると思います。Trae AIという無料のAIコーディングアシスタントについて見ていきます。実際、これはVS Codeをベースに構築された本格的なコーディングIDEであり、今回の動画のスポンサーでもあります。
最近、大幅なアップグレードが行われました。特定のツールセットを使って特定のタスクに対応するコーディングエージェントをカスタマイズできるようになったのです。また、MCPがあらゆる場所で注目を集めていることから、MCPサポートも追加されました。全体的に、他のコーディングIDEに対する非常に優れた無料代替手段となっています。
この動画では、Trae AIの新機能について説明し、私がどのように活用する予定かをお話しします。Trae AIは、おそらくすべてのコーディングIDEの中で最もクリーンなUIを持っており、最新機能により、ウェブ開発やコーディング全般において本当に優れた選択肢となっています。
それでは始めましょう。Trae AIはUIを完全に再設計し、本当にクールな新機能を追加しました。これには、カスタマイズ可能な新しいエージェントが含まれており、現在はMCPサポートがあることで極めて強力になっています。また、プロジェクト用のカスタムルールもサポートするようになり、ウェブ検索機能も追加されました。
Trae AIには他のコーディングIDEの基本機能がすべて備わっていますが、カスタムエージェントが特に特別な機能だと思います。後ほど動画でいくつかの例をお見せします。
Trae AIは多数の異なるモデルをサポートしており、Claude 3.5 SonnetやGemini 2.5 Proなどが含まれています。現在無料で利用可能なモデルのリストがこちらです。しかし、プロバイダーからカスタムモデルを使用したい場合は、実際にそれが可能です。例えば、Open Routerからモデルを使用したい場合は、それを選択できます。使用したいモデルを選択できます。例えばOpenAI o1のようなものを使いたい場合、APIキーを提供するだけで、そのモデルをすぐに使用できます。
個人的に気に入っている機能は、この新しいカスタムエージェントです。異なるエージェントを構築してカスタマイズできます。新しいエージェントを作成してみましょう。「web search」と名付けます。カスタムプロンプトを提供してエージェントの動作をカスタマイズし、エージェントがアクセスできる異なるツールを選択できます。
現在、プレビュー、ウェブ検索、ターミナル、ファイルシステムにアクセスできることが分かります。しかし、このウェブ検索の代わりに、ウェブ検索を実行できるMCPを作成したいとします。このfire crawl MCPを削除します。MCPのリストに移動すると、いくつかの事前設定されたMCPがあります。
このリストから何でも選択できます。基本的にMCPのレジストリとして機能し、UIは非常に優れています。Tavilyを使用してみましょう。これはウェブ検索を実行できるAPIです。MCPを追加する方法はこのようになります。追加する必要がある設定がこちらです。
Trae AI内にリストされているMCPについては、実際にドキュメントを読むことができるウェブページへのリンクもあります。IDE内でウェブページのプレビューが開きます。ドキュメントを見るだけなら、実際にウェブブラウザに移動する必要はありません。
この場合、この設定をコピーするだけです。コピーして、ここに戻ってペーストします。TavilyウェブサイトからAPIキーを提供するだけです。APIキーをペーストします。この動画の録画後にこれを削除する予定です。「MCPで自動的にビルダーに追加されました」と表示されます。「理解しました」と言います。これで、カスタムエージェントに戻って有効にできます。
「作成」をクリックして、すぐに使用します。新しいチャットを作成します。エージェント内に、コーディングタスクのデフォルトエージェントである「builder」があります。次に、すべてのMCPにアクセスできる「builder with MCPs」があります。しかし今、Tavily MCPのみにアクセスできるウェブ検索エージェントを作成しました。
これにより、プロジェクトを本当にカスタマイズできます。特定のMCPセットにアクセスできる、非常に特定のタスクセット用の非常に特定のエージェントを使用できます。最新のGemini SDKを調べるよう依頼しました。まず現在のワークスペースを確認しましたが、その後、作成したウェブ検索MCPを使用することにしました。
MCPへの呼び出しを実行する前に許可を求めます。これは重要です、特にシステムへのアクセスを提供している場合があるからです。または、自動実行を有効にすることもできますが、これは全くお勧めしません。しかし、これを実行してみましょう。
ウェブ検索に基づいて、最新バージョンを教えてくれました。Googleが統合SDKを使用していることを理解できました。何らかの理由で、この時点では古いモデルであるGemini 1.5 Proもリストしています。これは、Trae AI内でMCPがどのように機能するかの簡単な例でした。
しかし、私が個人的にTrae AIを使用するプロジェクトの例をお見せしましょう。新しいチャットを開始します。今回は「builder」を選択します。これは基本的にエージェントの実装です。使用したいコーディングモデルを選択できます。Gemini 2.5 Proを使用します。
レート制限に遭遇する場合があります。その場合は、異なるモデルを選択するか、Open Routerからモデルを使用することができます。テキストから画像への生成器となるプロジェクトの要件文書を作成しました。これは、ユーザーがGoogle Gemini APIを使用してテキストプロンプトに基づいて画像を生成できるクライアントサイドのウェブアプリケーションです。
Flash 2.0モデルを具体的に使用したいと思います。これにはネイティブの画像生成機能があるからです。ユーザーがプロンプトを提供し、そのプロンプトに基づいて、GeminiのREST APIを使用して画像を生成し、画像を表示します。画像の再生成やダウンロードのサポートも必要であり、画像生成を待っている間はアニメーションを表示します。
APIがどのようになるか、そしてプロジェクトのファイル構造がどのようになるかも説明されています。これをコンテキストとして使用するために必要なのは、要件に基づいてプロジェクトを実装するようビルダーに依頼することだけです。
要件を追加するために、ハッシュ記号を使用します。コード、ファイル、フォルダ、ワークスペース、ドキュメントを提供するか、ウェブ検索を実行するよう指示できます。この場合、ファイルがあるので、ファイルを使用して選択します。これを送信します。
プロジェクトを実装し、ここでAPIキーについて尋ねています。APIキーを提供する必要があります。使用しているAPIエンドポイントも確認しましたが、正しいようです。これが機能するかどうか見てみましょう。
個人的なプロジェクトでは、SDKの使用をやめました。サービスがREST APIエンドポイントを提供している場合、通常はそれらを使用します。ここでもGemini APIでそうしていることが分かります。コードの保守性が非常に簡単になります。
エージェントなので、実際にコードを実行して出力を確認できます。ターミナルでここで実行します。Pythonコードを実行していることが分かります。ウェブページのプレビューも可能です。これをクリックすると、ウェブページがどのように見えるかのプレビューが表示されます。
これは完全に機能するはずです。実際に画像を生成できるか見てみましょう。サッカーをしているラマの画像を作成するよう依頼します。画像の代わりに、エラーが発生しました。何が起こったか確認してみましょう。
実際のAPI呼び出しがこちらです。そのドキュメントをコピーします。マルチモーダル入力も使用しています。問題を説明するのではなく、スクリーンショットを撮って送信し、REST APIエンドポイントを使用するために正確に何が必要かを伝えます。
いくつかの更新を行いました。実際に機能するか見てみましょう。同じプロンプトを再度試してみます。実際に何が起こっているか見られるように大きくしてみましょう。「生成」をクリックします。
サッカーをしているラマの画像ができました。再生成機能が動作するか見てみましょう。これも動作しているようです。ダウンロードを確認しましょう。ファイルのダウンロードもできるようです。
全体的に、現在のコーディングAIアシスタンスのすべての機能を備えているようです。例えば、このような何かを選択して説明を求めることができます。コーディング能力は選択するモデルに依存します。Gemini 2.5 ProやClaude 3.5 Sonnetはコーディングが本当に優秀です。
最新のGPT-4o1のサポートもあります。これらはすべて無料で利用できますが、レート制限に遭遇する可能性があります。また、ここでコードを直接編集することもできます。コメントを追加するよう依頼できます。
他のコーディングIDEと比較してUIが非常にクリーンに見えます。ここで実際に差分を確認できるからです。これを受け入れると、それらのコメントが追加されました。
大規模なプロジェクトではまだテストしていませんが、小規模なプロジェクトでは問題なく動作しているようです。現在、Trae AIは無料で使用できます。最大の懸念の一つはプライバシーとセキュリティであり、これは彼らがウェブサイトで直接対処していることです。ここから直接読み上げます。
価値のあるものとして受け取ってください。彼らは言います。「ローカルデータ保存 – コードベースファイルはインデックス作成のためにデバイスにローカルに復元されます。ファイルは埋め込みのために一時的にアップロードされる場合があります。処理後、すべてのプレーンテキストは削除されます。
安全なデータアクセス – 厳格なアクセス制御と暗号化された送信が実施され、不正アクセスを防止し、セキュリティリスクへの露出を削減します。
地域展開 – ユーザーデータとインフラストラクチャは、アカウント所在地に基づいて展開され、米国、シンガポール、マレーシアに保存され、地域のデータ規制を満たすために隔離が実装されています。」
全体的に、非常に強力なコーディングIDEだと思います。特に、カスタムエージェントのこれらの優れた機能があります。ぜひチェックしてみることを強くお勧めします。CursorやWindsurfなどの他のコーディングIDEとどのように比較されるか教えてください。
とにかく、この動画が役に立ったことを願っています。ご視聴ありがとうございました。いつものように、次回の動画でお会いしましょう。
コメント