限られた時間を本来の仕事に集中させる「タスク振り分け術」
「Claude Codeって便利そうだけど、ターミナルとかコマンドラインとか……うちの会社にはハードルが高い」
そう思った方、安心してください。2025年10月のリリース以降、Claude Code on the Web(ウェブ版Claude Code)が登場し、ブラウザだけでClaude Codeの全機能が使えるようになりました。インストール不要。コマンドライン不要。ブラウザを開いてGitHubアカウントを接続するだけで、AIがコードを書き、バグを直し、テストを実行し、プルリクエストまで作成してくれます。
この記事では、Claude Code on the Webの始め方から実践的な活用法まで、非エンジニアの経営者でも理解できるレベルで徹底解説します。「開発チームがいないけどAIで業務を効率化したい」「外注しているシステム開発のコストを下げたい」——そんな方にこそ読んでいただきたい内容です。
Claude Code on the Webとは?ブラウザで動くAI開発エージェント

Claude Code on the Webは、Anthropic社が提供するブラウザベースのAIコーディングエージェントです。従来のClaude Codeはターミナル(コマンドライン)にインストールして使う必要がありましたが、Web版はその制約を完全に取り払いました。
ひとことで言えば、「ブラウザを開くだけで、AIがあなたの代わりにプログラミングしてくれるサービス」です。
従来のClaude Codeとの違い
従来のClaude Code(ターミナル版)は、開発者がローカルのパソコンにインストールして、コマンドラインから操作するツールでした。非常に強力ですが、セットアップにはNode.jsやnpmの知識が必要で、「開発環境を整える」というハードル自体が壁になっていました。
Claude Code on the Webは、このハードルを以下のように解消しています。
| 項目 | ターミナル版 Claude Code | Claude Code on the Web |
|---|---|---|
| インストール | npm install -g @anthropic-ai/claude-code が必要 | 不要。ブラウザだけでOK |
| 実行環境 | 自分のPC上で実行 | Anthropic管理のクラウドVM上で実行 |
| コマンドライン知識 | 必要 | 不要 |
| PCの電源 | タスク実行中はオンが必要 | タスク送信後はオフでもOK |
| 並列実行 | 複数ターミナルが必要 | ブラウザ上で複数タスクを同時実行 |
| モバイル対応 | 非対応 | iOS/Androidアプリから監視・指示可能 |
| セッション共有 | 手動で情報共有 | リンク共有でチームメンバーが閲覧可能 |
特に注目すべきは「PCの電源がオフでもタスクが継続する」という点です。朝出社時にタスクを送信しておけば、営業で外出している間にClaudeがコードを書き終えてくれる。そんな使い方ができるのです。
Claude Code on the Webが得意なこと
Anthropic公式ドキュメントによれば、Web版Claude Codeは以下のタスクに最適です。
- コードアーキテクチャに関する質問:「このプロジェクトの認証部分はどう動いているの?」と聞けば、コードベース全体を分析して回答
- バグ修正とルーチンタスク:「ログイン画面のバリデーションエラーを直して」と指示すれば自動修正
- 並列作業:複数のバグ修正を同時に処理し、それぞれのプルリクエストを作成
- ローカルにないリポジトリの作業:自分のPCにクローンしていないリポジトリでも作業可能
- バックエンド変更:テストコードの作成→テストに合格するコードの実装を自動で実行
つまり、「明確に定義できるタスクをClaudeに丸投げする」のがWeb版の最も効果的な使い方です。「このCSVファイルを読み込んでグラフを表示するダッシュボードを作って」のような指示を出して、Claudeが完成させるのを待つ——まさに「AIに仕事を任せる」体験です。
誰が使える?利用資格と料金プラン

