メインコンテンツへスキップ
Studioセットアップガイド AIアシスタントにセットアップを任せる

AIアシスタントにStudioをセットアップしてもらう

パソコン上のAIコーディングアシスタント(Claude Code、Codex、Cursorなど)が、Studioをオンラインに公開する作業を代わりに進めてくれます。用意された指示文を貼り付けると、アシスタントがStudio付属のセットアップガイドを読み、WebホスティングとCloudflareアカウントのどちらが合うかを一緒に検討し、何かを変更する前に確認を求めます。

こんな場合におすすめ
パソコン上でコマンドを実行できるAIコーディングアシスタントをすでに使っている方。Webホスティング上のStudioでも、Cloudflare上のStudioでも、どちらにも向いています。
必要なもの
Studioを利用できるアカウントでサインインした、Windows版またはMac版のMaxisnap;パソコン上のAIコーディングアシスタント;ホスティングのログイン情報、またはCloudflareアカウント。
所要時間
ほぼおまかせ:アシスタントの質問に答え、変更のたびに承認します。
できあがるもの
ほかのセットアップ方法と同じStudioが、Webホスティング上、またはご自身のCloudflareアカウント内で動きます。

アシスタントが従う指示

Studioのダウンロードには、どれもAIアシスタント向けに書かれた指示書が入っています。指示書には、Studioの両方のエディション、インストールの正確な手順、非公開にしておくべきもの、結果の確認方法が説明されています。また、アシスタントに次のことを伝えています:

  • サーバーやアカウントへのアップロード、デプロイ、変更を行うたびに、事前に確認を求め、何を変更するのかを正確に伝えること。
  • すでにあるもの(Webサイトのファイル、DNSレコード、Worker、バケット、データベース)を、削除、上書き、名前変更しないこと。Studioは新しいものを追加するだけです。
  • 作成するファイルに、キーやパスワードを入れないこと。
  • 最後にStudioのアドレスと管理者キーを伝え、Maxisnapを接続できるようにすること。

パソコンにStudioを用意する

  • Windowsの場合:Maxisnapで「設定 → アカウント → Maxisnap Studio セットアップウィザード」を開き、「はじめましょう」、続いて「ダッシュボードをダウンロード」をクリックします。MaxisnapがStudioのZIPファイルを「ダウンロード」フォルダーに保存し、そのフォルダーを開きます。
  • Macの場合:Maxisnapで「Settings → Welcome & Help → Studio Setup Guide」を開き、「Get Started」、続いて「Download Dashboard」をクリックします。MaxisnapがStudioのZIPファイルを「ダウンロード」フォルダーに保存します。

ZIPファイルを展開します。Windowsでは、右クリックして「すべて展開」を選びます。Macでは、ダブルクリックします。

展開したフォルダーの場所をコピーしておきます。手順3で貼り付けます。Windowsでは、フォルダーを右クリックして「パスのコピー」を選びます。Macでは、フォルダーを選択して Option+Command+C を押します。

AIアシスタント向けの指示書ファイルは、そのフォルダーにあります:

AGENTS.md

表示される画面 展開したStudioフォルダー:3つのフォルダー(cloudflare、docs、snaps)、Start Hereページ、AIアシスタント向けの指示書。

必要に応じて、ブランド設定を確定する

「Maxisnap Studio - Start Here.html」をダブルクリックし、ロゴ、カラー、フォントをデザインして、「Lock in my branding」をクリックします。アシスタントがその設定を使います。この手順は省略して、あとからダッシュボードの「Branding」でブランド設定を変更することもできます。

指示文をコピーする

この指示文をコピーし、山かっこで囲まれた行をStudioフォルダーの場所に置き換えて、アシスタントに貼り付けます。

Set up Maxisnap Studio for me.

Maxisnap Studio is a self-hosted dashboard for the screenshots and screen recordings the Maxisnap desktop app uploads: a private library plus branded share links. It comes in two editions with the same features: a PHP app for ordinary web hosting, and a Cloudflare Worker that uses R2 and D1.

Everything is in this folder on my computer:
  <the folder where I extracted the Studio download>

Start by reading AGENTS.md in that folder. It explains both editions, the exact install steps, what must stay private, and how to check the result.
If I locked in my branding, it is in snaps.zip; AGENTS.md says what to do if it is missing.

Goal: Work out with me whether the PHP edition (my web hosting) or the Cloudflare Workers edition fits my setup, then install it.

Rules:
- Ask me before you upload, deploy, or change anything on a server or in an account, and tell me exactly what you will change.
- Never delete, overwrite or rename existing website files, DNS records, Workers, buckets or databases. Studio only adds new things.
- Keep keys and passwords out of files you create and out of chat transcripts where you can.
- When it works, give me the Studio address and the Admin key so I can connect the Maxisnap app (on Windows, Settings, Account, Maxisnap Studio setup wizard, step 4; on a Mac, Settings, Welcome & Help, Studio Setup Guide, “I already have a dashboard”).

アシスタントの質問に答える

  1. Webサイトの場所を伝えます。Webホスティング(cPanel、hPanel、Pleskなど)か、Cloudflareか、まだどこにもないか、のいずれかです。Webサイトがない場合は、Cloudflareエディションが安心な選択です。
  2. Webホスティングの場合は、何をどこにアップロードするかをアシスタントが案内します。ホスティングへのアクセスを渡せば、アシスタントが代わりにアップロードします。
  3. Cloudflareの場合は、アシスタントからCloudflare APIトークンを求められます。Cloudflareの「My Profile → API Tokens」で、アシスタントが示す権限を付けたトークンを作成し、ご自身でターミナルに貼り付けてください。

Cloudflareアカウント、ストレージ、トークンの手順は、無料のCloudflareアカウントのガイドで確認できます。

