Skip to content

Commit 6e27c4c

Browse files
yn1323claude
andauthored
feat: 本番デプロイ改善・法務ページ追加・LP調整 (#308)
* refactor: LP Heroグラデーション終点を次セクションと揃えAccentLine削除 Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * feat: LPログインボタンにホバー背景を追加 Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * feat: プライバシーポリシー・利用規約ページの追加 Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * docs: OGP・SEO設定プランを追加 Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * chore: Renovateの最小リリース期間を2日に短縮 Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * feat: プラポリ・利用規約のお問い合わせ先にGoogleフォームURLを設定 Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * feat: 本番デプロイをリリースラベル起点に変更 Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * feat: LPフッターにアプリバージョンを表示 Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
1 parent 66b8ad9 commit 6e27c4c

File tree

20 files changed

+681
-52
lines changed

20 files changed

+681
-52
lines changed

.github/CLAUDE.md

Lines changed: 25 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -4,11 +4,23 @@ CI/CDパイプラインの構成と運用ルール。
44

55
## ブランチ戦略
66

7-
| ブランチ | 用途 | デプロイ先 |
8-
|---|---|---|
9-
| `main` | 本番環境 | CF `yps-crispy-carnival` + Convex `yps-crispy-carnival` |
10-
| `develop` | ステージング環境 | CF `dev-yps-crispy-carnival` + Convex `dev-yps-crispy-carnival` |
11-
| PR → develop | プレビュー環境 | CF `dev-yps-crispy-carnival` (branch: pr-{N}) + Convex preview(一時的) |
7+
| ブランチ | 用途 | デプロイ先 | トリガー |
8+
|---|---|---|---|
9+
| `main` | 本番環境 | CF `yps-crispy-carnival` + Convex `yps-crispy-carnival` | `release:*` ラベル付き PR のマージ時のみ |
10+
| `develop` | ステージング環境 | CF `dev-yps-crispy-carnival` + Convex `dev-yps-crispy-carnival` | push 毎 |
11+
| PR → develop | プレビュー環境 | CF `dev-yps-crispy-carnival` (branch: pr-{N}) + Convex preview(一時的) | PR open/sync |
12+
13+
### リリースラベル
14+
15+
`main` への本番デプロイは PR に以下のいずれかのラベルを付けてマージしたときのみ実行される。
16+
17+
| ラベル | 挙動 |
18+
|---|---|
19+
| `release:major` | `npm version major`(例: 1.2.3 → 2.0.0) |
20+
| `release:minor` | `npm version minor`(例: 1.2.3 → 1.3.0) |
21+
| `release:patch` | `npm version patch`(例: 1.2.3 → 1.2.4) |
22+
23+
ラベルなしでマージした場合はデプロイされない(`release.yml` が skip される)。
1224

1325
## 外部サービス構成
1426

@@ -76,7 +88,14 @@ CI/CDパイプラインの構成と運用ルール。
7688
| `deploy-preview` | PR to develop (open/sync) | Convex preview作成 → seed → ビルド → CF dev プレビューデプロイ |
7789
| `cleanup-preview` | PR to develop (close) | CF dev プレビュー削除 |
7890
| `deploy-develop` | push to develop | Convex devデプロイ → ビルド → CF dev メインデプロイ |
79-
| `deploy-production` | push to main | Convex prodデプロイ → ビルド → CF prod メインデプロイ |
91+
92+
### リリース (`release.yml`)
93+
94+
| ジョブ | トリガー | 処理 |
95+
|---|---|---|
96+
| `release` | PR merged to main w/ `release:*` ラベル | version bump → commit + tag push → Convex prodデプロイ → ビルド → CF prodデプロイ → GitHub Release作成 |
97+
98+
バージョン bump コミットは `github-actions[bot]``main` に直 push する。`main` に branch protection がある場合は bot を bypass 許可するか PAT を用意する必要がある。
8099

81100
### テスト・品質チェック
82101

.github/workflows/deploy.yml

Lines changed: 1 addition & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ on:
55
branches: [develop]
66
types: [opened, synchronize, reopened, closed]
77
push:
8-
branches: [main, develop]
8+
branches: [develop]
99

1010
permissions:
1111
contents: read
@@ -112,28 +112,3 @@ jobs:
112112
CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
113113
CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
114114

115-
deploy-production:
116-
if: github.event_name == 'push' && github.ref == 'refs/heads/main'
117-
runs-on: ubuntu-latest
118-
environment: Production
119-
steps:
120-
- uses: actions/checkout@v6
121-
- name: Setup
122-
uses: ./.github/actions/setup
123-
- name: Deploy Convex
124-
run: npx convex deploy
125-
env:
126-
CONVEX_DEPLOY_KEY: ${{ secrets.CONVEX_DEPLOY_KEY }}
127-
- name: Build
128-
run: pnpm build
129-
env:
130-
VITE_CONVEX_URL: ${{ secrets.VITE_CONVEX_URL }}
131-
VITE_CLERK_PUBLISHABLE_KEY: ${{ secrets.VITE_CLERK_PUBLISHABLE_KEY }}
132-
- name: Deploy to Cloudflare Pages
133-
run: |
134-
npx wrangler pages deploy dist \
135-
--project-name yps-crispy-carnival \
136-
--branch main
137-
env:
138-
CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
139-
CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}