Claude Code on the Webは現在リサーチプレビュー段階ですが、有料プランのユーザーであれば利用可能です。具体的には以下のプランが対応しています。
| プラン | 月額料金 | Claude Code on the Web | 特徴 |
|---|---|---|---|
| Pro | $20(約3,000円) | ✅ 利用可能 | 個人利用に最適。45メッセージ/5時間 |
| Max 5x | $100(約15,000円) | ✅ 利用可能 | Pro の5倍の利用量。パワーユーザー向け |
| Max 20x | $200(約30,000円) | ✅ 利用可能 | Pro の20倍の利用量。ヘビーユーザー向け |
| Team | $30/人(標準席) | ⚠️ プレミアム席で利用可能 | 5人以上のチーム向け。プレミアム席は$150/人 |
| Enterprise | カスタム価格 | ✅ 利用可能 | 大規模組織向け。SSO・監査ログ付き |
最もコスパが良いのはProプラン(月額$20)です。月3,000円で、ブラウザからAIにコーディングを任せられるなら、外注費と比較して圧倒的に安い。たとえば、簡単なWebページの修正を外注すれば1万~3万円はかかりますが、Claude Code on the Webなら月額固定でいくらでも指示を出せます。
ただし、Proプランには利用量の制限(約45メッセージ/5時間)がある点に注意してください。コーディング作業で頻繁に使う場合は、Max 5x($100/月)を検討する価値があります。Anthropicの試算では、「月のAPI換算利用額が$100を超えるなら、Max 5xの方がお得」としています。
【5ステップ】Claude Code on the Webの始め方

セットアップは驚くほど簡単です。5分もあれば完了します。
ステップ1:claude.ai/codeにアクセス
ブラウザで claude.ai/code を開きます。Claudeのアカウントでログインしていない場合は、先にログインしてください。無料アカウントでは利用できないため、Pro以上のプランへのアップグレードが必要です。
ステップ2:GitHubアカウントを接続
初回利用時にGitHubアカウントの接続を求められます。「Connect GitHub」をクリックし、GitHubの認証画面でアクセスを許可してください。
GitHubを使っていない方は、この機会にアカウントを作成しましょう。GitHubはソースコードの管理サービスで、無料で利用できます。Claude Code on the WebはGitHubのリポジトリ(プロジェクト)に対して作業するため、GitHubアカウントは必須です。
ステップ3:Claude GitHubアプリをインストール
GitHubアカウント接続後、Claudeが作業するリポジトリにClaude GitHubアプリをインストールします。「すべてのリポジトリ」または「選択したリポジトリ」のどちらかを選べます。セキュリティの観点から、必要なリポジトリだけを選択することをお勧めします。
ステップ4:デフォルト環境を選択
Claude Code on the Webでは、コードが実行されるクラウド環境を選択できます。ほとんどの場合、デフォルトの汎用イメージで問題ありません。この環境には以下がプリインストールされています。
- プログラミング言語:Python 3.x、Node.js(最新LTS)、Ruby 3.3、PHP 8.4、Java(OpenJDK)、Go、Rust、C++
- パッケージマネージャー:pip、poetry、npm、yarn、pnpm、bun、gem、bundler
- データベース:PostgreSQL 16、Redis 7.0
- ビルドツール:Maven、Gradle、GCC、Clangなど
つまり、主要な開発環境はすべて揃っている状態です。「環境構築で半日潰れた」という経験がある開発者にとっては、これだけでも大きな価値です。
ステップ5:タスクを送信
あとは、テキストボックスにやりたいことを入力するだけです。
たとえば、こんな指示を出してみましょう。
src/auth/login.tsにある認証バグを修正して。
ユーザーがパスワードを間違えた時に、エラーメッセージが表示されずに
画面が真っ白になる問題を解決してほしい。
送信すると、Claudeが自動的にリポジトリをクローンし、環境をセットアップし、問題を分析して修正を始めます。修正が完了すると通知が届き、diffビューで変更内容を確認できます。
タスク送信後の流れ:Claudeが裏側でやっていること

