VIBE BOX · PRO ARCHITECTURE · SECURE DEPLOYMENT

最強の
バイブコーディング
環境。

プロエンジニア級のアーキテクチャでアプリを公開
セキュリティ対策したうえでバイブコーディング

Cloudflare・Google Cloud・AIガバナンス・公開制御・インフラセキュリティ
7
App Templates
17
AI Dev Skills
3
Access Tiers
10+
Years CTO Security Knowledge
01 / PRO ARCHITECTURE

プロ級の設計を
アプリの土台に

あなたのCloudflareやGoogle Cloudを連携することで、プロエンジニア級のアーキテクチャでアプリを公開できます。
VIBE BOX · ARCHITECTURE — build time × run time vibebox · codex · mcp · cloudflare · google cloud
A SETUP TIME 準備では、各社の画面でAPIトークンやプロジェクトを用意してVibeBoxにつなぐ。公開範囲に合う認証と攻撃対策の基盤は、Vibe Boxがクラウドに構築する
HUMAN · SETUP VibeBox Macアプリのウィザード 画面の案内に沿って進める API terraform CLOUDFLARE APIで自動構築 · Terraform不要 Access · WAF 認証とエッジ防御 R2管理領域 管理データをアプリから隔離 GOOGLE CLOUD 同梱のTerraformを自動実行 ロードバランサ · Cloud Armor · IAP エッジ防御と認証 Cloud SQL · Bastion DBと踏み台経由の接続経路
B DEV TIME 開発では、雛形と、設計やテストのスキルとルールを土台にAIとアプリを作る。データベースの変更は、履歴を順番に適用するマイグレーションで管理する
VIBE CODER バイブコーダー 対話 YOUR MAC · VIBEBOX AI Agent OpenAI Codex (bundled) サンドボックスで権限を制限 MCP server 危険な操作を人の確認に回す MCP経由で操作 CLOUDFLARE Workers · D1 · R2 アプリごとにWorkerとD1を分離 GOOGLE CLOUD Cloud Run · Cloud SQL · Firestore Secret Manager · Cloud Storage
C RUN TIME 公開では、誰でも使えるpublic、社内限定のinternal、指定した取引先とも共有するsharedから選んだ範囲に合わせて、認証や攻撃対策を組み合わせる
社内 取引先 一般ユーザー 攻撃者 Cloudflare Access · WAF or IAP · Cloud Armor EDGE DEFENSE Workers · Cloud Run D1 · R2 · Cloud SQL · Firestore
ENGINEERED BASE

雛形と、要件定義から設計、テスト、コードレビュー、セキュリティまでを扱うスキル、コード品質や命名などを定めるルールをAIエージェントに同梱しています。

APP DATABASE

データベースは、CloudflareのD1でもGoogle CloudのCloud SQLでもアプリごとに分離します。変更は、AIとクラウドの間をつなぐMCP serverを通し、マイグレーションで適用します。

GUARDED AI

AIエージェントはサンドボックスと実行ポリシーで権限を制限されます。DROP、TRUNCATE、ALTERなどの破壊的なデータベース操作は、人が確認するまで実行されません。

02 / TWO PILLARS

アーキテクチャと
セキュリティ

アプリはプロエンジニアレベルのアーキテクチャで作り、公開範囲に合う構成で守ります。この2つの強みを、作成から公開、運用まで続く1つの体験にまとめました。
01 / BUILD

プロの設計を雛形に
バイブコーディング

ソフトウェア開発のベストプラクティスを詰め込んだアーキテクチャを雛形にして、バイブコーディングできます。雛形は公開先のクラウドに合わせて用意し、AIエージェントには要件定義からテスト、コードレビューまでのスキルとルールを同梱しています。

02 / DEPLOY

公開範囲に合わせて
安全に公開

誰でも使える公開、社内限定、取引先との共有から選ぶと、範囲に合う認証や攻撃対策を組み込んだ構成でCloudflareかGoogle Cloudへ公開します。AIの権限もサンドボックスと実行ポリシーで制限します。

03 / EXPERIENCE

AIと話して作り、
同じ画面で運用

選んだ雛形を土台にAIと話して機能を作り、Deployボタンから公開します。公開後もログ、状態、機密情報のSecret、データベースを同じ画面から扱えます。

03 / USE CASES

用途で選ぶ
設計と公開

どの用途でも、雛形と開発スキルを使ってアプリを組み立て、使う人に合う公開範囲とクラウド構成で守ります。
USE CASE 01

公開サービスを形にする

APIサーバー、Webサイト、掲示板、ダッシュボードなどの雛形から選び、AIとのチャットで機能を作れます。

誰でも使えるpublicで一般向けに公開します。Cloudflareなら、APIサーバーとダッシュボードの雛形を独自ドメインなしでworkers.devから始められます。

USE CASE 02

日々の業務を社内アプリにする

