ampless を始めるのに用意するもの

ampless はサーバレス CMS なので、常時動かす管理サーバーを自分で立てる必要はありません。代わりに、AWS の上でいくつかのアカウントとツールを最初に組み合わせて使います。何が必須で、何があると楽になるかを、最初の 1 サイトを立ち上げる前提で並べておきます。

必須

AWS アカウント

ampless は Amplify Gen 2 が前提なので、AWS アカウントが 1 つ要ります。新規でも、すでに使っているアカウントを使い回しても構いません。AppSync、DynamoDB、S3、Cognito、Lambda、CloudFront などはデプロイ時に Amplify がまとめて作ってくれるので、料金は使った分だけの従量課金になります。

ふだんは無料枠の範囲で収まります。最初の 1 か月、勉強がてら触ってみるくらいなら、よほど巨大な画像を載せない限り請求が出ないことが多いです。

AWS CLI

ampless のローカル開発・本番デプロイコマンドは、内部で AWS SDK を呼び出します。ローカルの AWS 認証情報（~/.aws/credentials か SSO セッション）を見に行く設計なので、それを用意する一番手軽な手段として AWS CLI を入れておくのが定番です。

Mac で入っていなければ、Homebrew が一番手早いです。

brew install awscli
aws configure sso   # 組織で SSO を使っている場合
# あるいは IAM ユーザのアクセスキーで直接設定するなら
aws configure

組織で SSO を使っているなら IAM Identity Center 経由が素直です。個人アカウントなら IAM ユーザーを 1 つ作って、アクセスキーをローカルに置く形が早めです。

GitHub アカウント

本番デプロイは Amplify Hosting に Git リポジトリを接続して走らせる前提です。リポジトリ自体は create-ampless ウィザードがリポジトリ名を聞いて自動で作り、初回 push まで通してくれるので、自分で空のリポジトリを用意する必要はありません。

Amplify Hosting 自体は GitLab や Bitbucket、AWS CodeCommit でも動きますが、create-ampless の自動化と公開しているドキュメントは GitHub を前提に書いてあります。

Node.js

npx create-ampless@latest を動かす関係で、Node.js も要ります。LTS の最新を入れておくのが無難です。

Mac なら Homebrew で入れるか、複数バージョンを切り替えたい場合は nvm 経由が楽です。

# 固定バージョンで入れるなら
brew install node

# 複数バージョンを切り替えたいなら nvm
brew install nvm
nvm install --lts

あると楽になる

gh コマンド

GitHub の公式 CLI です。create-ampless ウィザードがこれを使ってリポジトリ作成と初回 push を端末側で完結させてくれるので、事前に gh auth login だけ済ませておけば、リポジトリ名を入力するだけでセットアップが進みます。

brew install gh
gh auth login

無くても動きます。その場合は GitHub のサイトでリポジトリを手動で作って、origin を繋ぐ手間が 1 〜 2 ステップ増えるだけです。

Route 53 のドメイン

独自ドメインで公開するなら、Route 53 で DNS をホストしている形がおすすめです。Amplify Hosting と紐づけると、所有権検証から CloudFront 向けレコードの追加、証明書発行までを Amplify 側でまとめてやってくれます。セットアップが圧倒的に楽です。

複数サイトをサブドメインで分けるときも同じで、blog.example.com や docs.example.com の追加レコードを Route 53 に自動で書き込んでくれます。サイトを増やすたびに DNS 画面を開き直さなくて済みます。

無くても動きます。Amplify が https://main.<random>.amplifyapp.com の形の URL を発行してくれるので、開発用や個人サイトならそのまま使えます。Cloudflare、お名前.com、Google Domains などで管理しているドメインを使う構成も可能ですが、Amplify が示す検証用レコードと CloudFront 向けレコードを、それぞれのプロバイダの管理画面で手動登録する作業が出てきます。

コーディングエージェント

Claude Code、Claude Desktop、Cursor など、MCP に対応したエージェントがあると、記事の投入やテーマの細かい調整を、チャット越しに進められます。MCP HTTP トランスポートに amk_... トークンで繋ぐ方式なので、エージェント側に AWS のクレデンシャルを渡す必要はありません。

無くても、管理画面の /admin から普通に書けます。あくまで「使うとそういう運用もできる」という選択肢のひとつです。詳しくは mcp-http-transport を参照してください。

最初の流れ

ひととおり揃ったら、おおまかに次の順で進みます。

# 1. 空のサイトを生成（途中でリポジトリ名や AWS プロファイルを聞かれます）
npx create-ampless@latest

cd <生成されたディレクトリ>

# 2. ローカル開発用の AWS リソースとローカルサーバーをまとめて起動
npm run sandbox

サーバが立ち上がったら、ブラウザで http://localhost:3000/admin を開いて初回の管理者アカウントを登録します。あとは管理画面から出荷時の 6 テーマ（blog / corporate / dads / docs / landing / minimal）の中から好みを選んで、最初の投稿を書いてみます。

本番に出すタイミングで GitHub に push すれば、create-ampless で繋いだ Amplify Hosting のビルドパイプラインがそのまま走ります。

create-ampless のウィザードがこのあたりを順番に案内してくれるので、表示に沿って進めば最後まで通ります。

自分のテーマを作る

ひととおり動かして雰囲気が掴めたら、出荷テーマのコピーから自サイト専用のテーマを切り出して、独自色を付けていきます。

npm run copy-theme docs my-docs

引数は順に、ベースにするテーマ名（blog / corporate / dads / docs / landing / minimal）、新しいテーマ名です。my- で始まる名前にしておくと、後で配布テーマとの衝突を避けやすくなります。実行すると themes/my-docs/ 配下にひと揃いのファイルが複製されます。

以降は themes/my-<name>/ の中だけを編集していけば、公式テーマ側のアップデートを取り込んでも自分のカスタマイズは壊れません。色や角丸、サイドバーナビのような軽い設定は管理画面で済ませて、コンポーネント構造やレイアウトの調整は themes/my-<name>/ のコードで触る、という分け方が素直です。

公式テーマや依存パッケージの更新は、別途次のコマンドで取り込めます。

npm run update-ampless

ampless の全体像 → what-is-ampless
投稿フォーマット → post-formats
MCP HTTP トランスポート → mcp-http-transport

必須