「指示を出したら、あとは待つだけ」とは言いましたが、裏側では何が起きているのか知っておくと、より効果的な指示が出せるようになります。
6ステップの自動処理
タスクを送信すると、以下の処理が自動的に行われます。
- リポジトリのクローン:GitHubのリポジトリがAnthropic管理の仮想マシン(VM)にコピーされます
- 環境セットアップ:必要なパッケージのインストール、セットアップスクリプトの実行
- ネットワーク設定:設定に基づいてインターネットアクセスを構成(デフォルトは制限付き)
- タスク実行:Claudeがコードを分析し、変更を加え、テストを実行し、動作を確認
- 完了通知:タスク完了時にブラウザ通知またはモバイルアプリで通知
- 結果の提示:変更がブランチにプッシュされ、プルリクエスト作成の準備が完了
重要なのは、これらすべてがAnthropicのクラウド上で実行されるという点です。あなたのPCには一切影響がありません。タスクを送信した後にブラウザを閉じても、PCの電源を切っても、Claudeは黙々と仕事を続けます。
diffビューで変更を確認する
Claudeが変更を完了すると、diffビューで「何がどう変わったか」を視覚的に確認できます。左側にファイルリスト、右側に各ファイルの変更内容(追加された行は緑、削除された行は赤)が表示されます。
diffビューでできることは以下の通りです。
- ファイルごとに変更を確認:どのファイルの何行目が変更されたか一目瞭然
- 特定の変更にコメント:「ここはこう変えてほしい」とピンポイントで指示
- 複数回の修正サイクル:コメント→Claudeが修正→再確認を繰り返せる
これは、従来のコードレビューのプロセスと同じです。違いは、レビュー相手がAIだという点だけ。あなたが「ここを直して」と言えば、Claudeは即座に修正を反映します。人間のエンジニアに依頼するときのような「忙しくて対応できない」ということがありません。
ターミナルとWebを行き来する:ハイブリッドワークフロー

Claude Code on the Webの大きな特徴の一つが、ターミナル版との連携機能です。「Web版かターミナル版か」の二者択一ではなく、状況に応じて使い分け、さらにはセッションを引き継ぐことができます。
ターミナルからWebへ:--remoteフラグ
ターミナル版Claude Codeを使っている開発者は、--remoteフラグを使ってWebセッションを起動できます。
claude --remote "src/auth/login.tsの認証バグを修正して"
このコマンドを実行すると、claude.ai上に新しいWebセッションが作成され、タスクはクラウドで実行されます。ローカルのターミナルは自由になるので、他の作業を続けられます。
さらに、複数のタスクを並列実行することも可能です。
claude --remote "テストの不安定な部分を修正"
claude --remote "APIドキュメントを更新"
claude --remote "ロガーを構造化出力にリファクタリング"
各コマンドが独立したWebセッションを作成し、同時並行で実行されます。1人で3人分の仕事をClaudeにお願いしているイメージです。
WebからターミナルへTeleport(テレポート)
逆に、Web版で作業したセッションをターミナルに引き継ぐ(テレポートする)こともできます。方法はいくつかあります。
/teleportコマンド:Claude Codeのターミナルで/teleport(または/tp)を実行し、Webセッションを選択claude --teleport:コマンドラインから直接実行- Webインターフェースから:「Open in CLI」ボタンをクリック
テレポートすると、Claudeは自動的に正しいリポジトリにチェックアウトし、リモートセッションのブランチをフェッチし、会話履歴をすべてターミナルに読み込みます。つまり、Webで始めた作業の続きをローカルで行えるのです。
これが便利なのは、たとえば以下のようなシナリオです。
- 朝、スマホのClaudeアプリから「この機能を実装して」とWeb版に指示
- 通勤中にClaudeが作業。スマホで進捗を確認
- オフィスに着いたら、PCのターミナルにセッションをテレポート
- Claudeの作業結果をローカルで微調整し、本番にデプロイ
場所を選ばない、デバイスを選ばない開発フローが実現するわけです。
プランモードとの組み合わせ
複雑なタスクの場合、いきなりClaudeに実装を任せるのではなく、まず「計画」を立てさせるのが効果的です。
claude --permission-mode plan
プランモードでは、Claudeはファイルの読み取りとコードベースの探索だけを行い、実際のコード変更はしません。Claudeと方針を相談し、計画に納得したら、リモートセッションで実行を開始します。
claude --remote "docs/migration-plan.mdの移行計画を実行して"
このパターンなら、戦略は人間がコントロールし、実行はClaudeが自律的に行うという理想的な分業ができます。
スケジュールタスク:PCオフでもClaudeが自動実行