勤怠や在庫などの業務を雛形から組み立て、データベースをアプリごとに分けてマイグレーションで変更します。

公開範囲を社内限定のinternalにすると、自社のログインを通った人だけが使えます。Cloudflareでは社員のログインを管理するIdPを登録し、Google CloudではGoogle Workspaceを使います。

USE CASE 03

取引先との共有アプリを作る

税理士や外注先とデータをやり取りする機能を、設計やデータベース設計のスキルを使うAIエージェントと作れます。

公開範囲を自社と指定した取引先に限るsharedにすると、自社のメンバーに加えて、メールアドレスで指定した取引先だけが入れます。Cloudflareではメールに届くワンタイムコード、Google Cloudでは指定したGoogleアカウントで相手がログインします。

USE CASE 04

会社のGoogle Cloudで運用する

会社のGoogle Cloudプロジェクトに同梱のTerraformで基盤を構築し、アプリはCloud RunとCloud SQLで動かします。Cloud Runはアプリの利用量に合わせてインスタンス数を自動で増減します。

社内限定や取引先との共有では、Googleアカウントでのログインを確認するIAPと、攻撃を遮断するCloud Armorを備えた環境に公開します。

04 / COMPARISON

自分のクラウドで
作って、動かす

Replit、v0、Lovable、Bolt.newなどのクラウド型バイブコーディングツールと比較

雛形と開発スキルを備えた設計、アプリごとのデータベース、公開範囲ごとの防御を、利用者自身のクラウドに組み込みます。
観点
クラウド型の開発ツール
Vibe Box
アプリを作る土台
サービス事業者が用意した環境
7種の雛形と17件の開発スキル、9件のルールをAIエージェントに同梱
データベースの設計
プロバイダ依存
アプリごとに分け、変更履歴をマイグレーションで管理
公開先とアクセス制御
サービス事業者が用意した環境
利用者自身のCloudflareかGoogle Cloudに、公開範囲に合う認証と攻撃対策を構成
AIが実行できる操作
AIが直接SQLを叩ける構造で、防ぎきれない
サンドボックスと実行ポリシーで制限し、破壊的な操作は人が確認
AIと機密情報の境界
作業環境からSecretが流出する余地がある
アプリのSecretはクラウドに保管し、インフラの資格情報はOSのキーチェーンで暗号化してAIから分離
05 / SECURE BY DESIGN

公開まで守る
5つの仕組み

AIの操作から公開後のデータまで、人の注意だけに頼らない権限と構成で守ります。
01

危険なコマンドを実行させない

AIエージェントの実行ポリシーで、クラウドを直接操作するgcloudやwrangler、terraform apply、DBに直接つなぐpsqlやsqlite3、sudoやrm -rfなどを拒否します。

02

防御の設定をAIから切り離す

AIの操作を仲介するMCP serverの本体と、AI自身の権限設定は、AIからは読み取り専用です。AIが防御を外す経路を構造で塞いでいます。

03

壊す操作には人の確認を挟む

DROP TABLEやTRUNCATE、WHERE無しのUPDATEとDELETE、アプリの削除などは、人が確認してから実行します。AIに任せる「おまかせ」モードでも、この確認は省けません。

04

基盤とアプリの役割を分ける

公開範囲の設定や通信の入口で攻撃を防ぐエッジ防御などの基盤は、最初に1回だけ構築します。アプリごとのWorkerやD1、Cloud Run、データベース、Secretは、MCP serverが必要なときに作ります。

05

データと認証情報を分離する

CloudflareではアプリごとにWorkerとD1を分け、管理データのバケットはどのアプリからも触れない場所に置きます。Google CloudではCloud SQLのデータベースをアプリごとに分けます。アプリのSecretはPCに置かずAIの作業領域から離し、インフラの資格情報はOSのキーチェーンで暗号化します。

06 / BUILD TO OPERATE

7つの手順で
公開と運用まで

初回設定と各社の画面で必要な準備を済ませたら、雛形を選び、AIと開発し、公開範囲に合う構成へ配置します。設計から公開後の運用までを7つの手順で進めます。
00
Install

VibeBoxアプリを入れる

VibeBox.app
  • VibeBoxをPCに入れる
  • CodexやMCPを同梱しています
  • アプリは自動更新
01
Setup

バイブコーディングに必要なツールのインストール

セットアップ画面からHomebrew、git、Docker、gcloudを導入し、ChatGPTアカウントでAIエージェントにログインします。

setup wizard · ChatGPT login
  • 足りないツールは画面のボタンからインストールできます
  • Dockerは入れた後に一度起動し、利用規約に同意します
  • Homebrewの導入にはMacのパスワードが必要で、数分から十数分かかります
  • AIエージェントの実行ポリシーと作業領域の制限は、最初から有効です
02
Foundation

公開先のクラウドを選ぶ

