posimai-root/docs/new-app-guide.md

4.2 KiB
Raw Blame History

新アプリ作成ガイド

このドキュメントは posimai-project で新しい PWA アプリを作成し、エコシステム(ダッシュボード等)に統合するための完全な手順書です。

1. テンプレート選択

テンプレート 使うべきアプリ
_template/ 複数ビュー・i18n・Magic Link 認証・サイドバーナビが必要なアプリbrain, daily, together, journal 相当)
_template-minimal/ 単機能ツール・サイドバー不要なアプリdiff, clean, timer, lens, ambient 相当)

迷ったら _template-minimal/ を選ぶ(後からフル機能に移行する方が簡単)。

create-app.sh で新規アプリを一括セットアップ可能Git 初期化 + Gitea/GitHub リポジトリ作成 + Vercel 連携まで自動):

bash create-app.sh posimai-myapp "My App Name" "アプリの説明"

2. 新アプリ作成後の必須チェックリスト(抜け漏れ禁止)

新しいアプリを作ったら、必ずこの順番で実行すること0番台は実装開始前、1番以降は実装完了後

  1. 【実装前】アクセントカラーを宣言する
    • このアプリのカテゴリを確認(input / routine / create / tools / business / infra / ideas
    • デフォルト Teal (#6EE7B7) で問題なければ何もしない
    • 変更する場合は docs/design-system.md の「アプリ別アクセントカラー」テーブルに先に追記してから実装を開始する

0.5. 【実装前】logo.png 用 Gemini プロンプトを作成・提示する

  • 構成: 以下の共通プロンプト + アプリ固有の追加プロンプト(感覚的な表現)

共通プロンプト(全アプリ固定):

App icon, 512x512px, squircle shape with rounded corners.
A small translucent glass orb character, soft matte-frosted surface with
inner teal (#6EE7B7) luminescence glowing from within, gentle light refraction.
Two tiny calm black dot eyes, subtle implied smile.
Background: deep charcoal (#0D0D0D) with barely visible teal ambient gradient.
Style: Apple Liquid Glass, multi-material, 2026 premium minimal.
No outline, no harsh edges. Soft depth, subsurface scattering.
  1. Git 初期化・リポジトリ作成・初回 push

    cd posimai-[app-name]
    git init && git add . && git commit -m "feat: initial commit"
    
    # Gitea リポジトリ作成
    GITEA_PASS=$(git credential fill <<< $'protocol=http\nhost=100.76.7.3:3000' | grep password | cut -d= -f2)
    curl -s -X POST "http://100.76.7.3:3000/api/v1/user/repos" \
        -H "Content-Type: application/json" -u "mai:$GITEA_PASS" \
        -d "{\"name\":\"posimai-[app-name]\",\"private\":false,\"auto_init\":false}"
    git remote add gitea http://100.76.7.3:3000/mai/posimai-[app-name].git
    
    # GitHub リポジトリ作成
    gh repo create posimai/posimai-[app-name] --private --source=. --remote=github
    npm run deploy
    
  2. Vercel に接続して初回デプロイをトリガーする

    echo "https://github.com/posimai/posimai-[app-name].git" | vercel git connect --yes
    git commit --allow-empty -m "ci: trigger initial Vercel deployment"
    npm run deploy
    
  3. Dashboard カード追加

    • posimai-dashboard/src/data/projects.json に追加
  4. App Browser カテゴリに追加

    • posimai-dashboard/src/app/apps/page.tsx に追加
  5. Ecosystem Map 追加

    • posimai-dashboard/src/app/ecosystem/page.tsx に追加
  6. Development Timeline に追記

    • posimai-dashboard/src/app/timeline/page.tsxEVENTSlaunch エントリ追加
  7. Access Guide に追記

    • posimai-dashboard/src/app/access/page.tsx に追記
  8. Roadmap サイドバーに追加

    • posimai-roadmap/roadmap.json{ "id": "posimai-[app-name]", "tasks": [] } を追加して npm run deploy
  9. Dashboard をデプロイ

    npm run deploy
    
  10. プロジェクト構成テーブルを更新

    • docs/master-architecture.md のアプリ一覧に追加
  11. logo.png デプロイ

    • ユーザーが logo.png を配置した後、コミット&デプロイ