.github/workflows/release.yml

Lines changed: 85 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,85 @@
1+
name: Release to Production
2+
3+
on:
4+
pull_request:
5+
branches: [main]
6+
types: [closed]
7+
8+
permissions:
9+
contents: write
10+
pull-requests: read
11+
12+
jobs:
13+
release:
14+
if: |
15+
github.event.pull_request.merged == true &&
16+
(contains(github.event.pull_request.labels.*.name, 'release:major') ||
17+
contains(github.event.pull_request.labels.*.name, 'release:minor') ||
18+
contains(github.event.pull_request.labels.*.name, 'release:patch'))
19+
runs-on: ubuntu-latest
20+
environment: Production
21+
steps:
22+
- uses: actions/checkout@v6
23+
with:
24+
ref: main
25+
fetch-depth: 0
26+
27+
- name: Setup
28+
uses: ./.github/actions/setup
29+
30+
- name: Determine release type
31+
id: release-type
32+
run: |
33+
if ${{ contains(github.event.pull_request.labels.*.name, 'release:major') }}; then
34+
echo "type=major" >> "$GITHUB_OUTPUT"
35+
elif ${{ contains(github.event.pull_request.labels.*.name, 'release:minor') }}; then
36+
echo "type=minor" >> "$GITHUB_OUTPUT"
37+
else
38+
echo "type=patch" >> "$GITHUB_OUTPUT"
39+
fi
40+
41+
- name: Configure Git
42+
run: |
43+
git config user.name "github-actions[bot]"
44+
git config user.email "github-actions[bot]@users.noreply.github.com"
45+
46+
- name: Bump version
47+
id: bump
48+
run: |
49+
NEW_TAG=$(npm version ${{ steps.release-type.outputs.type }} --no-git-tag-version)
50+
echo "tag=${NEW_TAG}" >> "$GITHUB_OUTPUT"
51+
echo "version=${NEW_TAG#v}" >> "$GITHUB_OUTPUT"
52+
53+
- name: Commit, tag and push
54+
run: |
55+
git add package.json
56+
git commit -m "chore: release ${{ steps.bump.outputs.tag }}"
57+
git tag ${{ steps.bump.outputs.tag }}
58+
git push origin main --follow-tags
59+
60+
- name: Deploy Convex
61+
run: npx convex deploy
62+
env:
63+
CONVEX_DEPLOY_KEY: ${{ secrets.CONVEX_DEPLOY_KEY }}
64+
65+
- name: Build
66+
run: pnpm build
67+
env:
68+
VITE_CONVEX_URL: ${{ secrets.VITE_CONVEX_URL }}
69+
VITE_CLERK_PUBLISHABLE_KEY: ${{ secrets.VITE_CLERK_PUBLISHABLE_KEY }}
70+
71+
- name: Deploy to Cloudflare Pages
72+
run: |
73+
npx wrangler pages deploy dist \
74+
--project-name yps-crispy-carnival \
75+
--branch main
76+
env:
77+
CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
78+
CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
79+
80+
- name: Create GitHub Release
81+
uses: softprops/action-gh-release@v2
82+
with:
83+
tag_name: ${{ steps.bump.outputs.tag }}
84+
name: ${{ steps.bump.outputs.tag }}
85+
generate_release_notes: true

