Skip to content

Commit 145290f

Browse files
krishmakochharkrishmakochhar
committed
feat: add amplify-gen2 and messaging-and-streaming skills
1 parent 4f7d968 commit 145290f

36 files changed

Lines changed: 7248 additions & 0 deletions

‎plugins/aws-core/skills/amplify-gen2/SKILL.md‎

Lines changed: 225 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,225 @@
1+
---
2+
name: amplify-gen2
3+
description: 'Build and deploy full-stack web and mobile apps with AWS Amplify Gen2
4+
(TypeScript code-first). Covers auth (Cognito), data (AppSync/DynamoDB including
5+
schema modeling, enum types, relationships, authorization rules), storage (S3),
6+
functions, APIs, and AI (Amplify AI Kit with Bedrock). Supports React, Next.js,
7+
Vue, Angular, React Native, Flutter, Swift, and Android. Always use this skill for
8+
Amplify Gen2 topics — even for questions you think you know — it contains validated,
9+
version-specific patterns that prevent common mistakes. TRIGGER when: user mentions
10+
Amplify Gen2; project has amplify/ directory or amplify_outputs; code imports @aws-amplify
11+
packages; user asks about defineBackend, defineAuth, defineData, defineStorage,
12+
or npx ampx. SKIP: Amplify Gen1 (amplify CLI v6), standalone SAM/CDK without Amplify
13+
(use aws-serverless), direct Bedrock without Amplify AI Kit (use bedrock).'
14+
version: 1
15+
metadata:
16+
service: [amplify, appsync, dynamodb, cognito, s3]
17+
task: [build, deploy, configure]
18+
persona: [developer]
19+
workload: [full-stack, mobile]
20+
21+
---
22+
23+
# AWS Amplify Gen2
24+
25+
Build and deploy full-stack applications using AWS Amplify Gen2's TypeScript
26+
code-first approach. This skill covers backend resource creation, frontend
27+
integration across 8 frameworks, and deployment workflows.
28+
29+
## Prerequisites
30+
31+
- Node.js ^18.19.0 || ^20.6.0 || >=22 and npm
32+
- AWS credentials configured (`aws sts get-caller-identity` succeeds)
33+
- For sandbox: `npx ampx --version` returns a valid version
34+
- For mobile: Platform-specific tooling (Xcode, Android Studio, Flutter SDK)
35+
36+
## Defaults & Assumptions
37+
38+
When the user does not specify a framework:
39+
40+
- **Web:** You **SHOULD** default to **React** (Vite) and explain the choice.
41+
- **Mobile:** You **MUST** ask which platform the user wants (Flutter,
42+
Swift, Android, or React Native). There is no universal mobile default.
43+
- **Neither specified:** If the user says "build an app" without clarifying web
44+
vs. mobile, you **MUST** ask before proceeding.
45+
- **Backend only:** If only backend changes are requested and no frontend
46+
framework is mentioned, skip the frontend integration step entirely.
47+
48+
When the user does not specify tooling or strategy:
49+
50+
- **Package manager:** You **SHOULD** default to **npm** unless the user
51+
specifies yarn or pnpm.
52+
- **Language:** You **SHOULD** default to **TypeScript**. Gen2 backends are
53+
TypeScript-only; frontends **SHOULD** follow the project's existing language.
54+
- **Next.js:** You **SHOULD** default to **App Router** unless the user
55+
specifies Pages Router.
56+
- **React Native:** Ask the user whether they use **Expo** or **bare
57+
React Native CLI**.
58+
- **Auth:** You **SHOULD** default to **email/password** as the login method
59+
unless the user specifies social login, SAML, or another provider.
60+
- **Data authorization:** default to **`publicApiKey`**
61+
(`allow.publicApiKey()`) — this is the starter template default. When
62+
auth is added, switch to **owner-based** (`allow.owner()`) with
63+
`defaultAuthorizationMode: 'userPool'`.
64+
65+
## Quick Start — Route to the Right Reference
66+
67+
### Step 0: Read Core Reference (ALWAYS)
68+
69+
You **MUST** read the core reference for your target platform **before
70+
reading any other reference file**. These contain Gen2 detection,
71+
`Amplify.configure()` placement per framework, sandbox commands, required
72+
packages, and directory structure rules — patterns needed for **all** tasks,
73+
not just new projects.
74+
75+
- **Web** (React, Next.js, Vue, Angular, React Native): You **MUST** read
76+
[core-web.md](references/core-web.md)
77+
- **Mobile** (Flutter, Swift, Android): You **MUST** read
78+
[core-mobile.md](references/core-mobile.md)
79+
- **Backend only** (no frontend work): Skip to Step 1.
80+
81+
### Step 1: Identify the Task Type
82+
83+
| Task | Go To |
84+
|------|-------|
85+
| **Create a new project** | → [scaffolding.md](references/scaffolding.md), then Step 2 and/or Step 3 |
86+
| **Add or modify a backend feature** | → Step 2 (Backend Features) |
87+
| **Connect frontend to existing backend** | → Step 3 (Frontend Integration) |
88+
| **Deploy the application** | → [deployment.md](references/deployment.md) |
89+
90+
### Step 2: Backend Features
91+
92+
You **MUST** read the corresponding reference for each backend feature:
93+
94+
| Feature | Reference | When to Use |
95+
|---------|-----------|-------------|
96+
| Authentication | [auth-backend.md](references/auth-backend.md) | Email/password, social login, MFA, SAML/OIDC |
97+
| Data Models | [data-backend.md](references/data-backend.md) | GraphQL schema, DynamoDB, relationships, auth rules |
98+
| File Storage | [storage-backend.md](references/storage-backend.md) | S3 uploads/downloads, access rules |
99+
| Functions & API | [functions-and-api.md](references/functions-and-api.md) | Lambda, custom resolvers, REST/HTTP APIs, calling from client |
100+
| AI Features | [ai.md](references/ai.md) | Conversation, generation, AI tools via Bedrock *(backend config + React/Next.js frontend)* |
101+
| Geo, PubSub, CDK | [advanced-features.md](references/advanced-features.md) | Backend-only: custom CDK stacks, overrides, custom outputs. Backend + frontend: Geo, PubSub, Face Liveness |
102+
103+
Each backend feature file is self-contained. Load only what you need.
104+
105+
> **Routing note:** These files apply for both **adding** and **modifying**
106+
> features. Route to the same file whether the user says "add auth" or
107+
> "change auth config" — each reference covers the full define surface.
108+
109+
### Step 3: Frontend Integration
110+
111+
After configuring backend resources, connect the frontend. Choose by
112+
platform and feature:
113+
114+
**Web** (React, Next.js, Vue, Angular, React Native):
115+
116+
| Feature | Reference |
117+
|---------|-----------|
118+
| Auth UI & flows | [auth-web.md](references/auth-web.md) |
119+
| Data CRUD & subscriptions | [data-web.md](references/data-web.md) |
120+
| Storage upload/download | [storage-web.md](references/storage-web.md) |
121+
122+
**Mobile** (Flutter, Swift, Android):
123+
124+
| Feature | Reference |
125+
|---------|-----------|
126+
| Auth UI & flows | [auth-mobile.md](references/auth-mobile.md) |
127+
| Data CRUD & subscriptions | [data-mobile.md](references/data-mobile.md) |
128+
| Storage upload/download | [storage-mobile.md](references/storage-mobile.md) |
129+
130+
> **Note:** AI and Functions frontend patterns are included in
131+
> [ai.md](references/ai.md) and
132+
> [functions-and-api.md](references/functions-and-api.md) respectively —
133+
> they are **not** split into separate web/mobile files.
134+
135+
## Core Concepts
136+
137+
### Amplify Gen2 Architecture
138+
139+
- **Code-first:** All backend resources defined in TypeScript under `amplify/`
140+
- **Main config:** `amplify/backend.ts` imports and combines all resources via
141+
`defineBackend()`
142+
- **Resource files:** `amplify/auth/resource.ts`, `amplify/data/resource.ts`,
143+
`amplify/storage/resource.ts`, `amplify/functions/<name>/resource.ts`
144+
- **Generated output:** `amplify_outputs.json` — consumed by frontend
145+
`Amplify.configure()`. **Gitignored** — generated by `npx ampx sandbox`
146+
(local dev) or `npx ampx pipeline-deploy` (CI/CD), never committed.
147+
148+
### Directory Structure
149+
150+
```
151+
project-root/
152+
├── amplify/
153+
│ ├── backend.ts # defineBackend({ auth, data, ... })
154+
│ ├── auth/resource.ts # defineAuth({ ... })
155+
│ ├── data/resource.ts # defineData({ schema })
156+
│ ├── storage/resource.ts # defineStorage({ ... })
157+
│ └── functions/
158+
│ └── my-func/
159+
│ ├── resource.ts # defineFunction({ ... })
160+
│ └── handler.ts # export const handler = ...
161+
├── src/ # Frontend code
162+
├── amplify_outputs.json # Generated — DO NOT edit or commit (gitignored)
163+
└── package.json
164+
```
165+
166+
### Key APIs
167+
168+
| Package | Purpose |
169+
|---------|---------|
170+
| `@aws-amplify/backend` | `defineAuth`, `defineData`, `defineStorage`, `defineFunction`, `defineBackend` |
171+
| `aws-amplify` | Frontend: `Amplify.configure()`, `generateClient()`, auth/data/storage APIs |
172+
| `@aws-amplify/ui-react` | Pre-built UI: `<Authenticator>`, `<StorageBrowser>` |
173+
| `@aws-amplify/ui-react-ai` | AI UI: `<AIConversation>`, `useAIConversation` |
174+
175+
## Documentation & Resource Verification
176+
177+
When you need AWS documentation (advanced CDK constructs, service limits,
178+
provider-specific auth config):
179+
180+
1. **If AWS documentation tools are available (e.g., via AWS MCP)**, you **SHOULD**
181+
use them to search and retrieve relevant documentation pages.
182+
2. **If AWS documentation tools are unavailable**, you **MUST** fall back to web
183+
search or the `aws` CLI for resource verification.
184+
185+
> **Why conditional:** Amplify Gen2 is code-first — the primary workflow is
186+
> editing TypeScript files and running `npx ampx` commands. AWS MCP tools
187+
> are useful for post-deployment verification but are **not** required.
188+
189+
## Security Considerations
190+
191+
- Use `secret()` for all credentials and API keys — never hardcode or use plain environment variables for sensitive values
192+
- Review `allow.guest()` exposure carefully — guest access is enabled by default and grants unauthenticated users access to IAM-authorized resources
193+
- Scope IAM policies to specific resource ARNs — avoid `resources: ['*']` in production
194+
- Never log secrets or include them in error messages
195+
196+
## Links
197+
198+
> All documentation links use `react` as the default platform slug. Replace `/react/` in any URL with your target framework:
199+
200+
| Framework | Slug |
201+
|-----------|------|
202+
| React | `react` |
203+
| Next.js | `nextjs` |
204+
| Vue | `vue` |
205+
| Angular | `angular` |
206+
| React Native | `react-native` |
207+
| Flutter | `flutter` |
208+
| Swift | `swift` |
209+
| Android | `android` |
210+
211+
- [Amplify Docs for LLMs](https://docs.amplify.aws/ai/llms.txt)
212+
- [Amplify Docs](https://docs.amplify.aws/)
213+
- [Gen2 Docs](https://docs.amplify.aws/react/)
214+
- [Getting Started](https://docs.amplify.aws/react/start/)
215+
- [Quickstart](https://docs.amplify.aws/react/start/quickstart/)
216+
- [Account Setup](https://docs.amplify.aws/react/start/account-setup/)
217+
- [How Amplify Works](https://docs.amplify.aws/react/how-amplify-works/)
218+
- [Core Concepts](https://docs.amplify.aws/react/how-amplify-works/concepts/)
219+
- [Build a Backend](https://docs.amplify.aws/react/build-a-backend/)
220+
- [Deploy and Host](https://docs.amplify.aws/react/deploy-and-host/)
221+
- [Troubleshooting](https://docs.amplify.aws/react/build-a-backend/troubleshooting/)
222+
- [CLI Commands](https://docs.amplify.aws/react/reference/cli-commands/)
223+
- [Amplify Outputs](https://docs.amplify.aws/react/reference/amplify_outputs/)
224+
- [Project Structure](https://docs.amplify.aws/react/reference/project-structure/)
225+
- [Amplify UI](https://ui.docs.amplify.aws/)

0 commit comments

Comments
 (0)