Transcript
00:00:00皆さんこんにちは、メルキーです。Vercelではリリースを重ねるのが大好きです。特にインフラ関連は。
00:00:06進化するクラウドに向けたインフラです。そのインフラにおいて最も重要な要素の一つが、
00:00:11Vercel CLIです。CLIはもはや単なるターミナルからのデプロイツールではありません。
00:00:17エージェントのための構築プリミティブ、つまりリソースの接続や
00:00:23サンドボックスの作成、ログの確認、問題のデバッグ、デプロイの継続的な改善に使えるプログラム可能なインターフェースとなっています。
00:00:29それでは最初のパートとして、Vercel CLI向けに行っている最近のアップデートをご紹介します。
00:00:35エージェント開発の強力な基盤となる機能を見ていきましょう。まずはVercelサンドボックスと、
00:00:41Vercel CLIから直接利用する方法についてです。ご存じの通り、現在サンドボックスは非常に熱い分野であり、
00:00:47Vercelサンドボックスは業界最速クラスの体験を提供します。エージェントにコードを実行させる際に、
00:00:53安全に実行できる環境を整える上で、これ以上に最適な方法はありません。
00:00:57それではターミナルを見てみましょう。ご覧の通り、すでにvc connectで準備は完了しています。
00:01:04ここで行うのは、`vc sandbox create --connect` の実行です。
00:01:13これだけで、これから作成する新しいインスタンスに直接接続することができます。
00:01:17Vercel CLIを使えばこのように高速です。ご覧のように、作成されたサンドボックスの詳細が表示されます。
00:01:24チームプロジェクトが取得され、認証資格情報に直接スコープが設定されるため、非常に簡単でスムーズです。
00:01:29ご覧の通り、サンドボックスから通常通り任意のコマンドを実行できます。
00:01:36これで、必要な別のリポジトリのgit cloneを実行できるようになります。
00:01:41Vercel CLIのGitHubリポジトリを取得しましょう。こちらをコピーして、サンドボックスから
00:01:51git cloneを実行します。これでVercelリポジトリのクローンとダウンロードが行われ、
00:01:56サンドボックス内で使用できるようになります。リポジトリのクローンが完了したので、
00:02:02サンドボックスを一度終了しても問題ありません。後日戻りたい場合は、`vc sandbox connect` と
00:02:10サンドボックス名を実行すれば、中断したところから正確に再開できます。lsを実行すると、
00:02:17そのGitHubリポジトリが確認できます。Vercel CLIを使って、エージェントをサンドボックスで自由に暴れさせましょう。
00:02:24プロダクションレディなアプリケーションを構築する上で欠かせないもう一つの重要なインフラが、機能フラグです。
00:02:29Vercel FlagsはVercelプラットフォームに組み込まれた機能フラグプロバイダーであり、フラグの作成、
00:02:36ターゲティングルールの定義、プログレッシブロールアウトやA/Bテストの実行を、すべてVercel CLIのエージェントから行えます。
00:02:43それでは、手元にあるテストプロジェクト用に新しい機能フラグを作成してみましょう。
00:02:48最初に入力するコマンドは `vc flags create` で、続いて機能フラグの名前である
00:02:53「ab-split」を指定します。ご覧の通り、機能フラグが有効化されました。
00:03:02実際に確認してみましょう。「ab-split」という機能フラグがあり、プロダクション、
00:03:07プレビュー、開発の各ターゲットが設定されています。ここで、エージェントや自分自身に対して
00:03:13フラグやそれに紐づくトラフィックを変更したい場合の操作を見てみます。次のコマンドを貼り付けますが、
00:03:19ここでは Vercel CLIの `flags` コマンドを呼び出し、機能フラグ名（ab-split）を指定して、
00:03:26プロダクション環境をターゲットにしています。ユーザーIDに基づいてこれを分割し、
00:03:32重み付けとして `false` に95、`weight` に5を設定します。これは、トラフィックの95%が機能フラグの一方のバケツに割り振られ、
00:03:40残りの5%（ロールアウトしたい機能と仮定します）がもう一方になることを意味します。
00:03:44ここでクリックすると、これを絞り込んでメッセージを送信し、プロダクション向けのsplitを
00:03:50「false（オフ）、true（オン）」として設定できます。これは実際のプラットフォームに永続化されます。
00:03:56これで、プロダクション環境の機能フラグ「ab-split」の更新が成功しました。
00:04:02続いて、Vercel CLIにおける私のお気に入り機能になり得る、完全に再設計された `vc curl` についてご紹介します。
00:04:09エージェントはコードを書くだけでなく（それは昔の話です）、自分が変更した内容をテストする必要があります。
00:04:14Vercel curlを使うことで、デプロイURLを手動で結びつけることなく、
00:04:19リンクされたプロジェクトや特定のデプロイに対してリクエストを送信できます。さらに嬉しいことに、
00:04:26ネイティブのcurlコマンドをベースに開発されているため、通常のcurlで使える機能は何でも `vc curl` で利用できます。
00:04:32ご覧のようにターミナルを開いています。サイトを見てみると、単純なhello APIを持つ非常に基本的なサイトです。
00:04:38ここで `vc curl /api/hello` のように実行すると、レスポンスが返ってきます。なるほど、特に変わったところはありません。
00:04:46しかし、何らかのデプロイを行った後に、エージェントに同じことをしてもらうフローがあると面白いと思います。
00:04:52エンドポイントの見た目はどうか、正しく動作しているか、何か壊れていないかなど、
00:04:57`vc curl` を使って `/api/hello` エンドポイントを呼び出せるか、エージェントに指示してみましょう。
00:05:10素晴らしいですね。エンドポイントのレスポンスが成功し、エージェントが的確に仕事をこなしました。
00:05:14それでは、「動作確認のために、`/api/users` エンドポイントへPOSTリクエストを送ってみて」と伝えたらどうなるでしょうか。
00:05:22Vercelへデプロイしてあるため、エンドポイントの実際のスキーマを自動で取得してくれます。
00:05:35そしてネイティブコマンドを用いてPOSTコマンドを実行します。ご覧の通り、POSTは正常に動作し、
00:05:41レスポンスとして `create id 3 name melky` が返ってきました（デプロイ先は `hello-api-flame.vercel.app` です）。
00:05:47Vercelでここ数ヶ月間、非常に力を入れて取り組んできたもう一つのエキサイティングなリリースが、Vercel CLIの実験的なネイティブバイナリです。
00:05:54Mac、Windows、Linuxのいずれを使用しているかに関わらず、
00:06:00お使いのビルド環境やOSに最適な体験を提供することに注力したいと考えています。
00:06:05ご覧の通り、もう `vc` はありません。Node経由でインストールした通常のVercelは削除・アンインストール済みです。
00:06:12ここで `npm install -g @vercel/vc-native` を実行します。
00:06:18パッケージのインストールを探してみましょう。`which vc` と打つと、私のコンピュータがMacであるため、
00:06:26Mac用のネイティブバイナリがインストールされたことが示されます。これまで通りすべてのコマンドが機能しますが、
00:06:32ここで本当に実証したいのは、実行方式における違いです。
00:06:37ご覧のように、これは私の現在のコンピュータ（インテルではなくM4チップを搭載したMac）向けのarm64用64ビット実行ファイルです。
00:06:44現在の私のパソコンのもので、インテル製チップではなく、M4を搭載しています。そしてもう一つ
00:06:49ぜひお見せしたいのが、これらバイナリの実際のサイズの違いです。ご覧の通り、このバイナリには
00:06:55必要なものがすべて含まれており、サイズは66メガバイトです。このようにバイナリははるかに高速で軽量になっており、
00:07:02Windows、Linux、Macのすべてのユーザーに最高の体験をお届けできるよう順次展開しています。さて、次のパートは
00:07:08非常にエキサイティングです。プラグインがほとんどの開発ハーネスの主流になっています。プラグインを活用すれば、
00:07:16ハーネスの動作をコントロールして変更し、開発エクスペリエンスを大幅に最適化することができます。Vercelには
00:07:22専用のVercelプラグインがあり、Vercelを使って開発するなら必須のアイテムです。ご覧の通り、
00:07:29Claude Codeを開いていますが、Vercelプラグインが現在あらゆる場所で利用可能であることをお見せします。
00:07:34現在、Claude Codeハーネスの公式マーケットプレイスにいます。「vercel」と入力すると、
00:07:42Claude Codeプラグインの公式Vercel版が表示され、152,000回のインストール数があります。
00:07:48ユーザー単位、またはグローバルにインストールできます。ここではユーザー単位でインストールを進めます。
00:07:54すると「reload-dash-plugins」を実行するよう求められます。これでプラグインが再読み込みされ、
00:08:01様々なスキルやエージェントが利用可能になります。そのため、Next.jsを使った開発や、
00:08:06shadcn、認証などのデプロイを行う際、Claude Code向けのプラグインがしっかりサポートしてくれます。しかしVercelは
00:08:13これだけにとどまりません。Codexを開いても全く同じエクスペリエンスが提供されます。「plugins」と入力して
00:08:20利用可能なプラグインを閲覧できます。ご覧の通り、すでにVercelプラグインがインストールされており、
00:08:27これもOpenAIの公式Codexマーケットプレイスからのものです。そのため、CodexでGPTモデルを使用したい場合でも、
00:08:33Vercelプラグインが対応しています。ですが、まだ終わりではありません。今度は
00:08:40Grok CLIを使用する場合も、プラグインからGrokマーケットプレイスで利用可能であることが確認できます。
00:08:47したがって、Grok、Claude Code、Codexのどれを好むかにかかわらず、Vercelプラグインは利用可能です。
00:08:54お好みのハーネスに合わせてnpxコマンドでインストールすることも可能です。
00:09:00ぜひ活用して、CLIの体験をさらに高めてください。皆さん、この短いアップデート動画をご覧いただき
00:09:06誠にありがとうございました。パート2やパート3など、多くのパートが今後公開される予定ですので、
00:09:11ぜひご注目ください。私たちがどのようにCLIを開発し、
00:09:16エージェントのゲームをレベルアップさせているのか、そしてVercelでどのようなクールなものを準備しているのかを引き続きお見せしていきます。
00:09:22それでは次の動画でお会いしましょう、ピース！