メインコンテンツへスキップ
AI Tools 17分で読める

Claude Code on the Webとは？ブラウザからコーディングを委任する新機能の全貌

#Claude Code#Anthropic#AI開発ツール#AIコーディング#Claude Code on the Web
この記事はこんな人におすすめ
  • Claude Codeをターミナルで使っていて、Web版の違いを知りたい方
  • ブラウザやスマホからコーディングタスクを委任したいフリーランス・副業エンジニア
  • AIコーディングツールの最新動向をキャッチアップしたい方

「通勤中にスマホからタスクを投げて、帰宅したら実装が終わっていた」。Zennに投稿されたあるエンジニアの体験談（lnest_knowledge）が、Claude Code on the Webの本質を一言で表している。

2025年10月にリサーチプレビューとして登場し、その後Team・Enterpriseプランにも拡大されたこの機能は、Claude Codeをターミナルから解放した。ブラウザを開き、GitHubリポジトリを接続し、やりたいことを日本語で伝えるだけ。あとはAnthropicのクラウド上で勝手にコードが書かれていく。

ただし「万能」ではない。レート制限の共有、サンドボックスの制約、ローカル環境との差異など、知っておくべき落とし穴もある。この記事では公式情報と実ユーザーの声の両面から、Claude Code on the Webの実像を掘り下げる。

Claude Code on the Webの仕組み

ブラウザでclaude.ai/codeにアクセスし、GitHubアカウントを接続する。タスクを自然言語で入力すると、Anthropicが管理するクラウド上の隔離されたサンドボックスでClaude Codeが動き始める（公式ドキュメント）。

サンドボックスの中身はUbuntu 24.04ベースのVM（公式ドキュメント）。Python、Node.js、Go、Rust、Ruby、Java、PHP、C++といった主要言語がプリインストールされており、PostgreSQL 16やRedis 7.0も使える。npm、pip、cargo、bundlerなどのパッケージマネージャも一通り揃っている。

GitHubとの通信は専用のセキュリティプロキシを経由する。サンドボックス内のGitクライアントはスコープ付きの認証情報（アクセスできる範囲を限定したトークン）を使い、プロキシがユーザーのGitHubトークンに変換する仕組みだ。pushは作業中のブランチに限定される。

Zennでサンドボックスの仕様を独自解析した記事（oikon）によると、VMのスペックは16コアCPU・21GB RAM・30GBディスク程度とのこと（非公式のユーザー実測値であり、Anthropicの公式仕様ではない）。gVisorベースのLinuxコンテナで隔離されている。

ターミナル版と何が違うのか

項目Web版ターミナル版
実行環境Anthropicのクラウド（サンドボックス）ローカルマシン
適した作業明確なタスク、バグ修正、並列作業探索的な作業、ローカル設定が必要な作業
並列実行複数タスクを同時に別々のVMで実行可シングルセッション
環境変数設定画面で手動登録が必要.envをそのまま参照
モニタリングブラウザ、モバイルアプリ、/tasksコマンドターミナルのみ

最大の違いは非同期性だ。ターミナル版はターミナルの前にいないと作業が進まない。Web版は投げっぱなしにできる。

逆にWeb版の弱点は、ローカルの.envファイルやカスタム設定を直接参照できない点。高度なカスタム設定が必要な場面ではターミナル版のほうが楽だ（DevelopersIO検証記事）。ターミナル版の最新機能についてはClaude Code 3月アップデートまとめも参照してほしい。

—remoteと—teleport：ターミナルとWebの橋渡し

あまり知られていないが、ターミナル版とWeb版は一方通行ではなく行き来できる。

# ターミナルからWeb版にタスクを送る
claude --remote "READMEのインストール手順を最新に更新して"

# Web版で動いているセッションをターミナルに引き込む
claude --teleport

--remoteはターミナルからWeb版のセッションを新規作成するコマンド。ローカルにいながらクラウドの並列処理能力を使える。

--teleport（またはWeb版のセッション内で/teleport）は、Web版で進行中のセッションをローカルのターミナルに引き込む。Web版で大まかな実装を進めさせて、仕上げはローカルで自分の手で行う、という使い方ができる。

PMとしての視点で言えば、この「計画はWebで並列に走らせ、詳細はローカルで仕上げる」ワークフローはプロジェクト運営と似ている。大きなタスクを分解して同時に走らせ、最終的な統合は人間がコントロールする。

--remote + --teleportの実践パターン
  1. 朝、3つのバグ修正をそれぞれclaude --remoteでWeb版に投げる
  2. 日中は本業に集中する
  3. 夕方、各セッションの進捗をモバイルアプリで確認
  4. 仕上げが必要なものだけ--teleportでローカルに引き込み、手動で調整

実ユーザーの声：光と影

スマホだけでアプリを開発・リリース

Zennのruwatana氏は、スマホのClaudeアプリからWeb版に指示を出し続けるだけで、約2週間でアプリを開発してリリースまで漕ぎ着けた。ブランチ作成からコードプッシュまでClaude Codeが自動で行い、本人はPRのマージだけをやればいい状態だったという（Zenn）。

通勤時間が「開発時間」になるのは、本業のある副業エンジニアやフリーランスにとって大きい。

API従量課金で約5万円の事例