Claude Code on the Webの中でも、最も「経営者を驚かせる」機能がスケジュールタスクです。これは定期的に繰り返す作業をClaudeに自動実行させる機能で、cronジョブ(Linuxの定期実行機能)のAI版と言えます。
スケジュールタスクの3つの種類
Claude Codeには3種類のスケジュール方法があります。
| 種類 | 実行場所 | PCの電源 | 永続性 | ローカルファイル |
|---|---|---|---|---|
| クラウドタスク | Anthropicクラウド | オフでもOK | ✅ 再起動後も維持 | ❌(GitHubから都度クローン) |
| デスクトップタスク | 自分のPC | オンが必要 | ✅ 再起動後も維持 | ✅ アクセス可能 |
| /loopコマンド | 自分のPC | オンが必要 | ❌ セッション内のみ | ✅ アクセス可能 |
一番おすすめなのは「クラウドタスク」です。Anthropicのサーバー上で実行されるため、あなたのPCの電源がオフでもWi-Fiが切れても、Claudeは確実にタスクを実行します。
クラウドスケジュールタスクの具体的な活用例
では、具体的にどんな自動化ができるのか。以下は実際に使えるシナリオです。
- 毎朝のPRレビュー:オープンなプルリクエストを毎朝9時にレビューし、コメントを追加
- 夜間のCI失敗分析:CIの失敗を夜間に分析し、朝までにサマリーを作成
- ドキュメントの自動同期:PRがマージされるたびにドキュメントを更新
- 週次の依存関係チェック:使用しているライブラリの脆弱性を毎週チェック
- SEO対策の自動化:メタタグやスキーママークアップの生成・更新
たとえば、「毎週月曜の朝9時に、GitHubのオープンPRをすべてレビューして」というスケジュールを設定しておけば、月曜の朝にオフィスに着いた時には、すべてのPRにClaudeのレビューコメントが付いている状態です。
スケジュールタスクの作成方法
スケジュールタスクの作成方法は3つあります。
- Webインターフェース:claude.ai/code/scheduled にアクセスして設定
- デスクトップアプリ:Claude DesktopのScheduleページから設定
- CLI:ターミナルで
/scheduleコマンドを実行
Webからの作成が最も直感的です。スケジュール(実行間隔)とプロンプト(Claudeへの指示)を入力し、対象リポジトリを選択するだけ。技術的な知識は不要です。
MCP(Model Context Protocol)連携
クラウドスケジュールタスクは、Webアカウントで設定されたMCPサーバーを自動的に引き継ぎます。これにより、Claudeは以下のような外部サービスと連携できます。
- Slack:タスク完了時に通知を送信
- Linear:課題管理ツールと連携してチケットを更新
- Google Drive:ドキュメントの読み書き
- 各種API:カスタムAPIとの連携
しかも、ローカルの.envファイルやAPIキーをクラウドに公開する必要がないという安全設計になっています。環境変数はクラウド環境の設定画面から安全に登録できます。
セッション管理と共有:チームでの活用

