NEXTSCAPE blog

株式会社ネクストスケープの社員による会社公式ブログです。ネスケラボでは、社員が日頃どのようなことに興味をもっているのか、仕事を通してどのような面白いことに取り組んでいるのかなど、会社や技術に関する情報をマイペースに紹介しています。

MENU

Claude Code on the Webを触ってみた

はじめに

株式会社ネクストスケープ Chief Technology Office所属の小野塚です。

タイトルのClaude Code on the Web、ちょうど発表されたばかりなので軽く試した内容を書いてみたいと思います。

2025年10月21日現在ではベータ版、かつProまたはMaxユーザーのみの機能となりますのでご注意ください(筆者はProプランを契約しています)。

設定

ブラウザでClaudeにログインし、いつものプロンプト入力画面において右側メニューに「</>」というアイコンがあると思うのでそれをクリックします。

画像
GitHubへのログインを行った後、以下の画面に遷移します。
これがClaude Code on the Webの画面です。
(コマンドプロンプト版でも出てきますが、右の宇宙人のようなものはなんでしょうね。。)


画面を見るにGitHubからプロジェクトを読み込む前提のようですね。右側のウィンドウの「Select repository」をクリックすると以下のような表示が出てきますので「GitHubアプリをインストール」をクリックします。


以下のダイアログが表示され。。


別画面でGitHubにログインします。
そしてログイン後にGitHubの設定画面に遷移し、Claudeにアクセスを許可するために必要な設定を行います。

依頼実行

これらの作業が一通り終わりましたら、再度ブラウザの再読み込みを行えば先ほどの画面でGitHub内のリポジトリが選択できるはずです。
今回はGitHubがベースになるので事前にVisual StudioでWebアプリのサンプルを作成し、GitHubにpushしておきます。
その上でいつものToDoアプリへの改修依頼を投げます。
「ToDoリスト機能の仕様を作成してください。タスクの追加、完了チェック、削除機能を含めて、基本的なToDoアプリとして動作するようにしたいです。要件から実装タスクまで段階的に作成してください。」
すると右側にセッション画面が開き、ローカルのClaude Codeと同様ToDoアプリ作成のための作業が進んでいきます。
上記プロンプト通り、まずは解析後に仕様書が作成され、それに基づき実装が行われていきます。


ちょっと気になったこととしてはClaude Codeに限らず他のツールでも都度レビューといいますか、生成された内容についての確認があったのですが、今回のClaude Code on the Webについては一気に実装まで進んでしまいました。
これが今回のプロンプトに限ったものなのかはまだわからずですが、皆さんもご注意ください。


実行も一応依頼してみたのですが、そもそも環境上に.NET SDKがインストールされていないため、実行ができないとのこと。
他の言語であれば実行できるかどうかはまだ未確認です(ちょっと難しそうな気がしますが。。)。

セッション画面の各機能

では、もう少し機能を見てみましょう。セッション画面の下側は以下のようになっています。
一番下の入力欄はコマンドラインの入力欄とのこと。
その上の部分は一番左がブランチ、そして「Create PR」ボタンと、「Open in CLI」ボタンの3つ。


「Create PR」ボタンをクリックしてみましょう。
すると別画面でGitHubのプルリクエストの画面が表示され、ここでプルリクエストの作成が行えます。


もう1つの「Open in CLI」はなんでしょうか。
試しにクリックすると以下の文字列がクリップボードにコピーされます。
「claude --teleport session_~」
※実際の「~」はセッションを表す英数字の羅列です

これは何かといいますと、ローカルPCで作業する場合にコマンドプロンプトでこの内容をペーストすると直前までのon the Webの作業状態を引き継いで作業が行えるというものです。
以下のようにon the Webのセッション画面の内容がそのまま表示されるのですが、これはなかなか興味深い内容でした。

あとはせっかくのWeb版ですのでスマホでの表示も見てみます。
以下がそれです。PCブラウザのセッションウィンドウが表示される形になりまして、「Create PR」ボタンや「Open in CLI」等、そのままですね。
これで電車の中でもClaude Codeが使えるわけです。

その他

あとはclaude.mdは参照・利用できるようです。

「/help」等のClaude Codeのコマンドについては私が試しに「/help」と入れると応答が返ってきませんでした。少なくてもコマンドのサジェスト機能は無さそうです。

同じく最近発表されたスキル機能についてはまだ未確認ではあるものの、私が先ほどまで試した限りではうまく動かない雰囲気でした(設定・実行できたらスミマセン。。)。

このあたりはon the Webとしての制限・制約があるような気がしておりまして、ローカルPCでのClaude Codeと完全にイコールの使い勝手では無さそうです。

ただ、発表されたばかり、ベータ版ということもありまして早々に色々と改善されるのではと予想しております。

最後に

発表されたばかりということもあり、少々使い勝手において気になる点もあるものの、社内でも評判の高いClaude CodeがWebブラウザで気軽に扱えるというのはユーザーにとっては非常に便利なものではないでしょうか。

家でPCで作業をしていて、電車内でもコーディング、そして職場でも状況を引き継いで再度PCでコーディング、そういったシームレスな作業が可能になります。

当社ネクストスケープはこのように生成AIを始めとした新しい技術・知識を日々取り入れており、Webサイト、スマホアプリ、Hololensアプリの開発をはじめ、CMSを利用したサイトの新規構築やリニューアルなど、お客様のニーズに幅広く対応いたします。お困りのことがございましたら、いつでもお気軽にお問い合わせください。

nextscape.net

(以下当社お問合せフォーム)

Microsoft Forms

当社では一緒に働いてくれる仲間を募集しています。是非以下のサイトよりお申込みください。

recruit.nextscape.net