一方で、Zennのekusiadadus氏はiOS・Android・Web・Chrome拡張・GoバックエンドをすべてClaude Codeに書かせた結果、API従量課金で約5万円を消費した（Zenn）。コードベースの90%をAIが書いたという効率は驚異的だが、コスト管理の仕組みがないと青天井になるリスクがある。利用コストは作業規模や使い方で大幅に変わるため、少額から試すのが賢明だ。

Proプランの制限は「数時間で枯渇」

DEV Communityの非公式調査記事（DEV Community）では、ブラインドテストでClaude Codeが67%の勝率だったと報告されている（独自調査のため参考値）。一方、Proプランの制限がたった数時間で尽きるという声も多数上がっている。「品質はトップクラスだが使い切れない」という声が、現時点のコミュニティでは多い。

60歳エンジニアの嘆き

Hacker Newsでは「Claude Codeが情熱を殺した」という投稿が話題になった（HN）。60歳のエンジニアが「AIはmore destinations but less journeyを与える」と語り、コーディングのパズルを解く楽しみが失われたと嘆いた。ツールの効率性と、ものづくりの楽しさのトレードオフは、今後も議論が続くだろう。

料金プランとレート制限の管理

Web版の利用に追加料金はかからない。ただしチャット・ターミナル版Claude Codeとレート制限を共有する点が重要だ（公式ヘルプ）。

プラン月額備考
Pro20ドルClaude Code利用可。制限はやや厳しい
Max 5x100ドルProの5倍の利用枠
Max 20x200ドルProの20倍の利用枠
Team25〜30ドル/席プレミアムシート（年払い100ドル/席、月払い150ドル/席）でClaude Code利用可
EnterpriseカスタムプレミアムシートまたはChat + Claude Codeシート

Zennのlnest_knowledge氏の検証では、ある中規模プロジェクトのタスク1件でProプランのレート制限の約40%を消費したという報告もある（Zenn）。タスクの規模によって消費量は大きく異なるが、Web版で並列タスクを走らせると消費はさらに加速する。

レート制限を賢く使うコツ
  • Web版で並列タスクを走らせすぎない（各タスクが独立して制限を消費する）
  • 大きなタスクは分割せず、1つのセッションにまとめて投げるほうが効率的
  • 3月のオフピーク倍増プロモーション（3月27日まで）を活用する
  • 本気で使うならMax 5x以上のプランを検討する

まずはclaude.ai/codeでGitHubリポジトリを接続し、「テストを1件追加して」「README.mdの英語訳」など、変更範囲の小さいタスクから試してみるのがおすすめだ。

詳しく見る

セキュリティ：エンタープライズでも使えるか

ネットワークアクセスは3段階から選べる。

  • Limited（デフォルト）：npm、PyPI、RubyGems、Docker Hub、AWS/GCP/Azureなど許可リストのドメインのみ通信可
  • Full：全ドメインへの通信を許可
  • No internet：外部通信を完全遮断（Anthropic APIとの通信のみ）

すべての通信はHTTP/HTTPSセキュリティプロキシを経由する。GitHubの認証情報がサンドボックスに直接渡ることはない（公式ドキュメント）。

この設計は、以前取り上げたClaude Codeのセキュリティ対策と通じる思想だ。コードに触れるツールだからこそ、最小権限の原則を徹底している。

制約と注意点

正直に書いておくべき制約がいくつかある。

GitHub限定。GitLabやBitbucketのリポジトリは使えない。これは地味に痛い。GitLabを使っているフリーランスも多いはずだ。

ローカル環境を参照できない。.envファイル、ローカルにだけインストールされているフレームワーク、デプロイ用の設定ファイルなどはサンドボックスに引き継がれない。環境設定画面でセットアップスクリプトを書く必要がある。

JavaScriptランタイムBunとの相性問題。公式ドキュメントでも「Bunはセキュリティプロキシとの間に既知の問題がある」と明記されている。Bunユーザーは注意が必要だ。

カスタム環境イメージの保存ができない。毎回セットアップスクリプトが走る。頻繁に使うなら、スクリプトの最適化が地味に重要になる。

PMとしての評価

自分は電脳狐影、PMが本業だ。コードを書く側というよりは「使う側」の視点で評価する。

Claude Code on the Webの最大の価値は**「開発のモビリティ」**だと思う。ターミナルの前にいなくても、スマホからでも、ブラウザからでも、開発タスクを前に進められる。これは単なる技術的な進化ではなく、働き方の変化だ。

特にフリーランスエンジニアにとって、隙間時間で開発を進められるのは大きなアドバンテージになる。本業の合間に副業の開発を少しずつ進める、といった使い方と相性がいい。

ただし、現時点ではProプランのレート制限が実用には厳しい。本格的に使うならMax 5x（月100ドル）以上も検討に値する。コスト対効果をしっかり計算してから導入すべきだ。

また、Vibe Codingの文脈で言えば、Claude Code on the Webは「自然言語でコーディングを委任する」という流れの最前線にいる。ただし、AIに丸投げすることの光と影は常に意識しておきたい。

Claude Code on the Webを試すには、claude.ai/codeからGitHubリポジトリを接続する。Proプラン以上が必要。まずは小さなバグ修正から始めて、自分のワークフローに合うか確かめるのがおすすめだ。

詳しく見る

免責事項: 本記事の料金・機能情報は2026年3月19日時点のものだ。Claude Code on the Webはリサーチプレビュー段階であり、仕様が変更される可能性がある。最新情報は公式ドキュメントを確認してほしい。

Share