create-ampless 0.2.0-alpha.16 → 0.2.0-alpha.18

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.ja.md ADDED
@@ -0,0 +1,77 @@
1
+ > English: [README.md](./README.md)
2
+ >
3
+
4
+ # create-ampless
5
+
6
+ [ampless](https://github.com/heavymoons/ampless) プロジェクト向け CLI スキャフォールディングツール。
7
+
8
+ > **プレリリース / アルファ版。** v1.0 まではマイナーバージョンでも破壊的変更が入る可能性があります。`@alpha` タグを使用してください(`@latest` タグは v1.0 まで存在しません)。
9
+
10
+ ```bash
11
+ npx create-ampless@alpha
12
+ ```
13
+
14
+ ウィザードが以下を順に案内します:
15
+
16
+ 1. プロジェクト名
17
+ 2. サイト名(デフォルトの `<title>` および OGP `siteName` として使用)
18
+ 3. テーマ — v0.1 では `blog`
19
+ 4. プラグイン — `seo`、`rss`、`webhook`
20
+
21
+ 出力は AWS Amplify Gen 2 バックエンド定義を含む Next.js 15(App Router)プロジェクトです。`/admin` に管理パネル、`/` にパブリックブログが設置され、選択したプラグインが `cms.config.ts` にあらかじめ設定されます。また運用メモ用の `RUNBOOK.md` も生成されます。
22
+
23
+ ## 生成されたプロジェクトでの次のステップ
24
+
25
+ ```bash
26
+ cd my-project
27
+ npm install
28
+ npx ampx sandbox # AWS 開発リソースをプロビジョニングし amplify_outputs.json を生成
29
+ npm run dev # http://localhost:3000
30
+ ```
31
+
32
+ `/login` でサインアップすると、最初に登録したユーザーが自動的に `ampless-admin` Cognito グループに昇格します。
33
+
34
+ ## ワンショットデプロイ:`--deploy`
35
+
36
+ ウィザードは `npx` から Amplify Hosting の URL まで一気に進めることもできます:
37
+
38
+ ```bash
39
+ npx create-ampless@alpha my-site --deploy
40
+ ```
41
+
42
+ このフラグを追加すると、スキャフォールディング後に以下が実行されます:
43
+
44
+ 1. `git init` + 初回コミット
45
+ 2. GitHub リポジトリを作成(`gh repo create`)してプッシュ
46
+ 3. 新しいリポジトリに紐付けた `aws amplify create-app`
47
+ 4. `aws amplify create-branch main`
48
+ 5. `aws amplify start-job --job-type RELEASE`
49
+ 6. `--domain` を指定した場合はオプションで `aws amplify create-domain-association`
50
+
51
+ コマンドラインに指定が不足している場合はインタラクティブに確認します。CI 向けのフル指定の例:
52
+
53
+ ```bash
54
+ npx create-ampless@alpha my-site --deploy \
55
+ --github-owner my-org \
56
+ --github-private \
57
+ --aws-region us-east-1 \
58
+ --domain example.com --subdomain blog \
59
+ --skip-confirm
60
+ ```
61
+
62
+ apex ドメインが同じ AWS アカウントの Route 53 でホストされている場合、ACM の検証が完了すると Amplify が DNS レコードを自動作成します。それ以外の場合、CLI がレジストラで追加すべき正確な CNAME を表示します。
63
+
64
+ ### デプロイの要件
65
+
66
+ - [`gh`](https://cli.github.com/) のインストールと認証(`gh auth login`)
67
+ - [`aws`](https://aws.amazon.com/cli/) のインストールと設定(`aws configure`)
68
+ - `repo` スコープを持つ GitHub トークン(`--github-token` → `GITHUB_TOKEN` 環境変数 → `gh auth token` → インタラクティブプロンプトの順で解決)
69
+
70
+ ## 動作要件
71
+
72
+ - Node.js >= 20
73
+ - AWS アカウントと `aws configure` の設定済み(サンドボックス / パイプラインデプロイは AWS に直接アクセスします)
74
+
75
+ ## ライセンス
76
+
77
+ [MIT](../../LICENSE)
package/README.md CHANGED
@@ -1,3 +1,6 @@
1
+ > 日本語版: [README.ja.md](./README.ja.md)
2
+ >
3
+
1
4
  # create-ampless
2
5
 
3
6
  CLI scaffolding tool for [ampless](https://github.com/heavymoons/ampless) projects.
@@ -0,0 +1,135 @@
1
+ > English: [RUNBOOK.md](./RUNBOOK.md)
2
+ >
3
+
4
+ # ランブック
5
+
6
+ ampless で構築したサイトの運用手順書です。
7
+
8
+ ## AppSync API キー(自動更新)
9
+
10
+ パブリックブログの読み取り(`listPublishedPosts`、`getPublishedPost`、`listPostsByTag`)は AppSync API キーで保護されています。このキーは `amplify_outputs.json` に含まれているため、**公開サイトを訪問した誰もが確認できる**状態にあります。低信頼度のクレデンシャルとして扱ってください。このキーが持つ権限は上記 3 つのカスタムクエリを呼び出すことのみであり、それらのクエリは `status === 'published'` の行しか返しません。
11
+
12
+ ### なぜ API キーなのか(Identity Pool ゲストロールではなく)?
13
+
14
+ Amplify Gen 2 の `a.handler.custom` リゾルバーは `allow.guest()` や `allow.authenticated('identityPool')` をサポートしておらず、apiKey / userPool / lambda / group / owner のみが使用可能です。v0.1 では簡潔さを優先して API キーを選択しました。パブリック読み取りを Lambda 関数データソース(`a.handler.function`)に移行することは v0.2 の候補です。
15
+
16
+ ### 自動更新 — ローテーション手順は不要
17
+
18
+ `api-key-renewer` Lambda(`amplify/functions/api-key-renewer/` を参照)は、毎月 1 日の UTC 03:00 に EventBridge スケジュールで起動します。`AppSync.UpdateApiKey` を呼び出して既存キーの `expires` を「現時点 + 364 日」に延長するため、以下が保証されます:
19
+
20
+ - キー ID は変化しない
21
+ - `amplify_outputs.json` は引き続き有効
22
+ - Next.js アプリの再ビルドは不要
23
+ - 常に約 334 日以上の残有効期限が維持される
24
+
25
+ 手動で確認または実行したい場合:
26
+
27
+ ```bash
28
+ # 現在の有効期限を確認
29
+ aws appsync list-api-keys \
30
+ --region <amplify_outputs.json の data.aws_region> \
31
+ --api-id <amplify_outputs.json の data.url から導出した api-id>
32
+
33
+ # 手動実行(サンドボックスを長期間停止した後など)
34
+ aws lambda invoke \
35
+ --function-name $(aws lambda list-functions \
36
+ --query "Functions[?contains(FunctionName,'api-key-renewer')].FunctionName | [0]" \
37
+ --output text) \
38
+ /tmp/out.json && cat /tmp/out.json
39
+ ```
40
+
41
+ ### キーの漏洩が疑われる場合
42
+
43
+ 有効期限の延長ではなく、キーの値そのものをローテーションする即時対応を行います:
44
+
45
+ 1. `amplify/data/resource.ts` のコメントを編集して CFN 更新を強制する
46
+ 2. `npx ampx sandbox`(サンドボックス)または `npx ampx pipeline-deploy ...`(本番)を実行 — Amplify がキーの値を再生成する
47
+ 3. Next.js アプリを再デプロイして SSR が新しい `data.api_key` を参照するようにする
48
+
49
+ ## 一般的な操作
50
+
51
+ ### ユーザーのグループ昇格 / 降格
52
+
53
+ AWS Cognito コンソールから操作します:
54
+
55
+ 1. User Pool → Users → 対象ユーザーを選択
56
+ 2. Group memberships → グループに追加 / グループから削除
57
+ 3. ユーザーに一度サインアウトしてサインインし直してもらい、新しいクレームを適用させる
58
+
59
+ グループの種類: `ampless-admin`(フル CRUD + 運用操作)、`ampless-editor`(コンテンツ CRUD)、`ampless-reader`(将来の REST/MCP API 利用者向けに予約済み)。
60
+
61
+ ### ユーザーパスワードのリセット(管理者による上書き)
62
+
63
+ ロックアウトされており、メールによる復旧が利用できない場合:
64
+
65
+ ```bash
66
+ aws cognito-idp admin-set-user-password \
67
+ --user-pool-id <amplify_outputs.json の auth.user_pool_id> \
68
+ --region <リージョン> \
69
+ --username <メールアドレス> \
70
+ --password '<新しいパスワード>' --permanent
71
+ ```
72
+
73
+ `/login` ページにはセルフサービスの「パスワードを忘れた場合」フローもあります。
74
+
75
+ ### Post テーブルのバックアップからの復元
76
+
77
+ DynamoDB のポイントインタイムリカバリ(PITR)は v0.1 の `defineData` では有効になっていません。AWS コンソール → DynamoDB → Tables → `<投稿テーブル名>` → Backups → Edit PITR から手動で有効化してください。有効化後は `aws dynamodb restore-table-to-point-in-time` で新しいテーブルに復元し、その後アイテムをライブテーブルに移行する作業が必要です。
78
+
79
+ ### 失敗したプラグインイベントの確認
80
+
81
+ 処理に失敗したプロセッサー呼び出しは、`amplify/backend.ts` で作成された共有イベント DLQ(`EventsDlq`)に送られます。SQS コンソールまたは `aws sqs receive-message --queue-url <dlq-url> --max-number-of-messages 10` でメッセージを確認してください。v0.1 には自動アラームがないため、定期的な手動確認を推奨します。あるいは `ApproximateNumberOfMessagesVisible` に CloudWatch アラームを設定してください。
82
+
83
+ ## マルチサイト / カスタムドメイン
84
+
85
+ ampless は 1 つの Amplify Hosting デプロイメントから複数のサイトを配信できます。各サイトは `siteId` で識別され、`cms.config.ts` 内で 1 つ以上のホスト名に紐づけられます:
86
+
87
+ ```ts
88
+ sites: {
89
+ blog: {
90
+ domains: ['blog.example.com', 'www.example.com'],
91
+ name: 'My Blog',
92
+ url: 'https://blog.example.com',
93
+ },
94
+ docs: {
95
+ domains: ['docs.example.com'],
96
+ name: 'Docs',
97
+ url: 'https://docs.example.com',
98
+ },
99
+ },
100
+ ```
101
+
102
+ ミドルウェア(`middleware.ts`)が受信リクエストの `Host` を `siteId` にマッピングし、パスを `/_sites/{siteId}/...` に内部リライトします。サブドメインと完全に分離されたドメインはアプリケーション層では等価です — AWS 側の設定のみが異なります。
103
+
104
+ ### シングルドメイン運用
105
+
106
+ `sites` が未定義または 1 エントリのみの場合、ampless はシングルサイトモード(`siteId='default'`)で動作します。SSR レスポンスはルートごとのキャッシュディレクティブに従います(ルートごとに `Cache-Control: public, s-maxage=...` を指定することで CloudFront キャッシュを利用できます)。
107
+
108
+ ### マルチサイトモードの注意事項:SSR キャッシュの強制無効化
109
+
110
+ 2 つ以上のサイトが設定されている場合、ミドルウェアはすべてのパブリックレスポンスに `Cache-Control: private, no-store` を付加します。これは Amplify Hosting の CloudFront がキャッシュキーに `Host` を含まないため、キャッシュを有効にすると `https://site1/foo` と `https://site2/foo` がエッジでコンテンツを混在させてしまうためです。このトレードオフとして、すべてのパブリック読み取りが Lambda にヒットします。この制約を解消するには、Amplify Hosting から独自管理の CloudFront + Open Next スタックへの移行が必要です(ロードマップ:v1.0 以降)。
111
+
112
+ ### Amplify Hosting へのカスタムドメイン追加
113
+
114
+ バインドしたいドメインごとに以下を実施します:
115
+
116
+ 1. **Amplify Hosting コンソール** → アプリ → **Domain management** → **Add domain** を選択。
117
+ 2. 頂点ドメイン(`example.com`)と接続したいサブドメインを入力します。Amplify が ACM 証明書と CloudFront SAN エントリを自動でプロビジョニングします。
118
+ 3. DNS を更新:
119
+ - **Route 53 / Amplify 管理の DNS プロバイダー**:Amplify が CNAME を作成してくれるので、確認するだけです。
120
+ - **外部 DNS**(Cloudflare、Squarespace など):Amplify が表示する CNAME / DNS 検証レコードをコピーします。ACM のメール検証もフォールバックとして使用できます。
121
+ 4. **Domain activation** が完了するまで待ちます(通常 15〜60 分。証明書の検証が最も時間がかかります)。
122
+ 5. 新しいドメインを `cms.config.ts` の対応する `sites.{id}.domains[]` に追加して再デプロイします:
123
+ ```bash
124
+ git add cms.config.ts && git commit -m "feat: add docs.example.com"
125
+ git push # Amplify Hosting が自動検出します
126
+ ```
127
+
128
+ エンドツーエンドで確認:
129
+
130
+ ```bash
131
+ curl -I https://docs.example.com/ # 200 とドキュメントサイトの HTML
132
+ curl -sI https://docs.example.com/ | grep -i cache # Cache-Control: private, no-store
133
+ ```
134
+
135
+ リクエストが `404 Site not found` を返す場合、そのホストはいずれの `sites.*.domains[]` にも登録されていません — 設定を修正して再デプロイしてください。
@@ -1,3 +1,6 @@
1
+ > 日本語版: [RUNBOOK.ja.md](./RUNBOOK.ja.md)
2
+ >
3
+
1
4
  # Runbook
2
5
 
3
6
  Operational tasks for an ampless-powered site.
@@ -0,0 +1,5 @@
1
+ import { admin } from '@/lib/admin'
2
+ import { createMcpTokensPage } from '@ampless/admin/pages'
3
+
4
+ export const dynamic = 'force-dynamic'
5
+ export default createMcpTokensPage(admin)
@@ -0,0 +1,6 @@
1
+ import { admin } from '@/lib/admin'
2
+ import { createMcpTokensRoute } from '@ampless/admin/api'
3
+
4
+ export const dynamic = 'force-dynamic'
5
+ export const runtime = 'nodejs'
6
+ export const { GET, POST, DELETE } = createMcpTokensRoute(admin)
@@ -0,0 +1,9 @@
1
+ import { admin } from '@/lib/admin'
2
+ import { createMcpRoute } from '@ampless/admin/api'
3
+
4
+ // `force-dynamic` keeps CloudFront from caching MCP responses. Each
5
+ // tool call must hit the SSR Lambda — caching would serve stale or
6
+ // cross-token responses.
7
+ export const dynamic = 'force-dynamic'
8
+ export const runtime = 'nodejs'
9
+ export const { POST } = createMcpRoute(admin)
@@ -22,15 +22,15 @@
22
22
  "@tiptap/pm": "^3.23.4",
23
23
  "@tiptap/react": "^3.23.4",
24
24
  "@tiptap/starter-kit": "^3.23.4",
25
- "@ampless/plugin-og-image": "^0.2.0-alpha.4",
26
- "@ampless/plugin-rss": "^0.2.0-alpha.4",
27
- "@ampless/plugin-seo": "^0.2.0-alpha.4",
28
- "@ampless/plugin-webhook": "^0.2.0-alpha.4",
29
- "@ampless/admin": "^0.2.0-alpha.14",
30
- "@ampless/backend": "^0.2.0-alpha.6",
31
- "@ampless/runtime": "^0.2.0-alpha.7",
25
+ "@ampless/plugin-og-image": "^0.2.0-alpha.6",
26
+ "@ampless/plugin-rss": "^0.2.0-alpha.6",
27
+ "@ampless/plugin-seo": "^0.2.0-alpha.6",
28
+ "@ampless/plugin-webhook": "^0.2.0-alpha.6",
29
+ "@ampless/admin": "^0.2.0-alpha.17",
30
+ "@ampless/backend": "^0.2.0-alpha.8",
31
+ "@ampless/runtime": "^0.2.0-alpha.9",
32
32
  "@digital-go-jp/tailwind-theme-plugin": "^0.3.4",
33
- "ampless": "^0.2.0-alpha.4",
33
+ "ampless": "^0.2.0-alpha.6",
34
34
  "aws-amplify": "^6.10.0",
35
35
  "class-variance-authority": "^0.7.1",
36
36
  "clsx": "^2.1.1",
@@ -0,0 +1,22 @@
1
+ > English: [README.md](./README.md)
2
+ >
3
+ # Blog テーマ
4
+
5
+ shadcn/ui のデフォルトに準じたニュートラル系モノクロ。時系列の投稿フィード、個別投稿ページ、タグ別一覧を提供します。
6
+
7
+ ## カスタマイズ
8
+
9
+ `/admin/sites/<siteId>/theme` で設定:
10
+
11
+ - **プライマリカラー** — ボタン、リンク、強調表示の背景色
12
+ - **アクセントカラー**
13
+ - **フォーカスリング**
14
+ - **破壊的操作** — 削除等の操作色
15
+ - **角丸**
16
+ - **本文フォント** — システムサンセリフ / セリフ (Georgia) / セリフ (Iowan) / 等幅
17
+ - **トップに固定する記事のスラッグ** — 公開済み投稿を 1 件ホームの先頭に固定
18
+ - **ロゴ画像 URL**
19
+ - **ヘッダーナビ** — ラベル + URL のペア
20
+ - **フッターリンク** — ラベル + URL のペア
21
+
22
+ サイトごとのライト/ダークカラースキームは ampless の標準テーマトークン経由で反映されます。
@@ -1,49 +1,22 @@
1
- # {{siteName}}
1
+ > 日本語版: [README.ja.md](./README.ja.md)
2
+ >
3
+ # Blog theme
2
4
 
3
- A blog site powered by [ampless](https://github.com/heavymoons/ampless).
5
+ Neutral monochrome with shadcn/ui defaults. Chronological post feed, single-post page, and tag listing.
4
6
 
5
- ## Getting Started
7
+ ## Customizing
6
8
 
7
- This project uses Amplify Gen 2 for the backend (Cognito, DynamoDB, S3) and Next.js for the frontend.
9
+ In `/admin/sites/<siteId>/theme`:
8
10
 
9
- ```bash
10
- # 1. Install dependencies
11
- npm install
11
+ - **Primary color** — buttons, links, accent fills
12
+ - **Accent color**
13
+ - **Focus ring**
14
+ - **Destructive** — color used for destructive actions
15
+ - **Corner radius**
16
+ - **Body font** — System sans / Serif (Georgia) / Serif (Iowan) / Monospace
17
+ - **Featured post slug** — pin one published post to the top of the home page
18
+ - **Logo image URL**
19
+ - **Header navigation** — label + URL pairs
20
+ - **Footer links** — label + URL pairs
12
21
 
13
- # 2. Deploy a personal AWS sandbox + start the Next.js dev server.
14
- # Requires AWS credentials configured (`aws configure`).
15
- # First run takes ~5–10 min to provision resources;
16
- # amplify_outputs.json is regenerated each time before dev starts.
17
- npm run sandbox
18
- ```
19
-
20
- Then open [http://localhost:3000](http://localhost:3000).
21
-
22
- ## First admin user
23
-
24
- Open [http://localhost:3000/login](http://localhost:3000/login) and click **Create admin account**. The first user to register is automatically added to the `ampless-admin` Cognito group.
25
-
26
- After that, manage content from `/admin`:
27
-
28
- - `/admin` — dashboard
29
- - `/admin/posts` — list / create / edit posts (tiptap editor)
30
- - `/admin/media` — upload images to S3
31
-
32
- ## Production deploy
33
-
34
- ```bash
35
- git init && git add . && git commit -m "init"
36
- git remote add origin <your-repo>
37
- git push
38
- # Then connect the repo to AWS Amplify Hosting in the AWS console.
39
- ```
40
-
41
- ## Customize
42
-
43
- - `cms.config.ts` — site name, media delivery mode, plugins
44
- - `app/` — Next.js App Router pages (`(public)/` for the blog, `(admin)/` for the CMS)
45
- - `amplify/` — Amplify Gen 2 backend definitions (auth / data / storage)
46
-
47
- ## Plugins
48
-
49
- Enabled: {{plugins}}
22
+ Per-site light/dark color scheme is honored through the standard ampless theme tokens.
@@ -0,0 +1,18 @@
1
+ > English: [README.md](./README.md)
2
+ >
3
+ # Corporate テーマ
4
+
5
+ 企業サイト向けの落ち着いたレイアウト。明るい背景にネイビーの配色、ヒーロー + お知らせ一覧構成、ヘッダー / フッターナビ付き。
6
+
7
+ ## カスタマイズ
8
+
9
+ `/admin/sites/<siteId>/theme` で設定:
10
+
11
+ - **タグライン** — ヒーロー内、サイト名の上に表示される短いフレーズ
12
+ - **プライマリカラー**
13
+ - **角丸**
14
+ - **トップストーリーのスラッグ** — ヒーローとお知らせ一覧の間に公開済み投稿を 1 件フィーチャー
15
+ - **ロゴ画像 URL**
16
+ - **ヘッダーナビ** — ラベル + URL のペア
17
+ - **フッターリンク** — ラベル + URL のペア
18
+ - **フッター注記** — 住所 / 会社情報 / 追加の注意書き
@@ -1,19 +1,18 @@
1
- # {{siteName}}
1
+ > 日本語版: [README.ja.md](./README.ja.md)
2
+ >
3
+ # Corporate theme
2
4
 
3
- Corporate / company-site theme: navy on near-white, hero + news layout, header + footer navigation.
5
+ Conservative business / company-site layout with hero and news section. Navy on near-white, header + footer navigation.
4
6
 
5
7
  ## Customizing
6
8
 
7
9
  In `/admin/sites/<siteId>/theme`:
8
10
 
9
- - Tagline (small line above the site name in the hero)
10
- - Header navigation (label + URL pairs)
11
- - Footer links + legend (address / company info / extra small print)
12
- - Primary color, corner radius
13
-
14
- ## Getting started
15
-
16
- ```bash
17
- npm install
18
- npm run sandbox
19
- ```
11
+ - **Tagline** short phrase shown above the site name in the hero
12
+ - **Primary color**
13
+ - **Corner radius**
14
+ - **Top story slug** — feature one published post between the hero and the news section
15
+ - **Logo image URL**
16
+ - **Header navigation** — label + URL pairs
17
+ - **Footer links** — label + URL pairs
18
+ - **Footer legend** — address / company info / extra small print
@@ -0,0 +1,31 @@
1
+ > English: [README.md](./README.md)
2
+ >
3
+ # DADS テーマ
4
+
5
+ デジタル庁デザインシステム準拠のレイアウト。政府・自治体・公共系サイト向け。高コントラスト、アクセシビリティ重視、装飾控えめ。公式の **[デジタル庁デザインシステム Tailwind プラグイン](https://github.com/digital-go-jp/tailwind-theme-plugin)**(`@digital-go-jp/tailwind-theme-plugin`、MIT)をベースに構築されています。
6
+
7
+ ## プラグインが提供する機能
8
+
9
+ - **カラーパレット** — プライマリカラーに `solidBlue`(`#0017c1`)を使用し、DADS の全スケール(ライトブルー、シアン、グリーン、ライム、イエロー、オレンジ、レッド、マゼンタ)を Tailwind クラス(`bg-blue-900`、`text-blue-50` など)で利用可能
10
+ - **タイポグラフィ** — プラグイン経由で `fontFamily.sans` に Noto Sans JP を設定。`--ampless-body-font` として参照可能
11
+ - **ボーダー半径** — `rounded-4` / `rounded-6` が利用可能
12
+
13
+ `tokens.css` がプラグインの CSS 変数(`--color-blue-900` など)を ampless 標準のテーマ変数(`--primary`、`--background` など)にバインドするため、共有 chrome(SiteHeader、SiteFooter、shadcn ボタンなど)が自動的に DADS カラーで描画されます。
14
+
15
+ DADS が新しいパレットバージョンを公開した場合、`@digital-go-jp/tailwind-theme-plugin` をバージョンアップするだけでテーマに反映されます。
16
+
17
+ ## カスタマイズ
18
+
19
+ `/admin/sites/<siteId>/theme` で設定:
20
+
21
+ - **ロゴ画像 URL** — 組織マーク
22
+ - **プライマリカラー** — デフォルトは DADS の `solidBlue`。DADS 以外の色に変更するとサイトは DADS 準拠ではなくなります。
23
+ - **トップストーリーのスラッグ** — ヒーローとお知らせ一覧の間に公開済み投稿を 1 件フィーチャー
24
+ - **ヘッダーナビ** — ラベル + URL のペア
25
+ - **フッターリンク** — ラベル + URL のペア
26
+ - **フッター注記** — 住所 / 機関情報 / 追加の注意書き
27
+
28
+ ## 注意事項
29
+
30
+ - ダークモードは反転色による近似実装です。プラグイン 0.3.4 時点では DADS の公式ダークパレットは存在しません。公式ダークパレットが公開された際は、`tokens.css` のダーク変数バインディングを更新してください。
31
+ - このプラグインはデザイントークンのみを提供します。フル DADS コンポーネント(ボタン、アラート、タブなど)については [design-system-example-components](https://github.com/digital-go-jp/design-system-example-components) を参照し、必要に応じて取り込んでください。
@@ -1,6 +1,8 @@
1
- # {{siteName}}
1
+ > 日本語版: [README.ja.md](./README.ja.md)
2
+ >
3
+ # DADS theme
2
4
 
3
- DADS theme built on the official **[Digital Agency Design System Tailwind plugin](https://github.com/digital-go-jp/tailwind-theme-plugin)** (`@digital-go-jp/tailwind-theme-plugin`, MIT). Color palette and typography conform to DADS specifications, suitable for Japanese government / public-sector / institutional sites.
5
+ Government / public-sector layout following the Digital Agency Design System aesthetic. High contrast, accessibility-first, minimal decoration. Built on the official **[Digital Agency Design System Tailwind plugin](https://github.com/digital-go-jp/tailwind-theme-plugin)** (`@digital-go-jp/tailwind-theme-plugin`, MIT).
4
6
 
5
7
  ## What's plugin-backed
6
8
 
@@ -8,27 +10,22 @@ DADS theme — built on the official **[Digital Agency Design System Tailwind pl
8
10
  - **Typography** — `fontFamily.sans` set to Noto Sans JP via the plugin; surfaced through `--ampless-body-font`
9
11
  - **Border radii** — `rounded-4` / `rounded-6` available
10
12
 
11
- `templates/dads/tokens.css` binds the plugin's CSS variables (`--color-blue-900` etc.) to ampless's standard theme variables (`--primary`, `--background`, ...) so all shared chrome (SiteHeader, SiteFooter, shadcn buttons, etc.) automatically renders in DADS colors.
13
+ `tokens.css` binds the plugin's CSS variables (`--color-blue-900` etc.) to the standard ampless theme variables (`--primary`, `--background`, ...) so all shared chrome (SiteHeader, SiteFooter, shadcn buttons, etc.) automatically renders in DADS colors.
12
14
 
13
- When DADS publishes a new palette version, bumping `@digital-go-jp/tailwind-theme-plugin` in `package.json` is enough — the theme picks it up.
15
+ When DADS publishes a new palette version, bumping `@digital-go-jp/tailwind-theme-plugin` is enough — the theme picks it up.
14
16
 
15
17
  ## Customizing
16
18
 
17
19
  In `/admin/sites/<siteId>/theme`:
18
20
 
19
- - **Logo image URL** — branding (organization mark)
20
- - **Primary color** — defaults to DADS solidBlue. Changing to a non-DADS color makes the site no longer DADS-conformant.
21
- - **Top story slug** — feature one published post between hero and news
22
- - **Header navigation / Footer links / Footer legend**
21
+ - **Logo image URL** — organization mark
22
+ - **Primary color** — defaults to DADS `solidBlue`. Changing to a non-DADS color makes the site no longer DADS-conformant.
23
+ - **Top story slug** — feature one published post between the hero and the news section
24
+ - **Header navigation** label + URL pairs
25
+ - **Footer links** — label + URL pairs
26
+ - **Footer legend** — address / agency info / extra small print
23
27
 
24
28
  ## Notes
25
29
 
26
- - Dark mode uses an inverted approximation. DADS doesn't ship an official dark palette as of plugin 0.3.4; when one lands, update `templates/dads/tokens.css` to bind the dark variables.
30
+ - Dark mode uses an inverted approximation. DADS doesn't ship an official dark palette as of plugin 0.3.4; when one lands, update `tokens.css` to bind the dark variables.
27
31
  - The plugin only provides design tokens. For full DADS components (buttons, alerts, tabs, etc.), see [design-system-example-components](https://github.com/digital-go-jp/design-system-example-components) and adapt as needed.
28
-
29
- ## Getting started
30
-
31
- ```bash
32
- npm install
33
- npm run sandbox
34
- ```
@@ -0,0 +1,24 @@
1
+ > English: [README.md](./README.md)
2
+ >
3
+ # Docs テーマ
4
+
5
+ サイドバー主導のドキュメントレイアウト。サイドバー項目は通常のリンクに加え、**タグ駆動セクション**を組み合わせられます — `tag:<name>` 形式の項目を入れると、そのタグが付いた公開済み投稿の一覧に自動展開されます。タグでコンテンツを整理するだけでナビゲーションに自動反映されます。
6
+
7
+ ## カスタマイズ
8
+
9
+ `/admin/sites/<siteId>/theme` で設定:
10
+
11
+ - **プライマリカラー**
12
+ - **角丸**
13
+ - **コードフォント** — システム等幅 / JetBrains Mono
14
+ - **サイドバーナビ** — 各行は `ラベル` + `URL`。URL には以下を指定可能:
15
+ - パス(`/getting-started`)
16
+ - 外部 URL(`https://...`)
17
+ - タグ参照(`tag:tutorials`)→ 見出し + タグ付き投稿一覧として描画
18
+ - **ロゴ画像 URL**
19
+ - **ヘッダーナビ** — トップレベルのリンク
20
+ - **フッターリンク** — ラベル + URL のペア
21
+
22
+ ## 執筆のヒント
23
+
24
+ 投稿に `guide` タグを付けて、サイドバーに URL `tag:guide` の行を追加するだけ。新しい記事を公開しても手動でリンクを編集する必要はなく、サイドバーに自動で並びます。
@@ -1,26 +1,24 @@
1
- # {{siteName}}
1
+ > 日本語版: [README.ja.md](./README.ja.md)
2
+ >
3
+ # Docs theme
2
4
 
3
- Docs theme: sidebar-led documentation layout. The sidebar combines plain links with **tag-driven sections** — entering a URL like `tag:guide` in the sidebar nav field auto-expands to a list of every published post tagged "guide". Lets writers organize content by tag and have it appear in nav automatically.
5
+ Sidebar-led documentation layout. The sidebar combines plain links with **tag-driven sections** — a sidebar entry of the form `tag:<name>` auto-expands into a list of every published post with that tag. Lets writers organize content by tag and have it appear in nav automatically.
4
6
 
5
7
  ## Customizing
6
8
 
7
9
  In `/admin/sites/<siteId>/theme`:
8
10
 
11
+ - **Primary color**
12
+ - **Corner radius**
13
+ - **Code font** — System monospace / JetBrains Mono
9
14
  - **Sidebar navigation** — each row is `Label` + `URL`. The URL can be:
10
15
  - a path (`/getting-started`)
11
16
  - an external URL (`https://...`)
12
17
  - a tag reference (`tag:tutorials`) → renders as a heading + list of tagged posts
13
- - Header navigation (top-level links)
14
- - Code font (system mono / JetBrains Mono / etc.)
15
- - Primary color, corner radius
18
+ - **Logo image URL**
19
+ - **Header navigation** top-level links
20
+ - **Footer links** label + URL pairs
16
21
 
17
22
  ## Authoring tip
18
23
 
19
24
  Tag a post `guide` (in the post editor) and add a sidebar row with URL `tag:guide`. The sidebar will list that post automatically — no manual link editing every time you publish.
20
-
21
- ## Getting started
22
-
23
- ```bash
24
- npm install
25
- npm run sandbox
26
- ```
@@ -0,0 +1,20 @@
1
+ > English: [README.md](./README.md)
2
+ >
3
+ # Landing テーマ
4
+
5
+ 1 ページ完結型のヒーロー中心レイアウト。任意で「最新記事」グリッドも併設可能。ヘッダー / フッターナビ設定とウォームコーラル系アクセントパレットを備えます。
6
+
7
+ ## カスタマイズ
8
+
9
+ `/admin/sites/<siteId>/theme` で設定:
10
+
11
+ - **ヒーロー見出し** — 空欄ならサイト名を使用
12
+ - **ヒーローサブ見出し** — 空欄ならサイト説明を使用
13
+ - **CTA ボタンのテキスト**
14
+ - **CTA リンク先**
15
+ - **プライマリカラー**
16
+ - **角丸**
17
+ - **フィーチャー記事のスラッグ** — 公開済み投稿を 1 件ホームに固定
18
+ - **ロゴ画像 URL**
19
+ - **ヘッダーナビ** — ラベル + URL のペア
20
+ - **フッターリンク** — ラベル + URL のペア
@@ -1,24 +1,20 @@
1
- # {{siteName}}
1
+ > 日本語版: [README.ja.md](./README.ja.md)
2
+ >
3
+ # Landing theme
2
4
 
3
- A site powered by [ampless](https://github.com/heavymoons/ampless), using the **Landing** theme — hero-led single-page layout with optional "Latest" post grid, configurable header / footer nav, and a warm-coral accent palette.
5
+ Single-page hero focus with optional "Latest" post grid. Hero-led layout with configurable header / footer nav and a warm-coral accent palette.
4
6
 
5
7
  ## Customizing
6
8
 
7
9
  In `/admin/sites/<siteId>/theme`:
8
10
 
9
- - Hero headline / subheadline / CTA button text + URL
10
- - Header navigation (label + URL pairs)
11
- - Footer links
12
- - Primary color
13
- - Corner radius
14
-
15
- Empty hero fields fall back to the site name / description from `/admin/sites/<siteId>`.
16
-
17
- ## Getting started
18
-
19
- ```bash
20
- npm install
21
- npm run sandbox # provision the AWS backend + start Next.js
22
- ```
23
-
24
- See the project README for full setup.
11
+ - **Hero headline** empty falls back to the site name
12
+ - **Hero subheadline** empty falls back to the site description
13
+ - **CTA button text**
14
+ - **CTA URL**
15
+ - **Primary color**
16
+ - **Corner radius**
17
+ - **Featured post slug** pin one published post to the home page
18
+ - **Logo image URL**
19
+ - **Header navigation** — label + URL pairs
20
+ - **Footer links** — label + URL pairs
@@ -0,0 +1,14 @@
1
+ > English: [README.md](./README.md)
2
+ >
3
+ # Minimal テーマ
4
+
5
+ shadcn/ui のカラートークンをベースにした、暖色系ニュートラル地にソフトブルーをアクセントとした構成。カスタマイズ項目を絞ったシンプルなブログレイアウトで、デザインを主張させたくない場合に向きます。
6
+
7
+ ## カスタマイズ
8
+
9
+ `/admin/sites/<siteId>/theme` で設定:
10
+
11
+ - **プライマリカラー**
12
+ - **角丸**
13
+
14
+ 以上です。フォントや複数のアクセントカラー、フッター / ナビゲーションの制御など、より細かい調整が必要な場合は `blog` テーマを利用してください。
@@ -1,49 +1,14 @@
1
- # {{siteName}}
1
+ > 日本語版: [README.ja.md](./README.ja.md)
2
+ >
3
+ # Minimal theme
2
4
 
3
- A blog site powered by [ampless](https://github.com/heavymoons/ampless), using the **Minimal** theme — a soft blue accent on a warm-neutral background, derived from shadcn/ui's color tokens.
5
+ Soft blue accent on a warm-neutral background, derived from shadcn/ui's color tokens. Stripped-down blog layout with very few customization knobs — pick this when you want the design to disappear.
4
6
 
5
- ## Getting Started
7
+ ## Customizing
6
8
 
7
- This project uses Amplify Gen 2 for the backend (Cognito, DynamoDB, S3) and Next.js for the frontend.
9
+ In `/admin/sites/<siteId>/theme`:
8
10
 
9
- ```bash
10
- # 1. Install dependencies
11
- npm install
11
+ - **Primary color**
12
+ - **Corner radius**
12
13
 
13
- # 2. Deploy a personal AWS sandbox + start the Next.js dev server.
14
- # Requires AWS credentials configured (`aws configure`).
15
- # First run takes ~5–10 min to provision resources;
16
- # amplify_outputs.json is regenerated each time before dev starts.
17
- npm run sandbox
18
- ```
19
-
20
- Then open [http://localhost:3000](http://localhost:3000).
21
-
22
- ## First admin user
23
-
24
- Open [http://localhost:3000/login](http://localhost:3000/login) and click **Create admin account**. The first user to register is automatically added to the `ampless-admin` Cognito group.
25
-
26
- After that, manage content from `/admin`:
27
-
28
- - `/admin` — dashboard
29
- - `/admin/posts` — list / create / edit posts (tiptap editor)
30
- - `/admin/media` — upload images to S3
31
-
32
- ## Production deploy
33
-
34
- ```bash
35
- git init && git add . && git commit -m "init"
36
- git remote add origin <your-repo>
37
- git push
38
- # Then connect the repo to AWS Amplify Hosting in the AWS console.
39
- ```
40
-
41
- ## Customize
42
-
43
- - `cms.config.ts` — site name, media delivery mode, plugins
44
- - `app/` — Next.js App Router pages (`(public)/` for the blog, `(admin)/` for the CMS)
45
- - `amplify/` — Amplify Gen 2 backend definitions (auth / data / storage)
46
-
47
- ## Plugins
48
-
49
- Enabled: {{plugins}}
14
+ That's it. For richer customization (fonts, multiple accent colors, footer / nav controls), use the `blog` theme.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "create-ampless",
3
- "version": "0.2.0-alpha.16",
3
+ "version": "0.2.0-alpha.18",
4
4
  "description": "Create a new ampless project",
5
5
  "license": "MIT",
6
6
  "type": "module",