2.9 KiB
2.9 KiB
Posimai Static App Template
新しい静的 PWA アプリを作るときのボイラープレート。
使い方
# 1. テンプレートをコピー
cp -r _template posimai-[new-app-name]
cd posimai-[new-app-name]
# 2. APP_NAME / APP_ID / APP_DESCRIPTION を置換
# APP_NAME → 表示名 (例: "Posimai Timer")
# APP_ID → 識別子 (例: "posimai-timer")
# APP_DESCRIPTION → 説明文
# 3. Git 初期化
git init && git add . && git commit -m "init: APP_NAME"
# 4. Gitea にリポジトリを作成(★ Web UI で先に行う)
# http://100.76.7.3:3000 にアクセス
# → 「+」→「新しいリポジトリ」→ 名前: APP_ID → 作成
# ※ この手順を飛ばすと git push gitea が 404 で失敗する
# 5. GitHub にリポジトリ作成(gh CLI)
gh repo create posimai/APP_ID --private
# 6. リモートを追加して初回 push
git remote add gitea http://100.76.7.3:3000/mai/APP_ID.git
git remote add github https://github.com/posimai/APP_ID.git
npm run deploy # = git push gitea main && git push github main
# 7. Vercel と GitHub を連携(1アプリにつき1回だけ)
# --yes では対話が消えないため echo パイプで GitHub を選択させる
echo "https://github.com/posimai/APP_ID.git" | vercel git connect
# 8. 初回本番デプロイをトリガー(1回だけ必要)
# vercel git connect だけでは本番反映されないため、空コミットで push する
git commit --allow-empty -m "ci: trigger initial Vercel deployment"
npm run deploy
# Vercel ダッシュボードで "Production" デプロイが完了したら以降は不要
# ※ 通常運用では vercel --prod は実行しない(GitHub push で自動)
以降の更新はすべて:
git add .
git commit -m "feat/fix/chore: 変更内容"
npm run deploy
デプロイフロー(全体像)
npm run deploy
│
├─► git push gitea main → Synology NAS (ローカルバックアップのみ)
│
└─► git push github main → GitHub
│
│ Webhook (push 検知)
▼
Vercel
└─ ビルド → 本番反映
- Gitea はバックアップ専用。Vercel とは無関係。
- GitHub push が Vercel の唯一のトリガー。
vercel --prodの直接実行は禁止(初回トリガー用の空コミット push で代替)。
デザイントークン(変更禁止)
| トークン | 値 | 用途 |
|---|---|---|
--bg |
#0D0D0D |
ページ背景 |
--surface |
#1A1A1A |
カード背景 |
--surface2 |
#252525 |
ネスト要素 |
--border |
#2D2D2D |
ボーダー |
--text |
#F3F4F6 |
主テキスト |
--text2 |
#9CA3AF |
副テキスト |
--accent |
#6EE7B7 |
アクセント |
--radius |
12px |
角丸 |