>_tech-draft
Mastra AIのアイコン
Mastra AI
動画公開日
タイトル

How Production AI Agents Are Actually Built | Mastra at Future Frontend 2026

再生時間

49分 13秒

Mastraで始めるエージェント開発!フロントエンド連携と最新パターン

ポイント

  • Mastraは、エージェント開発を支援するオープンソースのTypeScriptフレームワークで、この分野に不慣れな開発者でも迅速に開発を始められます。
  • フレームワークは教育ツールとして機能し、モデルに依存せず最新のスキルを提供することで、複雑なエージェントの構築を容易にします。
  • エージェントとフロントエンドの連携を重視し、クライアントサイドからのツール呼び出しにより、未来のユーザー体験を革新する可能性を提示します。

Mastraで始めるエージェント開発:フロントエンド連携と最新パターン

はじめに

本日は、エージェントをアプリケーション層で構築することについてお話しします。私はMastraで開発者体験と開発者教育を担当しているAlexです。そして、Mastraの創業エンジニアであり、Next.jsの共同制作者、Vercelの共同創設者でもあるTonyと共に登壇します。

私たちは現在、Mastra(マストラ)を開発しています。Mastraは、エージェント構築を支援するために設計されたオープンソースのTypeScriptフレームワークです。これは、かつてGatsby(ギャツビー)を手掛けた創業チームによって作成されました。Gatsbyで共に働いたメンバーが、再び集まってMastraを構築しているのです。

フレームワークとしてのMastraとエージェント開発の教育的側面

フレームワークは、単なるツールの集合体ではなく、本質的に「教育ツール」であると私たちは考えています。ウェブアプリケーションやシングルページアプリケーションの構築を学ぶ際、多くの概念や新しい技術が登場しますが、フレームワークはそれらを組み合わせるためのビルディングブロックを提供し、学習パスを明確にしてくれます。

Mastraも同様に、エージェント開発のためのフレームワークとして機能します。フロントエンドアプリケーションにおけるルーティングのように、Mastraはエージェントにツールを与え、ワークフローを構築するための構成要素(コンストラクト)を提供します。MCP(Multi-agent Communication Protocol)やA2A(Agent-to-Agent)といった専門用語に馴染みがなくても、Mastraはこれらの概念を扱うためのプリミティブ(基本的な機能)を備えており、エージェントをより迅速に構築できるよう支援します。

また、Mastraは共通のパターンに基づいてビルディングブロックが構築されているため、この分野に不慣れな方でもスムーズに開発を進めることができます。私たちは自らを教育者であると考えているため、フレームワークの開発だけでなく、エージェント構築の原則やパターンに関する書籍も出版し、知識の普及にも努めています。

現在、エージェントを構築したり、それを本番環境にデプロイしたりしている方はまだ多くありません。しかし、Mastraを使えば、エージェント開発の可能性について学び、どこからでも始めることができます。

Mastraによるエージェント構築の基本

それでは、実際にMastraを使ってエージェントを構築する方法を見ていきましょう。

プロジェクトの開始

Mastraを使った開発を始める最も簡単な方法は、以下のコマンドを実行することです。

npm create mastra

このコマンドを実行すると、エージェントの名前を設定するよう求められます。例えば、「weather-agent」のような名前を付けることができます。次に、利用するモデルを選択します。Mastraはモデルに依存しないフレームワークであるため、OpenAIのモデルでもAnthropicのモデルでも、後で簡単に変更することが可能です。これにより、特定のプロバイダーに縛られることなく開発を進められます。

Mastraのツールと最新の知識

エージェントの能力を最大限に引き出すために、Mastraのツール(スキル)を有効にすることをお勧めします。コーディングエージェントは、学習済みデータに基づいて動作しますが、フレームワークは頻繁にアップデートされるため、情報が古くなることがあります。Mastraでは、最新の機能や慣用的なパターンに関する専門知識をエージェントに与えるためのスキルを構築しています。これにより、手作業でコードを書くだけでなく、エージェントに質問することで、常に最新の知見に基づいたコードを得ることができます。

エージェントの定義

Mastraでは、Mastraインスタンスを定義し、そのインスタンスにエージェントやメッセージ履歴のようなストレージなど、エージェント内の要素を表すオブジェクトを追加します。例えば、天気予報エージェントの場合、エージェントのコードはMastraインスタンスを作成し、必要なツールやストレージを定義することで構成されます。

エージェントの未来と利用事例

私たちは、エージェントがフロントエンド体験をどのように進化させるか、そして新しいパターンがエージェントの未来をどのように形作るかについて考察しています。エージェントは、数ヶ月から1年でフロントエンドのあり方を大きく変える可能性を秘めています。

Mastraで構築されている様々なエージェントのユースケースについても見てきました。これらの事例は、皆さんのインスピレーションとなり、エージェントの可能性を理解する手助けとなるでしょう。

エージェントとフロントエンドの連携

特に注目すべきは、エージェントとフロントエンドを接続する方法です。そして、エージェントがクライアントサイドのツールを呼び出すという興味深いアイデアがあります。フロントエンド開発者はこの機能をまだ十分に活用していないと考えていますが、これは素晴らしいユーザー体験を生み出す可能性があります。

まとめ

本日は、Mastraを使ったエージェント構築の基本から、その未来の可能性、そしてフロントエンドとの連携についてご紹介しました。Mastraは、エージェント開発をより身近なものにし、初心者から経験豊富な開発者まで、誰もが最新の知識とツールを使って強力なエージェントを構築できるよう支援します。

ご質問がありましたら、お気軽にお寄せください。

参考動画: https://www.youtube.com/watch?v=NbG2KydKDek