AIでアプリを作って公開する方法をご案内します。
はじめての方でも、このページを見れば始められます。
AIに「こんなアプリがほしい」と日本語で伝えるだけで、AIがコードを自動生成します。生成されたコードをBlueにアップロードすれば、すぐにWebアプリとして公開できます。
あなたに合った方法を選んでください。
Blueの中だけで完結。プロンプトを入力すればそのまま公開できます。迷ったらまずこれ。
ChatGPTやClaudeなど、普段のAIとの会話でコードを作り、Blueにアップロードして公開。
Claude Code や Codex が、コード生成からBlueへのデプロイまで自動で行います。
3つの方法を比較して、自分に合ったものを選びましょう。
| 方法 | 特徴 | おすすめの人 |
|---|---|---|
| AI Build おすすめ | Blueの中だけで完結。プロンプト入力→即公開 | 気軽に試したい方・シンプルなアプリ向け |
| チャットAI（ChatGPT・Claudeなど） | AIとの会話でコードを作り、Blueにアップロードして公開 | はじめての方・特別なツールなしで始めたい方 |
| AIエージェント（Claude Code・Codex） | 高度なアプリを作成、APIキーで自動デプロイ | より本格的なアプリを作りたい方 |
ChatGPT・Claude・Gemini などの普段お使いのAIとの会話でアプリのコードを作り、Blueにアップロードして公開する方法です。特別なツールのインストールは不要で、ブラウザだけで始められます。
普段お使いのチャットAI（ChatGPT、Claude、Geminiなど）に、作りたいアプリを伝えます。
AIが生成したコードをファイルとして保存します（例: index.html）。ファイルが複数ある場合はフォルダにまとめてZIPファイルに圧縮します。
HTMLファイル1つで完結する場合は、そのままアップロードできます。複数のファイルは、OSのファイルマネージャーで右クリック→「圧縮」などの操作でZIPにまとめます。
Blueにログインしてコンソール（/console）を開き、ZIPファイルをアップロードします。アプリがURLつきで公開されます。
ポイント: ファイル操作や外部通信を実行できないAI環境では、生成されたコードを手動でアップロードします。実行機能の有無は利用環境によって異なります。ここでは特別なツールの追加なしで始められる方法を紹介しています。
コードを書いたことがない方へ
準備から最初のアプリ作り、公開まで一つずつ紹介します。
はじめてのAIエージェント・アプリ作りガイドを読む →
Codex・Claude CodeからAPIキーで公開・更新する →
共有チェックリストを作る — 保存・別ブラウザ共有・更新まで →
Claude Code（Anthropic）や Codex（OpenAI）に、普段の言葉で作りたいものを伝えます。小さなアプリから始めて、試しながら直していけます。できたファイルをBlueへアップロードするか、実行権限のあるAI環境からAPIで公開できます。
Claude Code や Codex のデスクトップアプリを起動します。
作りたいアプリの内容を自然な言葉で伝えます。AIがファイルを自動で作成します。
生成されたコードをBlueに公開します。2つの方法があります:
方法A: コンソール（/console）からZIPファイルをアップロード（チャットAIと同じ手順）
方法B: APIキーを使った自動デプロイ — AIエージェントがBlueのAPIを使って自動的にデプロイします。AIエージェントにBlueのデプロイキーを渡せば、コード生成から公開まですべてAIに任せることができます。
APIデプロイの技術詳細は AI-Ready ドキュメント をご覧ください。
Blueの中だけで完結する、最も気軽な方法です。プロンプトを入力すれば、そのまま公開できます。ただし、現時点ではシンプルなアプリ（1ページで完結するHTMLなど）向けです。
Blueにログインし、AI Build ページにアクセスします。テンプレートとプロンプト入力欄が表示されます。
作りたいアプリの説明を自然な言葉で入力します。日本語でも英語でもOKです。
コードが生成されたら「デプロイ」ボタンをクリック。アプリがURLつきで公開されます。
Consoleのアプリ一覧で「Showcase画像」を開き、「基本画像（主言語）」「日本語」「English」を選んでアップロードします。申請にはいずれか1枚だけで十分です。日本語・英語の画像は任意で追加できます。表示言語の画像がなければ基本画像、基本画像もなければ日本語・英語の順に使用します。削除は選択中の画像だけが対象です。
APIでは POST /apps/{app_id}/ogp?lang=en に画像をmultipartの file として送信します。lang=ja は日本語、lang省略は基本画像です。DELETE も同じ指定で対象画像だけを削除できます。アプリ一覧の ogp_urls で登録済み画像を確認できます。
Consoleの「Showcase画像」と「Showcaseアイコン」は、BlueのトップページとShowcaseでの掲載表示専用です。検索結果のサイト名、ブラウザータブのファビコン、SNS共有時の画像は、アプリ自身のsource codeとassetsで管理します。
Googleなどにアプリ名を正しく伝えるには、公開ホームページの<title>、主要見出し、og:site_nameを同じ実名で揃え、WebSite JSON-LDへ実在する公開ルートURLを設定します。canonicalも同じURLを指すようにしてください。
画像はAI Buildの添付またはWork assets（Asset Library）へアップロードし、使うファイル名と用途をAI Buildへ伝えられます。ファビコンはアプリbundleへ含めてHTMLの<head>から参照してください。OGP画像は原則1200×630で用意し、公開URLから取得できる絶対URLをog:imageへ設定します。
公開前にog:title、og:description、og:url、og:image、twitter:cardも確認してください。存在しない画像URLは設定しません。
<link rel="canonical" href="https://your-public-host.example/">
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"WebSite","name":"App name","url":"https://your-public-host.example/"}
</script>
<link rel="icon" type="image/png" href="/assets/favicon.png">
<link rel="apple-touch-icon" href="/assets/apple-touch-icon.png">
<meta property="og:type" content="website">
<meta property="og:site_name" content="App name">
<meta property="og:title" content="App name">
<meta property="og:description" content="App description">
<meta property="og:url" content="https://your-public-host.example/">
<meta property="og:image" content="https://your-public-host.example/assets/ogp.jpg">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:image" content="https://your-public-host.example/assets/ogp.jpg">your-public-host.exampleは説明用です。公開前にBlueが発行した実URLまたは設定済みの独自ドメインへ置き換え、URL変更時も更新してください。Blueでは、APIキーなどの値をプロンプト・ログ・公開URLに出さずにアプリへ渡せます。
Settings > Secrets にAPIキーを保存し、AI Buildには使う環境変数名だけを伝えてください。公開後のアプリでは Python の os.environ["KEY"] や Node.js の process.env.KEY から読めます。
ZIPのルートに .env、.env.local、.env.development、.env.production がある場合、Blueは有効なキーをアプリ環境変数としてアップロード時に取り込みます。PORT、HOST、PATH、NODE_OPTIONS、PYTHONPATH などの実行環境を変えるキーはBlueが管理します。
形式は KEY=value または export KEY=value のシンプルな行に対応します。アプリ環境変数は最大50個、各ルート .env ファイルは50KBまで読み取り、未対応の名前やBlue管理キー・ランタイム起動キーはスキップします。
.env などのドットファイルはアプリ用プロキシで遮断されます。デプロイ警告には機密ファイル検出や取込件数が出ることがありますが、値そのものはログや警告に表示しません。
推奨: 長く使うAPIキーは Settings > Secrets で管理してください。既存のローカルアプリを移す場合や、小さな連携を試す場合はZIP内の .env も利用できます。
SOLA PRODUCTS & SERVICES
日々の道具から、チームの仕事、専用システムまで。目的に合うサービスを見つけてください。
持ち物やコレクションを記録・共有できるスマホアプリ。
公式サイトを見る Sola Appsメモ、パスワード管理、学習など、Solaのアプリを探せます。
公式サイトを見る Sola · 日本 / Japan業務に合わせたアプリ・システムの設計から開発・運用まで相談できます。
公式サイトを見る Sola of America米国の窓口で、業務システムやWeb・モバイルアプリの開発を相談できます。
公式サイトを見る SPS日報やWiki、チームの情報をまとめる業務ポータル。
公式サイトを見る SFSチーム専用のファイルサーバーで、ファイルの保存・共有・外部送信を。
公式サイトを見るリンク先はSolaの別サービスです。料金・アカウント・サポートの条件は各サービスでご確認ください。
解決しない場合や、導入について相談したい場合はお問い合わせください。
お問い合わせ