無料のCloudflareアカウントにStudioを設置する

Cloudflareアカウントを作成する

1. ブラウザーでCloudflareのサインアップページを開きます：dash.cloudflare.com/sign-up
2. 毎日確認するメールアドレスを使ってください。仕事用のアドレスでも問題ありません。強力なパスワードを選び、安全な場所に保管してください。
3. メールアドレスを確認します。Cloudflareからリンクが送られてきます。先に進む前にクリックしてください。クリックしないと、一部の手順が拒否されます。届かない場合は、迷惑メールフォルダーを確認してください。
4. Webサイトの追加に関するCloudflareの質問は、スキップできます。Webサイトは必要ありません。

ストレージを有効にする

スクリーンショットと動画は、Cloudflare R2に保存されます。アカウントごとに一度だけ有効にしてください：

1. Cloudflareダッシュボードで「Storage & databases → R2 → Overview」を開きます。
2. Cloudflareのチェックアウトを完了して、アカウントにR2を追加します。Cloudflareから求められた場合は、カードまたはPayPalを追加します。

Studioのダッシュボードで、使用中のストレージ量を確認できます。2026年10月に確認したCloudflareのR2ドキュメントには、R2は毎月の無料利用分が含まれていて無料で使い始められること、そして利用分は月ごとに請求されることが記載されています。

パソコンに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では、ダブルクリックします。

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

作業をAIアシスタントに任せる

1. AIコーディングアシスタントを開きます。Claude Code、Codex、Cursorなど、パソコン上でコマンドを実行できるものを使います。
2. AIアシスタントを使ったセットアップのガイドから用意済みの指示文をコピーし、山かっこで囲まれた行をStudioフォルダーの場所に置き換えて、貼り付けます。
3. Webサイトがないこと、そして無料のCloudflareアカウントでStudioのCloudflareエディションを使いたいことを伝えます。アシスタントはStudioフォルダーにある指示書ファイルを読み、各手順を実行する前に説明します。

用意済みの指示文を入手する。

デプロイツールを使うには、パソコンにNode.js 20以上が必要です。入っているかどうかは、アシスタントが確認できます。指示書は、アシスタントに対して、何かを作成する前にあなたに確認すること、アカウントにすでにあるものを削除したり置き換えたりしないことを求めています。

アシスタントに求められたら、Cloudflareのキーを作成する

デプロイには、アカウント内にStudioを作成する権限が必要です。その権限は、Cloudflare APIトークンで与えます。トークンは、この作業専用のパスワードのようなものです。

1. Cloudflareで「My Profile → API Tokens」を開き、「Create Token」をクリックして、カスタムトークンの作成を選びます。
2. 次の4つの権限を追加します：Account Settings Read、Workers Scripts Edit、Workers R2 Storage Edit、D1 Edit。
3. 「Continue to summary」、続いて「Create Token」をクリックします。Cloudflareはトークンを一度しか表示しないので、すぐにコピーしてください。
4. アシスタントから求められたら、トークンはチャットではなく、ご自身でターミナルに貼り付けてください。

CloudflareのAPI Tokensページを開きます。

Studioが動き出したら、トークンは削除できます。Studioはそのまま動き続けます。あとで更新または削除する場合は、同じ権限を付けた新しいトークンが必要です。

Studioのアドレスを決める

1. アシスタントに、小文字の英字、数字、ハイフンを使ったStudioの名前を伝えてください。デフォルトはsnapsです。
2. Cloudflareアカウントにまだworkers.dev名がない場合は、実行計画がその名前を求め、アシスタントがあなたに尋ねます。この名前はアカウント内のすべてで共有され、あとから変更しにくいため、会社名を使うとよいでしょう。

アドレスは次のような形になります：snaps.yourcompany.workers.dev

ご自身のドメインは、あとから何も失わずに追加できます。

実行計画を確認してから、Studioを作成する

「はい」と答えるまで、何も作成されません。アシスタントはまず実行計画を作成して、その内容を表示します。「Will create」には、1つのWorker、1つのR2バケット、1つのD1データベースのほか、workers.dev名が新規の場合はその名前が表示されます。「Will not touch」には、アカウント内のそれ以外のすべてが表示されます。

1. 実行計画の内容に問題がなければ、アシスタントに進めるよう伝えてください。Studioの作成には約一分かかります。
2. デプロイが途中で止まった場合は、同じコマンドをもう一度実行すれば、止まったところから続きが実行され、何も二重に作成されません。

管理者キーを保管する

1. 完了すると、デプロイによってStudioのアドレスと管理者キーが一度だけ表示されます。キーは、パスワードマネージャーのような安全な場所に保管してください。このキーでダッシュボードにサインインします。キーを知っている人は、誰でもStudioを使えます。
2. デプロイは、cloudflareフォルダーにdeployment.jsonというファイルも書き出します。このファイルは保管しておいてください。あとでStudioを更新または削除するときに使われます。

Maxisnapを接続して試す

• 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を押すと範囲をキャプチャして、すぐにアップロードします。共有リンクはクリップボードにコピーされます。

Windows版MaxisnapとMac版Maxisnapは、CloudflareのStudioに各アップロードを1回のリクエストで送信します。受け付けるのは、ファイルあたり25 MBまでです。

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