Claude Code on the Webは個人利用だけでなく、チームでの開発にも対応しています。セッションの管理・共有機能を活用すれば、チームの生産性が大幅に向上します。
セッションの共有
Web版Claude Codeで作成したセッション(Claudeとのやり取りや変更内容)は、リンクを共有するだけで他のメンバーに見せることができます。共有の範囲はアカウントタイプによって異なります。
| アカウントタイプ | 共有範囲 | リポジトリアクセス検証 |
|---|---|---|
| Enterprise / Teams | プライベート or チーム(組織内メンバー) | ✅ デフォルトで有効 |
| Pro / Max | プライベート or パブリック(ログインユーザー全員) | ❌ デフォルトでは無効(手動で有効化可能) |
注意点:セッションにはプライベートリポジトリのコードや認証情報が含まれる可能性があります。共有前に機密コンテンツがないか必ず確認してください。特にPro/Maxプランでパブリック共有する場合は要注意です。
セッションの整理
セッションが増えてくると管理が大変になります。Claude Code on the Webでは以下の整理方法が用意されています。
- アーカイブ:完了したセッションをアーカイブしてリストから非表示に。必要に応じてフィルタで再表示可能
- 削除:不要なセッションを完全に削除(取り消し不可)
これにより、「今取り組んでいるタスク」だけが常にセッションリストの上部に表示され、作業効率が維持できます。
クラウド環境のカスタマイズ:セットアップスクリプトと環境変数

デフォルトの汎用イメージで多くのプロジェクトに対応できますが、特殊な環境が必要な場合はカスタマイズも可能です。
セットアップスクリプト
セッション開始時に自動実行されるスクリプトを設定できます。たとえば、プロジェクト固有のツールをインストールしたり、データベースの初期データを投入したりする処理を自動化できます。
# セットアップスクリプトの例
npm install
npm run db:setup
npm run seed
これを設定しておけば、タスクを送信するたびにClaudeが「環境準備→セットアップスクリプト実行→タスク実行」を自動で行います。
環境変数の設定
APIキーやデータベースの接続情報など、環境固有の設定を環境変数として登録できます。これらはクラウド環境の設定画面から安全に管理され、セッションごとに自動的に読み込まれます。
セキュリティ面でのメリットは、ローカルPCの.envファイルをクラウドに公開する必要がないこと。環境変数はAnthropicの安全な環境で管理されるため、情報漏洩のリスクが軽減されます。
ネットワーク設定
クラウド環境のネットワークアクセスは3段階で制御できます。
- インターネットなし:完全に隔離された環境。機密性の高いプロジェクト向け
- 制限付き(デフォルト):npm/pipなどのパッケージレジストリにはアクセス可能だが、任意のURLへのアクセスは制限
- 完全なインターネットアクセス:外部APIとの連携が必要な場合に使用
デフォルトの「制限付き」設定で十分なケースがほとんどです。外部APIを叩く必要がある場合のみ、「完全なインターネットアクセス」に変更してください。
モバイル対応:スマホから開発を管理する時代

Claude Code on the Webは、iOSおよびAndroidのClaudeアプリからも利用できます。これにより、以下のことがスマートフォンから可能になります。
- タスクの送信:外出先から「このバグを直して」と指示
- 進捗の確認:Claudeの作業状況をリアルタイムで確認
- フィードバックの送信:「ここを変更して」と追加指示
- プルリクエストの作成:完成したコードのPRをスマホから作成
考えてみてください。電車の中で「この機能を作って」と指示を出し、オフィスに着いた頃にはコードが完成している。これが現実になっています。
特に経営者にとっては、「開発チームの進捗をスマホで確認し、方向性を指示する」というマネジメントスタイルが実現します。コードが読めなくても、diffビューの変更量やClaudeのサマリーで「何がどう変わったか」は把握できます。
中小企業がClaude Code on the Webを活用する5つのシナリオ