CloudflareかGoogle Cloudを選び、接続情報を入力して作成を押すと、公開範囲の設定やエッジ防御を含む基盤ができあがります。

Cloudflare · Google Cloud
  • CloudflareはAPIトークンとアカウントIDを入力すると、Terraformを使わずに構築します
  • Google Cloudは、同梱のTerraformをVibeBoxが実行します。Google Cloud側の事前設定がいくつか必要です
  • 社内限定や取引先との共有を使う場合は、ログイン方法もここで登録します
03
Create

設計と公開範囲を選ぶ

公開範囲、雛形、サブドメインを選ぶと、MCP serverがアプリ専用のリソースを作ります。

公開範囲 · 雛形 · サブドメイン
  • 公開範囲は、誰でも使えるpublic、社内限定のinternal、自社と指定した取引先に限るsharedの3つです
  • APIサーバー、Cloudflare Workers向けAPI、Firebase認証付きアプリ、HTMLを中心に画面を作るHTMXのコーポレートサイトとランディングページ、React向けのTanStack Startによる掲示板とダッシュボードから選べます。Cloudflareで選べるのは、Workers向けAPIとダッシュボードの2種です
04
Build

VibeBox上でアプリをバイブコーディング

要件定義、設計、テスト、セキュリティなど17件のスキルと9件のルールを使うAIに、追加したい画面や機能を伝えます。

chat · skills · rules
  • データベースの変更はMCP serverを通し、マイグレーションで管理します。危険なクエリは人の確認が必須です
  • アプリのSecretは専用の画面から登録し、クラウドの暗号化ストアに保管します
  • コミットのたびに、gitleaksが機密情報の混入を検査します
05
Deploy

アプリを公開

ボタンひとつでアプリをデプロイ

Deployボタン
  • CloudflareではWorkerを公開し、D1の初期スキーマもあわせて適用します
  • Google CloudではDockerでイメージを作り、Cloud Runの新しい版を反映します
  • GitHubと連携すると、ボタンからリポジトリを作ってpushできます
06
Operate

公開後もそのまま運用する

ログ、状態、Secret、通信の許可先をチャット画面の上部から扱えます。取引先の追加や削除もチャットで頼めます。

ログ · 状態 · Secrets · ネットワーク
  • アプリの削除は、人の確認を通してから実行します
  • DBの参照、書き込み、マイグレーションもチャットから頼めます
  • 操作の監査ログは、CloudflareではR2に、Google CloudではFirestoreに残ります
08 / QUESTIONS

設計と公開の
よくある質問

このほかの質問は相談するからお問い合わせください。

誰のためのプロダクトですか?

プロエンジニアレベルのアーキテクチャでアプリを作り、セキュリティ対策をしたうえで公開したいバイブコーダーのための環境です。個人の公開サービス、法人の社内ツール、取引先と共有するアプリに使えます。

Replit、v0、Cloudflare VibeSDKと何が違うのですか?

VibeBoxは、雛形に加えて、要件定義、設計、テスト、コードレビュー、セキュリティなどの開発スキルとルールをAIエージェントに同梱しています。アプリとデータは利用者自身のCloudflareアカウントかGoogle Cloudプロジェクトに置かれ、公開範囲ごとの構成とAIの権限制限も組み込まれます。

作ったアプリはVibe Boxに依存しますか?

作ったアプリは、利用者自身のCloudflareアカウントかGoogle Cloudプロジェクトで動きます。データベースはアプリごとに分かれ、機密情報のSecretとともに利用者自身のアカウントに置かれます。希望すればGitHubと連携でき、ボタンからリポジトリを作ってpushすると、ソースコードをGitHubで共有できます。

対応しているクラウドは?

クラウドはCloudflareとGoogle Cloudに対応しています。CloudflareではWorkersとD1、Google CloudではCloud RunとCloud SQLを使い、データベースをアプリごとに分けます。

AWSやAzureには対応しますか?

現時点で対応しているクラウドはCloudflareとGoogle Cloudの2つです。AWSとAzureは将来的に対応予定です。

使い始めるのに必要なものは?

Mac、AIエージェントにログインするためのChatGPTアカウント、CloudflareアカウントかGoogle Cloudプロジェクトが必要です。社内限定や取引先と共有するアプリには、独自ドメインと自社のログイン基盤も必要です。AIエージェントにClaudeを使える版も開発中です。

価格は?

アカウントごとの月額制となります。お問い合わせください。

AI駆動開発ハーネスを使っていますが、Vibe Boxは別物ですか?

AI駆動開発ハーネスをVibeBoxに一部同梱しています。

最強の環境で
バイブコーディング

パイロット導入では、お客様のCloudflareアカウントかGoogle Cloudプロジェクトに、Vibe Boxで公開できる環境を用意するところからご支援します。導入を検討中の方は、お問い合わせフォームからご相談ください。