AWS Amplify 全栈托管

1. 安装 CLI — npm i -g @aws-amplify/cli，然后 amplify configure 配 AWS 凭证 2. 初始化项目 — 前端仓库中 amplify init，创建 amplify/ 后端配置 + 环境 3. 加后端 — amplify add auth（Cognito）、add api（AppSync GraphQL）、add storage（S3） 4. 推后端 — amplify push 配置 CloudFormation 栈，输出 aws-exports.js 5. 连接托管 — Amplify 控制台 → 托管 web 应用 → 连接仓库，设构建 + 启动命令 6. 分支部署 — 每个 git 分支自动获独立后端环境（dev/staging/prod） 7. CI/CD — Amplify 控制台 push 时构建、测试、部署；用 amplify.yml 自定义 8. 自定义域名 — 控制台添加，Route53 或外部 DNS 用 CNAME 指向 amplifyapp.com

# amplify.yml — CI/CD 构建规格（仓库根） version: 1 backend: phases: build: commands: - amplify push --yes frontend: phases: preBuild: commands: - npm ci build: commands: - npm run build artifacts: baseDirectory: .next files: - '**/*' cache: paths: - node_modules/**/* - .next/cache/**/* # CLI 工作流 — 加鉴权 + GraphQL API # amplify add auth # > 默认配置（Cognito User Pool + Identity Pool） # amplify add api # > GraphQL # > 继续编辑？是 — 编辑 schema.graphql # amplify push // schema.graphql — AppSync schema type Todo @model @auth(rules: [{allow: owner}]) { id: ID! title: String! completed: Boolean! owner: String } // 前端用法 — 生成的 hooks import { withAuthenticatorator } from "@aws-amplify/ui-react"; import { listTodos } from "./graphql/queries"; function App({ signOut, user }) { const { data } = useQuery(listTodos); return <div>你好 {user.username} <button onClick={signOut}>登出</button></div>; } export default withAuthenticatorator(App);