「うちはIT企業じゃないし、コーディングなんて……」と思うかもしれません。しかし、Claude Code on the Webは純粋なコーディング以外にも幅広く活用できます。
シナリオ1:社内ツールの開発・修正
「Excelで管理していた顧客リストをWebアプリにしたい」「社内の予約システムを改善したい」——こうした要望を、Claude Code on the Webなら外注せずに実現できます。
GitHubにリポジトリを作り、「顧客管理のWebアプリを作って。顧客名・電話番号・最終連絡日を管理し、検索・並び替えができるようにして」と指示するだけ。Claudeがフロントエンドからバックエンドまで一括で構築します。
シナリオ2:Webサイトの更新・メンテナンス
自社サイトのデザイン修正、ページ追加、レスポンシブ対応——これらの作業を制作会社に依頼すると、1回数万円。月に何度もあれば大きなコストです。
Claude Code on the Webなら、「お問い合わせページのフォームにチェックボックスを追加して」「スマホで見たときにメニューが崩れるのを直して」といった修正を自分で指示・実行できます。
シナリオ3:データ分析ツールの自動化
売上データや顧客データの分析を毎月手作業でやっていませんか?Claude Codeのスケジュールタスクを使えば、毎月1日にCSVを読み込み、売上推移グラフを生成し、レポートを作成するという一連の作業を自動化できます。
シナリオ4:APIとの連携開発
「ECサイトの在庫データをLINE公式アカウントに連携したい」「会計ソフトのデータをGoogleスプレッドシートに自動転記したい」——こうしたAPI連携の開発も、Claude Code on the Webの得意分野です。
従来なら開発者を雇うか外注するしかなかった連携開発を、AIが代行してくれます。
シナリオ5:テストの自動化
「リリースするたびに手動で動作確認している」という状態は、品質リスクとコストの二重苦です。Claude Code on the Webにテストコードの作成を任せれば、自動テストの基盤を一気に構築できます。
「このプロジェクトの主要機能に対するテストコードを全部書いて」と指示するだけで、Claudeがコードベースを分析し、適切なテストケースを生成します。
セキュリティと安全性:企業利用で気になるポイント

「クラウド上にコードを預けて大丈夫?」という懸念は当然あります。Claude Code on the Webのセキュリティ対策を整理します。
コードの隔離
各セッションはAnthropic管理の隔離された仮想マシン上で実行されます。他のユーザーの環境とは完全に分離されており、セッション終了後にVMは破棄されます。
ネットワーク制御
デフォルトでインターネットアクセスは制限されています。Claudeが外部にデータを送信することはありません(完全なインターネットアクセスを明示的に許可しない限り)。
データの取り扱い
Anthropicは、Enterpriseプランのお客様のコンテンツをモデルのトレーニングに使用しないことをデフォルトで保証しています。Pro/Maxプランでもオプトアウト設定が可能です。
Enterpriseレベルのセキュリティ機能
Enterprise/Teamプランでは、以下のセキュリティ機能が追加で利用できます。
- SSO(シングルサインオン):企業のID管理システムと連携
- 監査ログ:誰がいつ何をしたかの完全な記録
- ドメインレベルの管理:組織全体のポリシー設定
- リポジトリアクセス検証:共有セッションのアクセス制御
「情報セキュリティ10大脅威」でシャドーAIが3位にランクインしている昨今、企業が公式に採用するAIツールとしてClaude Code on the Webを選ぶのは合理的な判断です。
まとめ:インストール不要のAI開発エージェントが、ビジネスの常識を変える

Claude Code on the Webは、「AIにコーディングを任せる」というコンセプトを、誰でも使えるレベルまでハードルを下げたサービスです。
ここまでの内容を振り返ります。
- インストール不要:ブラウザを開いてGitHubを接続するだけで利用開始
- PCオフでもOK:タスクはAnthropicのクラウドで実行。送信後は放置していい
- スケジュール自動化:毎日・毎週の定期作業をClaudeが自動実行
- モバイル対応:スマホから指示・確認・フィードバックが可能
- ターミナルとの連携:Web↔ターミナル間でセッションの引き継ぎが可能
- 月額$20から:外注費と比較して圧倒的にコストパフォーマンスが高い
「プログラミングはエンジニアの仕事」——その常識は、もう古いかもしれません。Claude Code on the Webは、コードが書けない人でも、AIに指示を出すだけで開発ができる世界を切り拓いています。
まずは claude.ai/code にアクセスして、「今の業務で困っていること」をClaudeに相談してみてください。きっと、「こんなことまでできるのか」と驚くはずです。
AI活用でお困りの方は、株式会社静岡マーケティングにお気軽にご相談ください。Claude Coworkの導入支援から活用戦略まで、一貫してサポートいたします。