.storybook/main.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import path from "node:path";
22
import { fileURLToPath } from "node:url";
33
import type { StorybookConfig } from "@storybook/react-vite";
4+
import pkg from "../package.json" with { type: "json" };
45

56
const __dirname = path.dirname(fileURLToPath(import.meta.url));
67

@@ -21,6 +22,10 @@ const config: StorybookConfig = {
2122
},
2223
staticDirs: ["../public"],
2324
viteFinal: async (config) => {
25+
config.define = {
26+
...config.define,
27+
__APP_VERSION__: JSON.stringify(pkg.version),
28+
};
2429
config.resolve = {
2530
...config.resolve,
2631
alias: {
Lines changed: 62 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
# OGP・SEO設定
2+
3+
## 概要
4+
SNSシェア時の表示(OGP)と基本的なSEO設定を行う。
5+
6+
## タスク
7+
8+
### 1. OGP画像の生成(1200x630px)
9+
10+
以下の仕様でOGP画像を生成し `public/ogp.png` に配置する。
11+
12+
- サイズ:1200x630px
13+
- 背景:LPのHeroと同じグラデーション(`#99f6e4``#fafafa` 上から下)
14+
- 中央に以下を縦に配置:
15+
- 「シフトリ」テキスト(太字、大きめ、色 `#1a1a1a`
16+
- 「シフト作り もっとラクにできる」テキスト(やや小さめ、色 `#525252`
17+
- フォント:Noto Sans JP(Google Fonts)、なければシステムフォントでOK
18+
- テキストは上下左右中央揃え、行間に余裕を持つ
19+
20+
生成方法は自由(HTML→スクリーンショート、Canvas API、SVG→PNG変換など)。
21+
成果物として `public/ogp.png` が存在すればOK。
22+
23+
### 2. index.html にメタタグ追加
24+
25+
`index.html``<head>` 内に以下を追加:
26+
27+
```html
28+
<!-- SEO -->
29+
<meta name="description" content="少人数のお店のシフト作成 ぜんぶおまかせ スタッフの登録不要 リンクを開くだけで希望シフトを提出" />
30+
31+
<!-- OGP -->
32+
<meta property="og:type" content="website" />
33+
<meta property="og:title" content="シフトリ - シフト作り もっとラクにできる" />
34+
<meta property="og:description" content="少人数のお店のシフト作成 ぜんぶおまかせ スタッフの登録不要 リンクを開くだけで希望シフトを提出" />
35+
<meta property="og:image" content="https://TODO_DOMAIN/ogp.png" />
36+
<meta property="og:url" content="https://TODO_DOMAIN/" />
37+
<meta property="og:site_name" content="シフトリ" />
38+
<meta property="og:locale" content="ja_JP" />
39+
40+
<!-- Twitter Card -->
41+
<meta name="twitter:card" content="summary_large_image" />
42+
<meta name="twitter:title" content="シフトリ - シフト作り もっとラクにできる" />
43+
<meta name="twitter:description" content="少人数のお店のシフト作成 ぜんぶおまかせ" />
44+
<meta name="twitter:image" content="https://TODO_DOMAIN/ogp.png" />
45+
```
46+
47+
### 3. 既存メタタグの更新
48+
49+
`index.html` の既存 description を更新:
50+
- 変更前:`シフトリ - スタッフシフト管理`
51+
- 変更後:`少人数のお店のシフト作成 ぜんぶおまかせ スタッフの登録不要 リンクを開くだけで希望シフトを提出`
52+
53+
titleはそのまま「シフトリ」でOK。
54+
55+
### 4. favicon の更新
56+
57+
現在は絵文字(🦜)のインラインSVG。そのままでOK(マスコット完成後に差し替え予定)。
58+
59+
## 注意事項
60+
- `og:image``og:url` のドメインは `TODO_DOMAIN` としている。ドメイン取得後にgrepで一括置換すること
61+
- OGP画像は `public/` 直下に置く(Viteが `public/` をそのまま配信するため)
62+
- OGPのデバッグには https://ogp.me/ や X の Card Validator を使用して確認する

0 commit comments

Comments
 (0)