「はい」と答える前に、実行計画を確認する

Cloudflareにデプロイする前に、アシスタントが実行計画を表示します。「Will create」には1つのWorker、1つのR2バケット、1つのD1データベースが表示され、「Will not touch」にはアカウント内のそれ以外のすべてが表示されます。Webホスティングの場合は、どのフォルダーを追加するかをアシスタントが伝えます。一覧の内容が正しいと確認できたときだけ、「はい」と答えてください。

表示される画面 アシスタントによる、作成するものと手を付けないものの要約。「はい」の返事を待っている状態です。

Maxisnapを接続して試す

うまくいくと、アシスタントからStudioのアドレスと管理者キーが渡されます。キーは、パスワードマネージャーのような安全な場所に保管してください。

  • Windows版Maxisnap:「設定 → アカウント → Maxisnap Studio セットアップウィザード」を開き、「はじめましょう」をクリックします。ステップ4の「Maxisnap を接続」まで、「次へ」をクリックして進みます。Studioのアドレスとキーを貼り付け、「接続をテスト」、「次へ」の順にクリックして、最後のページで「完了して保存」をクリックします。セットアップで表示された管理者キーを使えます。ダッシュボードの「People & access」にあるアップロードコードも使えます。
  • Mac版Maxisnap:「Settings → Welcome & Help → Studio Setup Guide」を開き、「I already have a dashboard」を選びます。Studioのアドレスとキーを貼り付け、「Test Connection」、「Next」、「Finish & Save」の順にクリックします。

何かをキャプチャして、エディターで「アップロード」をクリックします。Windowsでは、Ctrl+Alt+7を押すと範囲をキャプチャして、すぐにアップロードします。共有リンクはクリップボードにコピーされます。

次のステップ:ダッシュボードの「People & access」でチームメンバーを追加し(全員にそれぞれ専用のコードとロールが付きます)、ロゴやカラーはいつでも「Branding」で変更できます。

うまくいかない場合

アシスタントが、ファイルを開けない、またはコマンドを実行できないと言っている

パソコン上で動き、フォルダー内で作業できるコーディングアシスタント(Claude Code、Codex、Cursorなど)を使ってください。ブラウザーのタブで開くチャットでは、Studioフォルダーを見ることも、デプロイツールを実行することもできません。

アシスタントが指示書ファイルを見つけられない

指示文に貼り付けたフォルダーを確認してください。ZIPファイルではなく、展開したStudioフォルダーである必要があります。そのフォルダーの中に、AIアシスタント向けの指示書ファイルが入っています。

アシスタントが、Node.jsが入っていない、またはバージョンが古すぎると言っている

CloudflareのデプロイツールにはNode.js 20以上が必要です。nodejs.orgから現在のLTS版をインストールするか、実行する内容をアシスタントに説明してもらったうえでインストールを任せ、そのあと最初からやり直してください。Webホスティング上のStudioには、Node.jsは不要です。

アシスタントから、トークンやパスワードをチャットに貼り付けるよう求められた

コマンドから求められたときに、代わりにターミナルへ貼り付けてください。そうすれば、チャットの履歴に残りません。すでにCloudflareのトークンをチャットに貼り付けてしまった場合は、Studioが動き出したあとで、Cloudflareの「My Profile → API Tokens」から削除し、次に必要になったときに新しく作成してください。

アシスタントが、何かを削除、置き換え、または名前変更しようとしている

「いいえ」と答えてください。Studioは新しいものを追加するだけです。指示書でも、既存のWebサイトのファイル、DNSレコード、Worker、バケット、データベースを削除、上書き、名前変更しないよう、アシスタントに指示しています。代わりに、新しい名前を選ぶよう頼んでください。

アシスタントが、ブランド設定のファイルが見つからないと言っている

まだブランド設定を確定していません。「Maxisnap Studio - Start Here.html」を開いてブランドをデザインし、「Lock in my branding」をクリックするか、Maxisnapのデザインのまま進めるようアシスタントに伝えてください。ブランド設定は、あとからダッシュボードの「Branding」で変更できます。

アシスタントの最終チェックが401または404を返す

{"error":"unauthorized"}

401は、キーが間違っているという意味です。セットアップで表示された管理者キーを、そのまま使ってください。404、または短い応答の代わりにWebページが返ってきた場合は、アドレスかフォルダーが間違っているか、Webホスティングであれば、Studioの.htaccessルールが無視されていることを意味します。

Cloudflareのデプロイが途中で止まった

アシスタントに、同じフォルダーから同じデプロイコマンドをもう一度実行するよう頼んでください。コマンドはdeployment.jsonを読み取り、止まったところから続きを実行するので、何も二重に作成されません。

アシスタントから受け取ったアドレスとキーで、Maxisnapが接続できない

アドレスは、Studioのダッシュボードを開くときのアドレスです。先頭は次のとおりです:https://, 例:https://yourcompany.com/snaps. キーは、前後に空白を入れずにコピーしてください。各メッセージの意味は、既存のStudioに接続するためのガイドで説明しています。

解決しませんでしたか?

メールをお送りください。担当者が、通常は1営業日以内に返信します。次の情報があると、一度の返信でお答えしやすくなります:

  • 選んだセットアップ方法と、今どの手順にいるか。
  • 画面のスクリーンショット(エラーメッセージがある場合は全文が分かるもの)。
  • Studioをどこに設置するか:新しいCloudflareアカウントか既存のCloudflareアカウントか、またはWebホスティング会社の名前。
  • Maxisnapのバージョン:Windowsでは「設定 → バージョン情報」、Macでは「Maxisnap → About Maxisnap」で確認できます。

管理者キー、Cloudflareのキー、パスワードは送らないでください。サポートには必要ありません。

ほかのセットアップガイド