💸

Claude Codeが高すぎるからコスト管理できるVS Code拡張機能を素人が自作した話【Torii】

に公開

きっかけ:すぐに使い切ってしまうセッション

私は現在、ペットの記録とサロンなどの店舗をシームレスに繋ぐWebアプリの開発を行っている。以前ブログをやっていたときに簡単にHTMLとかCSSを触った経験があるが、ほぼ素人なので開発にはClaude Codeを使っている。

Maxプランは高いのでProプランを使っているのだが、プロジェクトの機能が多くなるにつれて5時間のセッション、1週間の制限にすぐに引っかかってしまう。

Clineを使っていたこともあるが、DeepseekやAnthropicなどの各モデル間でAPIの利用量を把握して管理するのが大変煩わしく、私には向いていないと感じた。デポジットするタイプが多いので破産することはないがそれでも大変だった。

かといって、Cursorに乗り換えるのも違う気がした。自分でAPIキーを管理して、モデルも選べて、コードをクラウドに投げるかどうかも自分でコントロールしたい。

だったら作ってしまおうと思った。


作ったもの:Torii


Torii(鳥居)は、VS Code向けのAIコーディングエージェント。ClaudeやGeminiと壁打ちしながらClaude Codeで自作した。

https://github.com/2dachs/torii

一言でいうと

「コストが円でリアルタイムに見えるAIコーディングエージェント」

主な機能

コスト透明性

  • 1会話ごとのコストをリアルタイム表示
  • 月間合計を円換算でバー表示(為替レート自動取得)
  • プロジェクト別・グローバル別で予算を管理

マルチプロバイダー対応

  • OpenAI / Anthropic / DeepSeek / Google Gemini / Ollama(ローカル)を切り替えて使える
  • 用途や予算に応じて自動でモデルをルーティング

プライバシー自動保護

  • APIキーやパスワードなど機密キーワードを含むプロンプトは、自動でOllama(ローカル)に転送
  • コードがクラウドに飛ばない安心感

エージェントループ(Pro機能)

  • ファイルの読み書き・コマンド実行を自律的に繰り返す
  • 実行前にワンクリック承認UI(危険なコマンドは自動ブロック)

日本語UI

  • エラーメッセージ含めて全部日本語

技術的な話

アーキテクチャ

VS Code拡張機能は「Extension Host(Node.js)」と「Webview(ブラウザ)」の2プロセス構成になっている。

Webview(React)
  ↕ postMessage
Extension Host(Node.js)
  ↕ SSE / HTTP
Express サーバー(127.0.0.1)

agentLoop.ts(@cline/agents ベース)

エージェントループはゼロから実装しようとしていたんだが、プロンプトを入力しても同じ質問を繰り返したり、開いているプロジェクトファイルを読んでくれなかったりと、これだけで1週間近くを無駄にした。

どうしようかなと悩んでいたところでCline SDKがオープンソース化された。発表されたのが5月14日のことだから、本当にタイムリーだった。

というわけで@cline/agentsを使った。ゼロから実装するより品質が安定していて、ツール定義(read_file / write_file / run_command など)に集中できた。

承認フローの設計

コマンド実行やファイル書き込みは「ユーザーが承認してから実行」にしている。

AIがrun_commandを呼ぶ
  → agentLoopがPromiseで待機
  → SSEでWebviewに通知
  → 承認UIを表示
  → ユーザーがApprove/Cancel
  → ループ継続 or 中断

このフローを実装するのも時間がかかった。WebviewとExtension Hostは別プロセスなので、postMessage → SSE → HTTP POSTという経路を通って双方向通信する必要がある。


価格と配布

無料(OSS・MIT)

  • チャットモード
  • 予算管理・コスト表示
  • マルチプロバイダー・自動ルーティング

Pro:¥980/月(7日間無料トライアル付き)

  • エージェントループ(ファイル操作・コマンド実行)
  • ストリーミング応答

GitHub Copilotより安いラインを意識した。APIの従量課金は別途かかるけど、DeepSeekやOllamaを使えば実質ほぼ無料で運用できる。

VS Code Marketplace で配布中です:

VS Codeの「拡張機能」サイドバーでToriiと検索すれば出てきます。

ext install pettal.torii

https://github.com/2dachs/torii

Proライセンスはこちら:

現在はLemon Squeezyの審査中のためライセンスの購入はできません。その代わりといってはなんですが...審査完了まではベータ版として無料でPro版を使えます!この機会にぜひお試しあれ。

https://torii-dev.lemonsqueezy.com/buy/1679529


作ってみてわかったこと

今回拡張機能を作ってみて、面白いものや役に立ちそうなものをバイブコーディングで作って動かすだけなら簡単だが、実務的なもの、実際に使ってもらえるものを作り切るのが一番難しいのだと実感した。

Toriiが多くの個人開発者にとってコスト管理の面でたどり着く最初の入口になって、いろんなプロバイダーやモデルが使えるゲートウェイのような存在になれば嬉しい。

フィードバックや不具合報告はGitHub Issuesで歓迎します。

https://github.com/2dachs/torii/issues

Discussion