@aws/nx-plugin-mcp 1.0.0-rc.97 → 1.0.0
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/bin/aws-nx-mcp.js +41 -42
- package/docs/get_started/building-with-ai.mdx +21 -14
- package/docs/get_started/concepts.mdx +1 -1
- package/docs/get_started/existing-project.mdx +7 -4
- package/docs/get_started/quick-start.mdx +202 -53
- package/docs/get_started/tutorials/dungeon-game/1.mdx +11 -6
- package/docs/get_started/tutorials/dungeon-game/2.mdx +1 -1
- package/docs/get_started/tutorials/dungeon-game/4.mdx +5 -0
- package/docs/get_started/tutorials/dungeon-game/overview.mdx +1 -6
- package/docs/get_started/tutorials/dungeon-game/wrap-up.mdx +10 -1
- package/docs/guides/license.mdx +30 -6
- package/docs/guides/nx-generator.mdx +11 -12
- package/docs/guides/ts-nx-plugin.mdx +17 -7
- package/docs/guides/typescript-infrastructure.mdx +3 -1
- package/docs/snippets/pdk-migration/example/01-migrate-api.mdx +7 -5
- package/docs/snippets/pdk-migration/example/02-migrate-website.mdx +2 -1
- package/docs/snippets/pdk-migration/example/03-migrate-infra.mdx +3 -2
- package/docs/snippets/pdk-migration/example/04-deploy.mdx +8 -7
- package/docs/snippets/pdk-migration/faq/type-safe-api.mdx +3 -3
- package/docs/snippets/prerequisites.mdx +0 -5
- package/docs/snippets/recommended-prerequisites.mdx +1 -1
- package/docs/snippets/workspace-prerequisite.mdx +8 -0
- package/package.json +1 -1
package/bin/aws-nx-mcp.js
CHANGED
|
@@ -21915,22 +21915,22 @@ const kebabCase = (str) => {
|
|
|
21915
21915
|
const NX_VERSION = {
|
|
21916
21916
|
"@a2a-js/sdk": "0.3.14",
|
|
21917
21917
|
"@aws/aws-distro-opentelemetry-node-autoinstrumentation": "0.12.0",
|
|
21918
|
-
"@opentelemetry/propagator-jaeger": "2.
|
|
21918
|
+
"@opentelemetry/propagator-jaeger": "2.11.0",
|
|
21919
21919
|
minimatch: "10.2.6",
|
|
21920
|
-
"deepmerge-ts": "8.0.
|
|
21921
|
-
mysql2: "3.
|
|
21922
|
-
"@aws-sdk/client-dynamodb": "3.
|
|
21923
|
-
"@aws-sdk/client-api-gateway": "3.
|
|
21924
|
-
"@aws-sdk/client-iam": "3.
|
|
21925
|
-
"@aws-sdk/client-bedrock-agentcore": "3.
|
|
21926
|
-
"@aws-sdk/client-bedrock-runtime": "3.
|
|
21927
|
-
"@aws-sdk/client-s3": "3.
|
|
21928
|
-
"@aws-sdk/client-sts": "3.
|
|
21929
|
-
"@aws-sdk/client-cognito-identity-provider": "3.
|
|
21930
|
-
"@aws-sdk/credential-providers": "3.
|
|
21920
|
+
"deepmerge-ts": "8.0.2",
|
|
21921
|
+
mysql2: "3.24.3",
|
|
21922
|
+
"@aws-sdk/client-dynamodb": "3.1126.0",
|
|
21923
|
+
"@aws-sdk/client-api-gateway": "3.1126.0",
|
|
21924
|
+
"@aws-sdk/client-iam": "3.1126.0",
|
|
21925
|
+
"@aws-sdk/client-bedrock-agentcore": "3.1126.0",
|
|
21926
|
+
"@aws-sdk/client-bedrock-runtime": "3.1126.0",
|
|
21927
|
+
"@aws-sdk/client-s3": "3.1126.0",
|
|
21928
|
+
"@aws-sdk/client-sts": "3.1126.0",
|
|
21929
|
+
"@aws-sdk/client-cognito-identity-provider": "3.1126.0",
|
|
21930
|
+
"@aws-sdk/credential-providers": "3.1126.0",
|
|
21931
21931
|
"@aws-sdk/credential-provider-cognito-identity": "3.972.69",
|
|
21932
|
-
"@aws-sdk/client-secrets-manager": "3.
|
|
21933
|
-
"@aws-sdk/rds-signer": "3.
|
|
21932
|
+
"@aws-sdk/client-secrets-manager": "3.1126.0",
|
|
21933
|
+
"@aws-sdk/rds-signer": "3.1126.0",
|
|
21934
21934
|
"@smithy/server-apigateway": "0.3.3",
|
|
21935
21935
|
"@smithy/server-node": "0.3.3",
|
|
21936
21936
|
"@aws-lambda-powertools/logger": "2.35.0",
|
|
@@ -21938,7 +21938,7 @@ const NX_VERSION = {
|
|
|
21938
21938
|
"@aws-lambda-powertools/parameters": "2.35.0",
|
|
21939
21939
|
"@aws-lambda-powertools/tracer": "2.35.0",
|
|
21940
21940
|
"@aws-lambda-powertools/parser": "2.35.0",
|
|
21941
|
-
"@aws-sdk/client-appconfigdata": "3.
|
|
21941
|
+
"@aws-sdk/client-appconfigdata": "3.1126.0",
|
|
21942
21942
|
"@middy/core": "7.9.2",
|
|
21943
21943
|
"@nxlv/python": "23.0.0",
|
|
21944
21944
|
"@nx-extend/terraform": "10.4.1",
|
|
@@ -21953,14 +21953,14 @@ const NX_VERSION = {
|
|
|
21953
21953
|
"@swc-node/register": "1.12.1",
|
|
21954
21954
|
"@swc/core": "1.16.1",
|
|
21955
21955
|
"@modelcontextprotocol/sdk": "1.30.0",
|
|
21956
|
-
"@modelcontextprotocol/inspector": "2.
|
|
21956
|
+
"@modelcontextprotocol/inspector": "2.5.0",
|
|
21957
21957
|
"@ag-ui/a2ui-toolkit": "0.0.4",
|
|
21958
21958
|
"@ag-ui/aws-strands": "0.2.3",
|
|
21959
|
-
"@ag-ui/client": "0.0.
|
|
21960
|
-
"@ag-ui/core": "0.0.
|
|
21961
|
-
"@ag-ui/encoder": "0.0.
|
|
21959
|
+
"@ag-ui/client": "0.0.59",
|
|
21960
|
+
"@ag-ui/core": "0.0.59",
|
|
21961
|
+
"@ag-ui/encoder": "0.0.59",
|
|
21962
21962
|
"agent-chat-cli": "0.3.0",
|
|
21963
|
-
"@copilotkit/react-core": "1.
|
|
21963
|
+
"@copilotkit/react-core": "1.70.1",
|
|
21964
21964
|
rxjs: "7.8.2",
|
|
21965
21965
|
"@strands-agents/sdk": "1.15.0",
|
|
21966
21966
|
"@tanstack/react-router": "1.170.32",
|
|
@@ -21968,46 +21968,46 @@ const NX_VERSION = {
|
|
|
21968
21968
|
"@tanstack/router-generator": "1.167.33",
|
|
21969
21969
|
"@tanstack/virtual-file-routes": "1.162.0",
|
|
21970
21970
|
"@tanstack/router-utils": "1.162.2",
|
|
21971
|
-
"@cloudscape-design/board-components": "3.0.
|
|
21972
|
-
"@cloudscape-design/chat-components": "1.0.
|
|
21973
|
-
"@cloudscape-design/components": "3.0.
|
|
21971
|
+
"@cloudscape-design/board-components": "3.0.222",
|
|
21972
|
+
"@cloudscape-design/chat-components": "1.0.166",
|
|
21973
|
+
"@cloudscape-design/components": "3.0.1359",
|
|
21974
21974
|
"@cloudscape-design/global-styles": "1.0.67",
|
|
21975
21975
|
"@tanstack/react-query": "5.102.8",
|
|
21976
21976
|
"@tanstack/react-query-devtools": "5.102.8",
|
|
21977
21977
|
"@trpc/tanstack-react-query": "11.18.0",
|
|
21978
21978
|
"@trpc/client": "11.18.0",
|
|
21979
21979
|
"@trpc/server": "11.18.0",
|
|
21980
|
-
"@types/node": "26.4.
|
|
21981
|
-
"@types/aws-lambda": "8.10.
|
|
21980
|
+
"@types/node": "26.4.1",
|
|
21981
|
+
"@types/aws-lambda": "8.10.163",
|
|
21982
21982
|
"@types/cors": "2.8.19",
|
|
21983
21983
|
"@types/pg": "8.23.1",
|
|
21984
21984
|
"@types/ws": "8.18.1",
|
|
21985
21985
|
"@types/express": "5.0.6",
|
|
21986
21986
|
"@smithy/config-resolver": "4.7.2",
|
|
21987
21987
|
"@smithy/node-config-provider": "4.6.2",
|
|
21988
|
-
"@smithy/node-http-handler": "4.
|
|
21989
|
-
"@smithy/types": "4.
|
|
21988
|
+
"@smithy/node-http-handler": "4.12.1",
|
|
21989
|
+
"@smithy/types": "4.18.0",
|
|
21990
21990
|
"@vitest/coverage-v8": "4.1.11",
|
|
21991
21991
|
"@vitest/ui": "4.1.11",
|
|
21992
|
-
"@astrojs/react": "6.0.
|
|
21993
|
-
"@astrojs/starlight": "0.
|
|
21994
|
-
astro: "7.
|
|
21992
|
+
"@astrojs/react": "6.0.5",
|
|
21993
|
+
"@astrojs/starlight": "0.42.0",
|
|
21994
|
+
astro: "7.3.1",
|
|
21995
21995
|
cookie: "2.0.1",
|
|
21996
21996
|
aws4fetch: "1.0.20",
|
|
21997
21997
|
"aws-cdk": "2.1139.0",
|
|
21998
|
-
"aws-cdk-lib": "2.
|
|
21998
|
+
"aws-cdk-lib": "2.268.0",
|
|
21999
21999
|
"aws-xray-sdk-core": "3.12.0",
|
|
22000
22000
|
constructs: "10.8.1",
|
|
22001
22001
|
cors: "2.8.6",
|
|
22002
22002
|
chalk: "6.0.0",
|
|
22003
22003
|
"class-variance-authority": "0.7.1",
|
|
22004
|
-
|
|
22004
|
+
cn: "0.2.5",
|
|
22005
22005
|
commander: "15.0.0",
|
|
22006
22006
|
electrodb: "3.9.3",
|
|
22007
22007
|
esbuild: "0.28.2",
|
|
22008
22008
|
"event-source-polyfill": "1.0.31",
|
|
22009
22009
|
"@types/event-source-polyfill": "1.0.5",
|
|
22010
|
-
"@biomejs/biome": "2.5.
|
|
22010
|
+
"@biomejs/biome": "2.5.12",
|
|
22011
22011
|
"@prisma/adapter-mariadb": "7.10.0",
|
|
22012
22012
|
"@prisma/adapter-pg": "7.10.0",
|
|
22013
22013
|
"@prisma/client": "7.10.0",
|
|
@@ -22018,8 +22018,8 @@ const NX_VERSION = {
|
|
|
22018
22018
|
husky: "9.1.7",
|
|
22019
22019
|
"fs-extra": "11.4.0",
|
|
22020
22020
|
"@types/fs-extra": "11.0.4",
|
|
22021
|
-
mariadb: "3.5.
|
|
22022
|
-
mise: "2026.
|
|
22021
|
+
mariadb: "3.5.4",
|
|
22022
|
+
mise: "2026.9.1",
|
|
22023
22023
|
npm: "12.0.2",
|
|
22024
22024
|
"npm-check-updates": "23.1.0",
|
|
22025
22025
|
"oidc-client-ts": "3.5.0",
|
|
@@ -22028,24 +22028,23 @@ const NX_VERSION = {
|
|
|
22028
22028
|
"react-oidc-context": "3.3.1",
|
|
22029
22029
|
react: "19.2.8",
|
|
22030
22030
|
"react-dom": "19.2.8",
|
|
22031
|
-
rolldown: "1.2.
|
|
22032
|
-
"rolldown-plugin-dts": "0.28.
|
|
22031
|
+
rolldown: "1.2.7",
|
|
22032
|
+
"rolldown-plugin-dts": "0.28.5",
|
|
22033
22033
|
shx: "0.4.0",
|
|
22034
22034
|
"simple-git": "3.36.0",
|
|
22035
22035
|
"source-map-support": "0.5.21",
|
|
22036
22036
|
"starlight-blog": "0.29.0",
|
|
22037
22037
|
tailwindcss: "4.3.3",
|
|
22038
22038
|
"@tailwindcss/vite": "4.3.3",
|
|
22039
|
-
tsx: "4.23.
|
|
22040
|
-
"lucide-react": "1.
|
|
22039
|
+
tsx: "4.23.13",
|
|
22040
|
+
"lucide-react": "1.40.0",
|
|
22041
22041
|
"radix-ui": "1.6.7",
|
|
22042
|
-
shadcn: "4.
|
|
22042
|
+
shadcn: "4.21.0",
|
|
22043
22043
|
"tw-animate-css": "1.4.0",
|
|
22044
|
-
"tailwind-merge": "3.6.0",
|
|
22045
22044
|
vite: "8.2.2",
|
|
22046
22045
|
typescript: "6.0.3",
|
|
22047
22046
|
vitest: "4.1.11",
|
|
22048
|
-
jsdom: "
|
|
22047
|
+
jsdom: "29.1.1",
|
|
22049
22048
|
zod: "4.5.4",
|
|
22050
22049
|
ws: "8.21.3"
|
|
22051
22050
|
}.nx;
|
|
@@ -6,14 +6,23 @@ description: Building with AI and the Nx Plugin for AWS MCP Server
|
|
|
6
6
|
import Link from "@components/link.astro";
|
|
7
7
|
import Snippet from "@components/snippet.astro";
|
|
8
8
|
import { Steps, Tabs, TabItem } from "@astrojs/starlight/components";
|
|
9
|
+
import Prompt from "@components/prompt.astro";
|
|
9
10
|
|
|
10
|
-
|
|
11
|
+
## Already configured in your workspace
|
|
11
12
|
|
|
12
|
-
|
|
13
|
+
Workspaces created with the Nx Plugin for AWS preset include project-level MCP configuration for common coding agents — Claude Code, Cursor, Kiro, Gemini CLI, GitHub Copilot and OpenAI Codex — so an agent working inside the workspace can use the plugin's [MCP server](https://modelcontextprotocol.io/introduction) with no further setup.
|
|
13
14
|
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
15
|
+
Open your workspace in your assistant and ask it for what you want:
|
|
16
|
+
|
|
17
|
+
<Prompt>
|
|
18
|
+
Add a React website with an AG-UI agent, an MCP server for its tools and a DynamoDB table, and wire them together.
|
|
19
|
+
</Prompt>
|
|
20
|
+
|
|
21
|
+
It looks up the generators the plugin offers, runs them in the order their dependencies need. Use your agent to fill in the business logic from there.
|
|
22
|
+
|
|
23
|
+
## Install globally
|
|
24
|
+
|
|
25
|
+
The workspace configuration above is enough to build with. You can install globally if you'd like to use AI to create new workspaces, or <Link path="get_started/existing-project">add the Nx Plugin for AWS to an existing project</Link>:
|
|
17
26
|
|
|
18
27
|
<Tabs syncKey="ai-assistant">
|
|
19
28
|
<TabItem label="Kiro">
|
|
@@ -101,16 +110,14 @@ Workspaces created with the Nx Plugin for AWS preset already include project-lev
|
|
|
101
110
|
|
|
102
111
|
## Start Vibe Coding
|
|
103
112
|
|
|
104
|
-
|
|
113
|
+
With the plugin available globally, your assistant can create the workspace too. Try a prompt like:
|
|
105
114
|
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
>
|
|
115
|
+
<Prompt>
|
|
116
|
+
Build a multi-agent application using the Nx Plugin for AWS. I want a React frontend that talks to a backend orchestrator agent which delegates to specialised research and writing agents.
|
|
117
|
+
</Prompt>
|
|
109
118
|
|
|
110
119
|
Or for a smaller starting point:
|
|
111
120
|
|
|
112
|
-
>
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
Check out the <Link path="/guides/ts-mcp-server">`ts#mcp-server` generator guide</Link> for details about building your own MCP Server.
|
|
121
|
+
<Prompt>
|
|
122
|
+
Use the Nx Plugin for AWS to scaffold a React website backed by a tRPC API, with Cognito auth and CDK infrastructure.
|
|
123
|
+
</Prompt>
|
|
@@ -50,7 +50,7 @@ In practice:
|
|
|
50
50
|
- **Upgrading is automated, not a re-adoption exercise.** A workspace generated months ago can move forward with the plugin rather than drifting further from it.
|
|
51
51
|
- **Customisations are pattern-matched, not overwritten.** Migrations check that a file still matches the shape the generator produced. Where it has diverged beyond what they can safely update, they leave your code alone and report the manual follow-up instead.
|
|
52
52
|
- **Some changes arrive as agent prompts.** Where the right edit depends on what you've built, the migration is a prompt your AI coding agent applies rather than a codemod.
|
|
53
|
-
- **Upgrades are opt-in.** Nothing in your workspace changes until you choose to run `nx migrate`.
|
|
53
|
+
- **Upgrades are opt-in.** Nothing in your workspace changes until you choose to run `nx migrate`. After running, you drop any changes you'd rather not take before you commit.
|
|
54
54
|
|
|
55
55
|
Migrations narrow the gap rather than close it: how far your code has moved decides how much they can do, and some steps will still need your hands.
|
|
56
56
|
|
|
@@ -10,13 +10,16 @@ import NxCommands from '@components/nx-commands.astro';
|
|
|
10
10
|
import NxInitCommand from '@components/nx-init-command.astro';
|
|
11
11
|
import TsConfigBaseCompilerOptions from '@components/tsconfig-base-compiler-options.astro';
|
|
12
12
|
import GeneratorParameters from '@components/generator-parameters.astro';
|
|
13
|
+
import Prompt from '@components/prompt.astro';
|
|
13
14
|
|
|
14
15
|
Not every project starts with `pnpm create @aws/nx-workspace`. If you already have an [Nx workspace](https://nx.dev) — or a monorepo you can add Nx to — you can adopt `@aws/nx-plugin` incrementally without recreating your project.
|
|
15
16
|
|
|
16
|
-
<Aside type="tip">
|
|
17
|
-
|
|
17
|
+
<Aside type="tip" title="Use your coding agent">
|
|
18
|
+
Your agentic coding tool of choice can add the plugin for you, using the <Link path="get_started/building-with-ai">MCP server</Link>. Try the prompt:
|
|
18
19
|
|
|
19
|
-
>
|
|
20
|
+
<Prompt>
|
|
21
|
+
Add the Nx Plugin for AWS to this project.
|
|
22
|
+
</Prompt>
|
|
20
23
|
</Aside>
|
|
21
24
|
|
|
22
25
|
## Prerequisites
|
|
@@ -56,7 +59,7 @@ Nx and the plugin are distributed as npm packages, so a project with no Node.js
|
|
|
56
59
|
}
|
|
57
60
|
```
|
|
58
61
|
|
|
59
|
-
Create that file, then run `nx init` and [add the plugin](#adding-the-plugin) as usual. Your existing language tooling is untouched — Nx projects generated by the plugin (including <Link path="guides/
|
|
62
|
+
Create that file, then run `nx init` and [add the plugin](#adding-the-plugin) as usual. Your existing language tooling is untouched — Nx projects generated by the plugin (including <Link path="guides/python-project">Python projects</Link>) live alongside your existing code, and you can wire your existing build into Nx incrementally.
|
|
60
63
|
|
|
61
64
|
To bring your existing projects under Nx, you have a few options depending on the language:
|
|
62
65
|
|
|
@@ -3,6 +3,7 @@ title: Quick Start Guide
|
|
|
3
3
|
description: "A quick start on how to use @aws/nx-plugin."
|
|
4
4
|
---
|
|
5
5
|
import { Steps } from '@astrojs/starlight/components';
|
|
6
|
+
import Drawer from '@components/drawer.astro';
|
|
6
7
|
import Link from '@components/link.astro';
|
|
7
8
|
import Snippet from '@components/snippet.astro';
|
|
8
9
|
import CreateNxWorkspaceCommand from '@components/create-nx-workspace-command.astro';
|
|
@@ -12,94 +13,100 @@ import RunGenerator from '@components/run-generator.astro';
|
|
|
12
13
|
import NxCommands from '@components/nx-commands.astro';
|
|
13
14
|
import Infrastructure from '@components/infrastructure.astro';
|
|
14
15
|
import EmbeddedGraph from '@components/embedded-graph.astro';
|
|
16
|
+
import Diff from '@components/diff.astro';
|
|
17
|
+
import Prompt from '@components/prompt.astro';
|
|
15
18
|
|
|
16
19
|
This guide walks you through the basics of installing and using `@aws/nx-plugin` to rapidly build projects on AWS.
|
|
17
20
|
|
|
18
|
-
:::tip[Full-Stack Tutorial]
|
|
19
|
-
For a more in-depth tutorial for building a full-stack application, check out the <Link path="get_started/tutorials/dungeon-game/overview">Dungeon Adventure Tutorial</Link>.
|
|
20
|
-
:::
|
|
21
|
-
|
|
22
21
|
## Prerequisites
|
|
23
22
|
|
|
24
23
|
The following global dependencies are needed before proceeding:
|
|
25
24
|
|
|
26
25
|
<Snippet name="prerequisites" />
|
|
27
26
|
|
|
28
|
-
## Step 1:
|
|
27
|
+
## Step 1: Create a Workspace
|
|
29
28
|
|
|
30
|
-
|
|
29
|
+
Create an <Link path="guides/workspace">Nx workspace</Link> with the package manager of your choice, and open the directory it creates:
|
|
31
30
|
|
|
32
31
|
<CreateNxWorkspaceCommand workspace="my-project" />
|
|
33
32
|
|
|
34
|
-
:::tip[Choosing an IaC Provider]
|
|
35
|
-
You will be prompted for your preferred infrastructure as code (IaC) provider, either [CDK](https://docs.aws.amazon.com/cdk/) or [Terraform](https://developer.hashicorp.com/terraform). You can skip the prompt by running the command with `--iac`, ie:
|
|
36
|
-
|
|
37
|
-
<Infrastructure>
|
|
38
|
-
<Fragment slot="cdk">
|
|
39
|
-
<CreateNxWorkspaceCommand workspace="my-project" iac="cdk" />
|
|
40
|
-
</Fragment>
|
|
41
|
-
<Fragment slot="terraform">
|
|
42
|
-
<CreateNxWorkspaceCommand workspace="my-project" iac="terraform" />
|
|
43
|
-
</Fragment>
|
|
44
|
-
</Infrastructure>
|
|
45
|
-
:::
|
|
46
|
-
|
|
47
|
-
Once complete, navigate to the project directory:
|
|
48
|
-
|
|
49
33
|
```sh
|
|
50
34
|
cd my-project
|
|
51
35
|
```
|
|
52
36
|
|
|
53
|
-
|
|
37
|
+
You are prompted to choose your infrastructure as code provider, either [CDK](https://docs.aws.amazon.com/cdk/) or [Terraform](https://developer.hashicorp.com/terraform), and the container engine used by generators which build container images.
|
|
54
38
|
|
|
55
|
-
|
|
39
|
+
## Step 2: Build Your Application
|
|
56
40
|
|
|
57
|
-
|
|
41
|
+
We'll build a full-stack application: a tRPC API, a React website, Cognito authentication, and CDK or Terraform infrastructure. Ask an AI assistant to scaffold it for you, or run the generators yourself — both routes reach the same workspace.
|
|
58
42
|
|
|
59
|
-
|
|
43
|
+
### With AI
|
|
60
44
|
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
:::
|
|
45
|
+
<Steps>
|
|
46
|
+
1. Open the workspace in your AI coding assistant.
|
|
64
47
|
|
|
65
|
-
|
|
48
|
+
New workspaces come with the plugin's <Link path="get_started/building-with-ai">MCP server</Link> already configured for Kiro, Claude Code, Cursor, Gemini CLI, GitHub Copilot and OpenAI Codex, so your assistant can look up the plugin's generators and run them without any setup.
|
|
66
49
|
|
|
67
|
-
|
|
50
|
+
2. Ask for the application:
|
|
51
|
+
|
|
52
|
+
<Prompt>
|
|
53
|
+
Create a tRPC API called demo-api, and a React website called demo-website. Add Cognito authentication to the website, connect the website to the API, and add an infrastructure project called infra. Then instantiate the generated infrastructure components so the website and API deploy, granting authenticated users access to the API.
|
|
54
|
+
</Prompt>
|
|
55
|
+
|
|
56
|
+
Your assistant discovers the generators through the MCP server and runs them, in the order their dependencies need. Review the changes it makes, then carry on at Step 3.
|
|
57
|
+
</Steps>
|
|
68
58
|
|
|
69
|
-
|
|
59
|
+
### With the CLI
|
|
60
|
+
|
|
61
|
+
Run the generators that scaffold the application. Use the button below to copy them all, or run each one yourself as described beneath the diagram.
|
|
62
|
+
|
|
63
|
+
<Infrastructure>
|
|
64
|
+
<Fragment slot="cdk">
|
|
65
|
+
<EmbeddedGraph preset="quick-start" workspace="my-project" iac="cdk" orientation="horizontal" skipWorkspace />
|
|
66
|
+
</Fragment>
|
|
67
|
+
<Fragment slot="terraform">
|
|
68
|
+
<EmbeddedGraph preset="quick-start" workspace="my-project" iac="terraform" orientation="horizontal" skipWorkspace />
|
|
69
|
+
</Fragment>
|
|
70
|
+
</Infrastructure>
|
|
71
|
+
|
|
72
|
+
Depending on the type of project you're building, you can choose any combination of generators to quickly bootstrap your project. Check out the __Generators__ in the navigation bar to the left to see the full list of options, or try the <Link path="get_started/graph-builder">graph builder</Link> to construct your workspace visually.
|
|
73
|
+
|
|
74
|
+
#### Add a tRPC API
|
|
75
|
+
|
|
76
|
+
<RunGenerator generator="ts#api" requiredParameters={{ name: 'demo-api', framework: 'trpc' }} positional={['name']} noInteractive />
|
|
70
77
|
|
|
71
78
|
This will create the API inside the `packages/demo-api` folder.
|
|
72
79
|
|
|
73
|
-
|
|
80
|
+
#### Add a React Website
|
|
74
81
|
|
|
75
|
-
<RunGenerator generator="ts#website" requiredParameters={{ name: 'demo-website' }} noInteractive />
|
|
82
|
+
<RunGenerator generator="ts#website" requiredParameters={{ name: 'demo-website' }} positional={['name']} noInteractive />
|
|
76
83
|
|
|
77
84
|
This scaffolds a new React website in `packages/demo-website`.
|
|
78
85
|
|
|
79
|
-
|
|
86
|
+
#### Add Cognito Authentication
|
|
80
87
|
|
|
81
|
-
<RunGenerator generator="ts#website#auth" requiredParameters={{ project: '
|
|
88
|
+
<RunGenerator generator="ts#website#auth" requiredParameters={{ project: 'demo-website' }} noInteractive />
|
|
82
89
|
|
|
83
90
|
This sets up the necessary infrastructure and React code to add Cognito Authentication to your website.
|
|
84
91
|
|
|
85
|
-
|
|
92
|
+
#### Connect Frontend to Backend
|
|
86
93
|
|
|
87
|
-
<RunGenerator generator="connection" requiredParameters={{ sourceProject: '
|
|
94
|
+
<RunGenerator generator="connection" requiredParameters={{ sourceProject: 'demo-website', targetProject: 'demo-api' }} noInteractive />
|
|
88
95
|
|
|
89
96
|
This configures the necessary providers to ensure your website can call your tRPC API.
|
|
90
97
|
|
|
91
|
-
|
|
98
|
+
#### Add Infrastructure
|
|
92
99
|
|
|
93
100
|
Add the infrastructure project based on your chosen IAC provider.
|
|
94
101
|
|
|
95
102
|
<Infrastructure>
|
|
96
103
|
<Fragment slot="cdk">
|
|
97
|
-
<RunGenerator generator="ts#infra" requiredParameters={{ name: 'infra' }} noInteractive />
|
|
104
|
+
<RunGenerator generator="ts#infra" requiredParameters={{ name: 'infra' }} positional={['name']} noInteractive />
|
|
98
105
|
|
|
99
106
|
This configures a CDK App which you can use to deploy your infrastructure on AWS.
|
|
100
107
|
</Fragment>
|
|
101
108
|
<Fragment slot="terraform">
|
|
102
|
-
<RunGenerator generator="terraform#project" requiredParameters={{ name: 'infra' }} noInteractive />
|
|
109
|
+
<RunGenerator generator="terraform#project" requiredParameters={{ name: 'infra' }} positional={['name']} noInteractive />
|
|
103
110
|
|
|
104
111
|
This configures a Terraform project which you can use to deploy your infrastructure on AWS.
|
|
105
112
|
</Fragment>
|
|
@@ -115,6 +122,67 @@ Your website will be available at `http://localhost:4200`.
|
|
|
115
122
|
|
|
116
123
|
Changes to both your website and API will be reflected in real-time as both the local website and API servers will hot-reload.
|
|
117
124
|
|
|
125
|
+
<Drawer title="Calling your API from your website" trigger="Try it: call the API from your website">
|
|
126
|
+
|
|
127
|
+
Connecting the website to the API added a `useDemoApi` hook, which returns a [tRPC options proxy](https://trpc.io/docs/client/tanstack-react-query): every procedure on your API offers `queryOptions` and `mutationOptions` to hand to [TanStack Query](https://tanstack.com/query/latest).
|
|
128
|
+
|
|
129
|
+
Update `packages/demo-website/src/routes/index.tsx` to call the API's `echo` procedure, showing a spinner while the request is in flight:
|
|
130
|
+
|
|
131
|
+
<Diff lang="tsx" before={`import { createFileRoute } from '@tanstack/react-router';
|
|
132
|
+
|
|
133
|
+
export const Route = createFileRoute('/')({
|
|
134
|
+
component: RouteComponent,
|
|
135
|
+
});
|
|
136
|
+
|
|
137
|
+
function RouteComponent() {
|
|
138
|
+
return (
|
|
139
|
+
<div className="text-center">
|
|
140
|
+
<header>
|
|
141
|
+
<h1>Welcome</h1>
|
|
142
|
+
<p>Welcome to your new React website!</p>
|
|
143
|
+
</header>
|
|
144
|
+
</div>
|
|
145
|
+
);
|
|
146
|
+
}
|
|
147
|
+
`} after={`import { useQuery } from '@tanstack/react-query';
|
|
148
|
+
import { createFileRoute } from '@tanstack/react-router';
|
|
149
|
+
import { Spinner } from '../components/spinner';
|
|
150
|
+
import { useDemoApi } from '../hooks/useDemoApi';
|
|
151
|
+
|
|
152
|
+
export const Route = createFileRoute('/')({
|
|
153
|
+
component: RouteComponent,
|
|
154
|
+
});
|
|
155
|
+
|
|
156
|
+
function RouteComponent() {
|
|
157
|
+
const trpc = useDemoApi();
|
|
158
|
+
const echo = useQuery(
|
|
159
|
+
trpc.echo.queryOptions({ message: 'Hello from the API!' }),
|
|
160
|
+
);
|
|
161
|
+
|
|
162
|
+
return (
|
|
163
|
+
<div className="text-center">
|
|
164
|
+
<header>
|
|
165
|
+
<h1>Welcome</h1>
|
|
166
|
+
<p>Welcome to your new React website!</p>
|
|
167
|
+
</header>
|
|
168
|
+
{echo.isLoading ? (
|
|
169
|
+
<Spinner />
|
|
170
|
+
) : echo.error ? (
|
|
171
|
+
<p>Error: {echo.error.message}</p>
|
|
172
|
+
) : (
|
|
173
|
+
<p>{echo.data?.message}</p>
|
|
174
|
+
)}
|
|
175
|
+
</div>
|
|
176
|
+
);
|
|
177
|
+
}
|
|
178
|
+
`} />
|
|
179
|
+
|
|
180
|
+
Save the file and the page reloads with the message your API echoed back. The call is type-safe end to end — rename `message` in `packages/demo-api/src/schema/echo.ts` and your website stops compiling until you follow the change through.
|
|
181
|
+
|
|
182
|
+
See the <Link path="guides/connection/react-trpc">React to tRPC connection guide</Link> for mutations, subscriptions, error handling and optimistic updates.
|
|
183
|
+
|
|
184
|
+
</Drawer>
|
|
185
|
+
|
|
118
186
|
## Step 4: Define Cloud Resources and Deploy to AWS
|
|
119
187
|
|
|
120
188
|
<Infrastructure>
|
|
@@ -122,8 +190,12 @@ Changes to both your website and API will be reflected in real-time as both the
|
|
|
122
190
|
Open `packages/infra/src/stacks/application-stack.ts` and add the following code:
|
|
123
191
|
|
|
124
192
|
```typescript
|
|
193
|
+
import {
|
|
194
|
+
DemoApi,
|
|
195
|
+
DemoWebsite,
|
|
196
|
+
UserIdentity,
|
|
197
|
+
} from '@my-project/common-constructs';
|
|
125
198
|
import { Stack, StackProps } from 'aws-cdk-lib';
|
|
126
|
-
import { DemoApi, DemoWebsite, UserIdentity } from '@my-project/common-constructs';
|
|
127
199
|
import { Construct } from 'constructs';
|
|
128
200
|
|
|
129
201
|
export class ApplicationStack extends Stack {
|
|
@@ -147,11 +219,6 @@ This is all the CDK we need to write to deploy our full stack application.
|
|
|
147
219
|
Open `packages/infra/src/main.tf` and add the following code:
|
|
148
220
|
|
|
149
221
|
```hcl
|
|
150
|
-
# Include metrics tracking for @aws/nx-plugin usage
|
|
151
|
-
module "metrics" {
|
|
152
|
-
source = "../../common/terraform/src/metrics"
|
|
153
|
-
}
|
|
154
|
-
|
|
155
222
|
# Deploy user identity
|
|
156
223
|
module "user_identity" {
|
|
157
224
|
source = "../../common/terraform/src/core/user-identity"
|
|
@@ -178,8 +245,8 @@ resource "aws_iam_policy" "api_invoke_policy" {
|
|
|
178
245
|
Version = "2012-10-17"
|
|
179
246
|
Statement = [
|
|
180
247
|
{
|
|
181
|
-
Effect
|
|
182
|
-
Action
|
|
248
|
+
Effect = "Allow"
|
|
249
|
+
Action = "execute-api:Invoke"
|
|
183
250
|
Resource = "${module.demo_api.api_execution_arn}/*/*"
|
|
184
251
|
}
|
|
185
252
|
]
|
|
@@ -206,6 +273,15 @@ module "demo_website" {
|
|
|
206
273
|
|
|
207
274
|
depends_on = [module.user_identity, module.demo_api]
|
|
208
275
|
}
|
|
276
|
+
|
|
277
|
+
# Print the website URL and user pool id when the deployment finishes
|
|
278
|
+
output "website_url" {
|
|
279
|
+
value = module.demo_website.website_url
|
|
280
|
+
}
|
|
281
|
+
|
|
282
|
+
output "user_pool_id" {
|
|
283
|
+
value = module.user_identity.user_pool_id
|
|
284
|
+
}
|
|
209
285
|
```
|
|
210
286
|
|
|
211
287
|
This is all the Terraform we need to write to deploy our full stack application.
|
|
@@ -218,13 +294,13 @@ Next, run the following command to build your project:
|
|
|
218
294
|
|
|
219
295
|
<PackageManagerShortCommand commands={["build"]} />
|
|
220
296
|
|
|
221
|
-
:::tip[Fixing Lint Errors]
|
|
222
|
-
If you encounter any lint errors, you can run the following command to automatically fix them.
|
|
297
|
+
:::tip[Fixing Lint and Formatting Errors]
|
|
298
|
+
If you encounter any lint or formatting errors, you can run the following command to automatically fix them.
|
|
223
299
|
|
|
224
300
|
<PackageManagerShortCommand commands={["lint"]} />
|
|
225
301
|
:::
|
|
226
302
|
|
|
227
|
-
:::
|
|
303
|
+
:::note[The workspace is out of sync]
|
|
228
304
|
If the build reports `The workspace is out of sync`, accept the prompt to sync the workspace or run the following sync command directly before retrying the build:
|
|
229
305
|
|
|
230
306
|
<NxCommands commands={["sync"]} />
|
|
@@ -239,7 +315,9 @@ Bootstrap your infrastructure:
|
|
|
239
315
|
<NxCommands commands={['bootstrap infra']} />
|
|
240
316
|
|
|
241
317
|
:::tip[Bootstrap Regions]
|
|
242
|
-
CDK bootstrapping is required for both your target deployment AWS region, and `us-east-1` to allow deployment of the AWS WAF WebACL for the website.
|
|
318
|
+
CDK bootstrapping is required for both your target deployment AWS region, and `us-east-1` to allow deployment of the AWS WAF WebACL for the website. If you are deploying elsewhere, bootstrap `us-east-1` too:
|
|
319
|
+
|
|
320
|
+
<NxCommands commands={['run infra:bootstrap --args="aws://<account-id>/us-east-1"']} />
|
|
243
321
|
:::
|
|
244
322
|
</Fragment>
|
|
245
323
|
<Fragment slot="terraform">
|
|
@@ -280,6 +358,77 @@ This command will first run `terraform plan` to show you what changes will be ma
|
|
|
280
358
|
|
|
281
359
|
Your website will be available at `http://localhost:4200`, and will point to the resources you deployed for the API and authentication.
|
|
282
360
|
|
|
283
|
-
|
|
361
|
+
To sign in, you will need to [create a user in the Cognito user pool](https://docs.aws.amazon.com/cognito/latest/developerguide/how-to-create-user-accounts.html).
|
|
362
|
+
|
|
363
|
+
<Drawer title="Creating a user with the AWS CLI" trigger="Click here for instructions using the AWS CLI">
|
|
364
|
+
|
|
365
|
+
The following command creates a user in a user pool. You can find the user pool id in your deployment outputs, or in the [Amazon Cognito console](https://console.aws.amazon.com/cognito/). Substitute values for username, email, first and last name, and the temporary password.
|
|
366
|
+
|
|
367
|
+
```sh
|
|
368
|
+
aws cognito-idp admin-create-user \
|
|
369
|
+
--user-pool-id <user pool id> \
|
|
370
|
+
--username <username> \
|
|
371
|
+
--user-attributes Name=email,Value=<email> Name=email_verified,Value=true Name=given_name,Value=<first name> Name=family_name,Value=<last name> \
|
|
372
|
+
--temporary-password '<temporary password>' \
|
|
373
|
+
--message-action SUPPRESS
|
|
374
|
+
```
|
|
375
|
+
|
|
376
|
+
The first time you sign in as this user you are prompted to choose a new password, then to set up multi-factor authentication with either a code sent by SMS or a time-based one time password from an authenticator app.
|
|
377
|
+
|
|
378
|
+
</Drawer>
|
|
379
|
+
|
|
380
|
+
Your website is also served from CloudFront. Open its distribution domain name (which is printed to your terminal after deployment) to use the version running entirely on AWS.
|
|
284
381
|
|
|
285
382
|
Congratulations! 🎉 You have successfully built and deployed a full-stack application using `@aws/nx-plugin`!
|
|
383
|
+
|
|
384
|
+
## Step 6: Clean Up
|
|
385
|
+
|
|
386
|
+
When you have finished, delete the resources you deployed to avoid ongoing costs:
|
|
387
|
+
|
|
388
|
+
<Infrastructure>
|
|
389
|
+
<Fragment slot="cdk">
|
|
390
|
+
<NxCommands commands={['destroy-sandbox infra']} />
|
|
391
|
+
|
|
392
|
+
:::note[Retained Resources]
|
|
393
|
+
The Cognito user pool is created with deletion protection enabled, so it is not removed automatically. Delete it (and the IAM role Cognito uses to send SMS messages) manually if you no longer need them.
|
|
394
|
+
:::
|
|
395
|
+
</Fragment>
|
|
396
|
+
<Fragment slot="terraform">
|
|
397
|
+
<NxCommands commands={['destroy infra']} />
|
|
398
|
+
|
|
399
|
+
:::note[Retained Resources]
|
|
400
|
+
The Cognito user pool is created with deletion protection enabled, so it is not removed automatically (the destroy command will report a failure). Delete it (and the IAM role Cognito uses to send SMS messages) manually if you no longer need them.
|
|
401
|
+
:::
|
|
402
|
+
</Fragment>
|
|
403
|
+
</Infrastructure>
|
|
404
|
+
|
|
405
|
+
To remove bootstrap resources, follow below:
|
|
406
|
+
|
|
407
|
+
<Infrastructure>
|
|
408
|
+
<Fragment slot="cdk">
|
|
409
|
+
Delete the bootstrap stack in every region you bootstrapped, including `us-east-1`. This removes the bootstrap roles and the container image repository:
|
|
410
|
+
|
|
411
|
+
```sh
|
|
412
|
+
aws cloudformation delete-stack --stack-name CDKToolkit --region <region>
|
|
413
|
+
```
|
|
414
|
+
|
|
415
|
+
:::note[Asset Bucket]
|
|
416
|
+
The asset bucket is retained on purpose, so delete it separately.
|
|
417
|
+
:::
|
|
418
|
+
</Fragment>
|
|
419
|
+
<Fragment slot="terraform">
|
|
420
|
+
<NxCommands commands={['bootstrap-destroy infra']} />
|
|
421
|
+
|
|
422
|
+
:::caution[Your Terraform State Is Deleted Too]
|
|
423
|
+
This empties and deletes the S3 bucket holding your Terraform state, so only run it once you have torn down all deployed infrastructure.
|
|
424
|
+
:::
|
|
425
|
+
</Fragment>
|
|
426
|
+
</Infrastructure>
|
|
427
|
+
|
|
428
|
+
---
|
|
429
|
+
|
|
430
|
+
## Next Steps
|
|
431
|
+
|
|
432
|
+
- <Link path="get_started/tutorials/dungeon-game/overview">Dungeon Adventure Tutorial</Link> — build a full-stack AI dungeon adventure game, for a more in-depth walkthrough than this guide.
|
|
433
|
+
- <Link path="guides/workspace">Workspaces</Link> — how your workspace is laid out, and the configuration the generators share.
|
|
434
|
+
- <Link path="get_started/existing-project">Add to an Existing Project</Link> — adopt the plugin in your existing codebase.
|
|
@@ -282,7 +282,10 @@ export class GameApi<
|
|
|
282
282
|
} as FunctionProps,
|
|
283
283
|
buildDefaultIntegration: (op, props: FunctionProps) => {
|
|
284
284
|
const handler = new Function(scope, `GameApi${op}Handler`, props);
|
|
285
|
-
handler.addEnvironment(
|
|
285
|
+
handler.addEnvironment(
|
|
286
|
+
'RUNTIME_CONFIG_APP_ID',
|
|
287
|
+
rc.appConfigApplicationId,
|
|
288
|
+
);
|
|
286
289
|
rc.grantReadAppConfig(handler);
|
|
287
290
|
return {
|
|
288
291
|
handler,
|
|
@@ -1397,6 +1400,7 @@ The `connection` generator generates/updates these files:
|
|
|
1397
1400
|
- copilot/
|
|
1398
1401
|
- **index.tsx** Shadcn-themed `CopilotChat` / `CopilotSidebar` / `CopilotPopup`
|
|
1399
1402
|
- ShadcnAssistantMessage.tsx, ShadcnUserMessage.tsx, ShadcnChatInput.tsx, ShadcnCursor.tsx, copilot.css
|
|
1403
|
+
- story-agent-chat.tsx a `CopilotChat` pre-bound to the Story Agent's `agentId`
|
|
1400
1404
|
- hooks/
|
|
1401
1405
|
- **useAguiStoryAgent.tsx** Builds an `HttpAgent`, injects the Cognito bearer token, and pads `threadId` to AgentCore's 33-char session id
|
|
1402
1406
|
- **main.tsx** Wraps `<App />` in `<AguiProvider>`
|
|
@@ -1476,6 +1480,8 @@ new ApplicationStage(app, 'dungeon-adventure-infra-sandbox', {
|
|
|
1476
1480
|
},
|
|
1477
1481
|
});
|
|
1478
1482
|
|
|
1483
|
+
// Define other instances of stages, such as beta and prod, below
|
|
1484
|
+
|
|
1479
1485
|
app.synth();
|
|
1480
1486
|
```
|
|
1481
1487
|
|
|
@@ -1523,7 +1529,7 @@ The `run-many` command will run a target on multiple listed subprojects (`--all`
|
|
|
1523
1529
|
|
|
1524
1530
|
You can also trigger a build (or any other task) for a single project target by running the target on the project directly. For example, to build the `@dungeon-adventure/infra` project, run the following command:
|
|
1525
1531
|
|
|
1526
|
-
<NxCommands commands={['build infra']} />
|
|
1532
|
+
<NxCommands commands={['build @dungeon-adventure/infra']} />
|
|
1527
1533
|
|
|
1528
1534
|
You can also omit the scope, and use the Nx shorthand syntax if you prefer:
|
|
1529
1535
|
|
|
@@ -1562,16 +1568,15 @@ You may be prompted with the following:
|
|
|
1562
1568
|
```bash
|
|
1563
1569
|
NX The workspace is out of sync
|
|
1564
1570
|
|
|
1565
|
-
[@nx/js:typescript-sync]: Some TypeScript configuration files are missing project references to the projects they depend on or
|
|
1566
|
-
|
|
1567
|
-
This will result in an error in CI.
|
|
1571
|
+
[@nx/js:typescript-sync]: Some TypeScript configuration files are missing project references to the projects they depend on, contain stale project references, or have duplicate project references.
|
|
1572
|
+
[@aws/nx-plugin:ts#sync]: Some files are out of sync.
|
|
1568
1573
|
|
|
1569
1574
|
? Would you like to sync the identified changes to get your workspace up to date? …
|
|
1570
1575
|
Yes, sync the changes and run the tasks
|
|
1571
1576
|
No, run the tasks without syncing the changes
|
|
1572
1577
|
```
|
|
1573
1578
|
|
|
1574
|
-
This message indicates that NX has detected some files which can be updated automatically for you. In this case, it is referring to the `tsconfig.json` files which do not have Typescript references set up on
|
|
1579
|
+
This message indicates that NX has detected some files which can be updated automatically for you. In this case, it is referring to the `tsconfig.json` files which do not have Typescript references set up on referenced projects, and to the workspace dependencies the `@aws/nx-plugin` sync generator declares for you.
|
|
1575
1580
|
|
|
1576
1581
|
Select the **Yes, sync the changes and run the tasks** option to proceed. You should notice all of you IDE related import errors get automatically resolved as the sync generator will add the missing typescript references automatically!
|
|
1577
1582
|
|
|
@@ -248,6 +248,6 @@ We can try out the MCP server's tools with the [MCP Inspector](https://github.co
|
|
|
248
248
|
|
|
249
249
|
<NxCommands commands={["mcp-server-inspect inventory"]} />
|
|
250
250
|
|
|
251
|
-
This serves the MCP server locally (booting DynamoDB Local too) and launches the MCP Inspector at `http://localhost:6274` pre-configured to connect to it.
|
|
251
|
+
This serves the MCP server locally (booting DynamoDB Local too) and launches the MCP Inspector at `http://localhost:6274` pre-configured to connect to it. Toggle the switch next to the `localhost:8000` server to connect, switch to the **Tools** tab, and try `add-to-inventory` (e.g. `playerName: Alice`, `itemName: Rusty Sword`, `emoji: ⚔️`) followed by `list-inventory-items` to see it persisted to DynamoDB Local. Stop the server (`Ctrl+C`) when you're done.
|
|
252
252
|
|
|
253
253
|
Congratulations, you have built and tested your first tRPC API and MCP server against a local DynamoDB table! 🎉🎉🎉
|
|
@@ -48,6 +48,7 @@ When you ran the `connection` generator for `game-ui → story` in <Link path="g
|
|
|
48
48
|
- copilot/
|
|
49
49
|
- index.tsx Re-exports themed `CopilotChat` / `CopilotSidebar` / `CopilotPopup`.
|
|
50
50
|
- ShadcnAssistantMessage.tsx, ShadcnUserMessage.tsx, ShadcnChatInput.tsx, ShadcnCursor.tsx, copilot.css
|
|
51
|
+
- story-agent-chat.tsx A `CopilotChat` pre-bound to the Story Agent's `agentId`.
|
|
51
52
|
- hooks/
|
|
52
53
|
- useAguiStoryAgent.tsx Instantiates an `@ag-ui/client` `HttpAgent` pointing at the deployed Story Agent and pads `threadId` to AgentCore's 33-character minimum session id.
|
|
53
54
|
- main.tsx Wraps `<App />` in `<AguiProvider>`
|
|
@@ -146,6 +147,10 @@ dungeon-adventure-infra-sandbox-Application.UserIdentityUserIdentityUserPoolIdXX
|
|
|
146
147
|
|
|
147
148
|
Navigate to your CloudFront URL (`GameUIDistributionDomainName` from the CDK outputs), sign up for a new account, and play your game running entirely on AWS!
|
|
148
149
|
|
|
150
|
+
:::note[Signing up for the first time]
|
|
151
|
+
Cognito emails you a code to confirm your account, then asks you to set up multi-factor authentication (an authenticator app or an SMS code) before your first sign-in — the user pool `ts#website#auth` vends requires MFA. See <Link path="guides/react-website-auth#multi-factor-authentication-mfa">Multi-factor authentication</Link> for how to relax that.
|
|
152
|
+
:::
|
|
153
|
+
|
|
149
154
|
## Task 6: Mixing local and deployed components
|
|
150
155
|
|
|
151
156
|
You've seen two ends of the spectrum: everything local (`dev`) and everything deployed. During day-to-day development it's often useful to mix the two — for example, iterate on website code against the *real* deployed API and agent, or run the API locally against the *real* DynamoDB table.
|
|
@@ -10,7 +10,6 @@ import Drawer from '@components/drawer.astro';
|
|
|
10
10
|
import RunGenerator from '@components/run-generator.astro';
|
|
11
11
|
import NxCommands from '@components/nx-commands.astro';
|
|
12
12
|
import InstallCommand from '@components/install-command.astro';
|
|
13
|
-
import Link from '@components/link.astro';
|
|
14
13
|
|
|
15
14
|
import baselineWebsitePng from '@assets/baseline-website.png'
|
|
16
15
|
import baselineGamePng from '@assets/baseline-game.png'
|
|
@@ -138,8 +137,4 @@ Before you proceed, you will need the following global dependencies:
|
|
|
138
137
|
|
|
139
138
|
<Snippet name="required-prerequisites" />
|
|
140
139
|
- [AWS Credentials](https://docs.aws.amazon.com/sdkref/latest/guide/access.html) configured to your target AWS account, since this tutorial deploys the application and invokes Amazon Bedrock
|
|
141
|
-
- [Docker](https://www.docker.com/) (or [Finch](https://github.com/runfinch/finch)) is required for local DynamoDB development
|
|
142
|
-
|
|
143
|
-
:::tip[AI Assistant Setup]
|
|
144
|
-
If you use an AI Assistant such as Kiro, Kiro CLI, Cursor, Claude Code or Cline, refer to the <Link path="/get_started/building-with-ai">install the Nx Plugin for AWS MCP server</Link> page.
|
|
145
|
-
:::
|
|
140
|
+
- [Docker](https://www.docker.com/) (or [Finch](https://github.com/runfinch/finch)) is required for local DynamoDB development
|
|
@@ -38,4 +38,13 @@ We recommend you try your hand at extending the codebase with the following capa
|
|
|
38
38
|
|
|
39
39
|
This will prompt you for a list of stacks to delete which should comprise of the `dungeon-adventure-infra-sandbox/Application/GameUI/waf` and `dungeon-adventure-infra-sandbox/Application`.
|
|
40
40
|
|
|
41
|
-
2. Enter `
|
|
41
|
+
2. Enter `y` to continue. CloudFormation will destroy your stacks.
|
|
42
|
+
|
|
43
|
+
:::caution[Two resources are kept on purpose]
|
|
44
|
+
Deleting the stacks leaves two resources behind, so a teardown can't take your users or their stories with it:
|
|
45
|
+
|
|
46
|
+
- The **Cognito user pool**, which `ts#website#auth` creates with deletion protection enabled.
|
|
47
|
+
- The **Story Agent's session bucket**, which holds the conversation history and defaults to `RemovalPolicy.RETAIN`.
|
|
48
|
+
|
|
49
|
+
Delete them by hand once you no longer need them — for the user pool, turn deletion protection off first.
|
|
50
|
+
:::
|
package/docs/guides/license.mdx
CHANGED
|
@@ -9,7 +9,6 @@ import GeneratorParameters from '@components/generator-parameters.astro';
|
|
|
9
9
|
import Drawer from '@components/drawer.astro';
|
|
10
10
|
import LicenseAllowlist from '@components/license-allowlist.astro';
|
|
11
11
|
import NxCommands from '@components/nx-commands.astro';
|
|
12
|
-
import PackageManagerShortCommand from '@components/package-manager-short-command.astro';
|
|
13
12
|
|
|
14
13
|
Manage licensing across your workspace: synchronise `LICENSE` files and source code headers for your own code (`license.source`), and check that every dependency conforms to a license allowlist (`license.dependencies`).
|
|
15
14
|
|
|
@@ -45,7 +44,7 @@ Whenever you build your projects (and a `lint` target runs), the license sync ge
|
|
|
45
44
|
|
|
46
45
|
[@aws/nx-plugin:license#sync]: Project LICENSE files are out of sync:
|
|
47
46
|
- LICENSE
|
|
48
|
-
- packages/<my-project
|
|
47
|
+
- packages/<my-project>/LICENSE
|
|
49
48
|
|
|
50
49
|
Project package.json files are out of sync:
|
|
51
50
|
- package.json
|
|
@@ -348,7 +347,7 @@ This means you don't need to run the check explicitly, though you can still do s
|
|
|
348
347
|
|
|
349
348
|
The wiring is a cross-project `dependsOn` on each project's `lint` target that points at the root `license-check` target. To skip the check during a lint or build, set the `LICENSE_DEPENDENCY_CHECK=skip` environment variable:
|
|
350
349
|
|
|
351
|
-
<
|
|
350
|
+
<NxCommands commands={['run-many --target lint --all']} env={{ LICENSE_DEPENDENCY_CHECK: 'skip' }} />
|
|
352
351
|
|
|
353
352
|
### Configuration
|
|
354
353
|
|
|
@@ -381,7 +380,14 @@ To restrict the allowlist, replace `DEFAULT_LICENSE_ALLOWLIST` with your own arr
|
|
|
381
380
|
|
|
382
381
|
#### Per-package exceptions
|
|
383
382
|
|
|
384
|
-
Use `exceptions` for packages that fail the check — either because their license is not in the allowlist, or because they ship without detectable license metadata.
|
|
383
|
+
Use `exceptions` for packages that fail the check — either because their license is not in the allowlist, or because they ship without detectable license metadata.
|
|
384
|
+
|
|
385
|
+
Each entry accepts:
|
|
386
|
+
|
|
387
|
+
- `package` (required): the package name the exception applies to
|
|
388
|
+
- `reason` (required): why the exception was granted, so reviewers can see it
|
|
389
|
+
- `version` (optional): restrict the exception to a single version, so a later version is checked again
|
|
390
|
+
- `spdx` (optional): the license to treat the package as declaring, for a package that ships license text without declaring it in its metadata. This is what the `onDependency` hook below reports
|
|
385
391
|
|
|
386
392
|
```typescript
|
|
387
393
|
exceptions: [
|
|
@@ -389,6 +395,7 @@ exceptions: [
|
|
|
389
395
|
package: 'union',
|
|
390
396
|
version: '0.5.0',
|
|
391
397
|
reason: 'Package ships verbatim MIT text without declaring license',
|
|
398
|
+
spdx: 'MIT',
|
|
392
399
|
},
|
|
393
400
|
];
|
|
394
401
|
```
|
|
@@ -397,7 +404,24 @@ Generators that introduce dependencies with problematic metadata (e.g. the MCP s
|
|
|
397
404
|
|
|
398
405
|
#### Collectors
|
|
399
406
|
|
|
400
|
-
Collectors discover dependencies and extract license metadata. The built-in collectors are `npmCollector()` (scans `node_modules`) and `pythonCollector()` (scans Python virtual environments)
|
|
407
|
+
Collectors discover dependencies and extract license metadata. The built-in collectors are `npmCollector()` (scans `node_modules`) and `pythonCollector()` (scans Python virtual environments), both exported from `@aws/nx-plugin/sdk/license`. The license generator configures `npmCollector()` by default and adds `pythonCollector()` when Python projects are present.
|
|
408
|
+
|
|
409
|
+
```typescript title="aws-nx-plugin.config.mts"
|
|
410
|
+
import {
|
|
411
|
+
DEFAULT_LICENSE_ALLOWLIST,
|
|
412
|
+
npmCollector,
|
|
413
|
+
pythonCollector,
|
|
414
|
+
} from '@aws/nx-plugin/sdk/license';
|
|
415
|
+
|
|
416
|
+
export default {
|
|
417
|
+
license: {
|
|
418
|
+
dependencies: {
|
|
419
|
+
allow: DEFAULT_LICENSE_ALLOWLIST,
|
|
420
|
+
collectors: [npmCollector(), pythonCollector()],
|
|
421
|
+
},
|
|
422
|
+
},
|
|
423
|
+
} satisfies AwsNxPluginConfig;
|
|
424
|
+
```
|
|
401
425
|
|
|
402
426
|
To implement a custom collector, conform to the `LicenseCollector` interface:
|
|
403
427
|
|
|
@@ -443,6 +467,6 @@ Dependency license checking is enabled by the presence of the `license.dependenc
|
|
|
443
467
|
|
|
444
468
|
To disable the checks for a single run, set the `LICENSE_DEPENDENCY_CHECK=skip` environment variable:
|
|
445
469
|
|
|
446
|
-
<
|
|
470
|
+
<NxCommands commands={['run-many --target lint --all']} env={{ LICENSE_DEPENDENCY_CHECK: 'skip' }} />
|
|
447
471
|
|
|
448
472
|
To disable permanently, remove the `license.dependencies` key from your configuration in `aws-nx-plugin.config.mts`. You can also re-run the `license` generator with `--dependencyCheck=false` to scaffold without it.
|
|
@@ -40,15 +40,14 @@ The generator will create the following project files within the given `project`
|
|
|
40
40
|
- generator.ts Stub generator implementation
|
|
41
41
|
- generator.spec.ts Tests for your generator
|
|
42
42
|
- README.md Documentation for your generator
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
-
|
|
43
|
+
- files/
|
|
44
|
+
- hello.ts.template Example template rendered by the stub generator
|
|
45
|
+
- src/index.ts Updated to export your generator
|
|
46
|
+
- generators.json Created or updated to define your generators
|
|
47
|
+
- project.json Updated to record the generator against the project
|
|
48
|
+
- package.json Created if absent, and pointed at `generators.json`
|
|
46
49
|
</FileTree>
|
|
47
50
|
|
|
48
|
-
:::warning[Project Modification]
|
|
49
|
-
This generator will update the selected `project` to use CommonJS, as Nx Generators only support CommonJS at present ([refer to this GitHub issue for ESM support](https://github.com/nrwl/nx/issues/15682)).
|
|
50
|
-
:::
|
|
51
|
-
|
|
52
51
|
## Local Generators
|
|
53
52
|
|
|
54
53
|
:::tip[Dedicated Plugin Project]
|
|
@@ -452,7 +451,7 @@ export const myGenerator = async (tree: Tree, schema: MyGeneratorSchema) => {
|
|
|
452
451
|
We also expose a method which allows you to build a data structure that can be used to iterate over operations in an OpenAPI specification and therefore instrument your own code generation, for example:
|
|
453
452
|
|
|
454
453
|
```ts
|
|
455
|
-
import { buildOpenApiCodeGenerationData } from '@aws/nx-plugin/sdk/open-api
|
|
454
|
+
import { buildOpenApiCodeGenerationData } from '@aws/nx-plugin/sdk/open-api';
|
|
456
455
|
|
|
457
456
|
export const myGenerator = async (tree: Tree, schema: MyGeneratorSchema) => {
|
|
458
457
|
const data = await buildOpenApiCodeGenerationData(tree, 'path/to/spec.json');
|
|
@@ -496,15 +495,15 @@ If you don't see your generator in the VSCode plugin UI, you can refresh your Nx
|
|
|
496
495
|
Unit tests for generators are straightforward to implement. Here's a typical pattern:
|
|
497
496
|
|
|
498
497
|
```typescript
|
|
499
|
-
import {
|
|
498
|
+
import { createTreeUsingTsSolutionSetup } from '@aws/nx-plugin/sdk/utils/test';
|
|
500
499
|
import { yourGenerator } from './generator.js';
|
|
501
500
|
|
|
502
501
|
describe('your generator', () => {
|
|
503
502
|
let tree;
|
|
504
503
|
|
|
505
504
|
beforeEach(() => {
|
|
506
|
-
// Create
|
|
507
|
-
tree =
|
|
505
|
+
// Create a workspace tree matching the shape our preset generates
|
|
506
|
+
tree = createTreeUsingTsSolutionSetup();
|
|
508
507
|
|
|
509
508
|
// Add any files that should already exist in the tree
|
|
510
509
|
tree.write(
|
|
@@ -562,7 +561,7 @@ describe('your generator', () => {
|
|
|
562
561
|
|
|
563
562
|
Key points for testing generators:
|
|
564
563
|
|
|
565
|
-
- Use `
|
|
564
|
+
- Use `createTreeUsingTsSolutionSetup()` from `@aws/nx-plugin/sdk/utils/test` to create a virtual file system. It seeds the workspace markers our preset writes (`tsconfig.base.json`, `pnpm-workspace.yaml`, `biome.json`, a `type: module` root `package.json`), which any generator composing an `@aws/nx-plugin` generator needs
|
|
566
565
|
- Set up any prerequisite files before running the generator
|
|
567
566
|
- Test both the creation of new files and updates to existing files
|
|
568
567
|
- Use snapshots for complex file content
|
|
@@ -33,22 +33,30 @@ The generator will create the following project structure:
|
|
|
33
33
|
<FileTree>
|
|
34
34
|
- your-plugin/
|
|
35
35
|
- src/
|
|
36
|
-
- index.ts
|
|
36
|
+
- index.ts Entry point for your plugin
|
|
37
37
|
- mcp-server/
|
|
38
38
|
- index.ts Exports your server
|
|
39
39
|
- server.ts Main MCP server configuration
|
|
40
40
|
- stdio.ts Entry point for your MCP server with STDIO transport
|
|
41
41
|
- http.ts Entry point for your MCP server with Streamable HTTP transport
|
|
42
|
+
- schema.ts Shared schemas for the MCP server's tools
|
|
43
|
+
- utils.ts Utility functions for the MCP server
|
|
44
|
+
- resources/
|
|
45
|
+
- GENERAL_GUIDANCE.md Guidance served by the `general-guidance` tool
|
|
42
46
|
- tools/
|
|
43
47
|
- create-workspace-command.ts Tool for workspace creation guidance
|
|
44
48
|
- general-guidance.ts Tool for general Nx and plugin guidance
|
|
45
49
|
- list-generators.ts Tool to list available generators
|
|
46
50
|
- generator-guide.ts Tool for detailed generator information
|
|
47
|
-
- utils.ts Utility functions for the MCP server
|
|
48
51
|
- generators.json Nx generator configuration (initially empty)
|
|
49
52
|
- package.json Plugin package configuration
|
|
50
|
-
- tsconfig.json TypeScript configuration (CommonJS for Nx compatibility)
|
|
51
53
|
- project.json Nx project configuration with build and package targets
|
|
54
|
+
- tsconfig.json TypeScript configuration, referencing the two below
|
|
55
|
+
- tsconfig.lib.json TypeScript configuration for your plugin's source
|
|
56
|
+
- tsconfig.spec.json TypeScript configuration for your plugin's tests
|
|
57
|
+
- vitest.config.mts Vitest configuration for your plugin's tests
|
|
58
|
+
- README.md Documentation for your plugin, served by the `generator-guide` tool
|
|
59
|
+
- LICENSE Written by the `license` generator's sync, when configured
|
|
52
60
|
</FileTree>
|
|
53
61
|
|
|
54
62
|
## Working with Your Nx Plugin
|
|
@@ -84,7 +92,7 @@ Creates a distributable package ready for NPM publishing:
|
|
|
84
92
|
The package target includes all necessary assets:
|
|
85
93
|
- Compiled JavaScript files
|
|
86
94
|
- TypeScript declaration files
|
|
87
|
-
-
|
|
95
|
+
- The `generators.json`, `executors.json` and `migrations.json` manifests Nx reads from a published plugin
|
|
88
96
|
- Documentation and license files
|
|
89
97
|
|
|
90
98
|
## MCP Server Integration
|
|
@@ -114,14 +122,16 @@ For more details about writing MCP Servers, refer to the <Link path="/guides/ts-
|
|
|
114
122
|
|
|
115
123
|
### Preparing for Publication
|
|
116
124
|
|
|
117
|
-
1. **Update Package Information**: Edit your plugin's [`package.json`](https://docs.npmjs.com/cli/v10/configuring-npm/package-json) with proper name, version, description, and repository information.
|
|
125
|
+
1. **Update Package Information**: Edit your plugin's [`package.json`](https://docs.npmjs.com/cli/v10/configuring-npm/package-json) with proper name, version, description, and repository information. Also remove `"private": true`.
|
|
118
126
|
|
|
119
127
|
2. **Build the Package**:
|
|
120
128
|
<NxCommands commands={['package your-plugin']} />
|
|
121
129
|
|
|
130
|
+
The package lands in `dist/<your-plugin's project root>/package` — for a plugin generated with `--name=nx-plugin --directory=tools`, that's `dist/tools/nx-plugin/package`.
|
|
131
|
+
|
|
122
132
|
3. **Test Locally**: You can test your plugin locally by installing it in another workspace:
|
|
123
133
|
```bash
|
|
124
|
-
npm install /path/to/your/workspace/dist/
|
|
134
|
+
npm install /path/to/your/workspace/dist/tools/nx-plugin/package
|
|
125
135
|
```
|
|
126
136
|
|
|
127
137
|
### Publishing to NPM
|
|
@@ -129,7 +139,7 @@ For more details about writing MCP Servers, refer to the <Link path="/guides/ts-
|
|
|
129
139
|
Once your plugin is ready:
|
|
130
140
|
|
|
131
141
|
```bash
|
|
132
|
-
cd dist/
|
|
142
|
+
cd dist/tools/nx-plugin/package
|
|
133
143
|
npm publish
|
|
134
144
|
```
|
|
135
145
|
|
|
@@ -467,7 +467,9 @@ Destroying is irreversible, so CDK asks you to confirm the stacks it is about to
|
|
|
467
467
|
|
|
468
468
|
The `destroy` target tears down whichever stage or stacks you name:
|
|
469
469
|
|
|
470
|
-
<NxCommands commands={['destroy <my-infra> <my-infra>-sandbox
|
|
470
|
+
<NxCommands commands={['destroy <my-infra> <my-infra>-sandbox/**']} />
|
|
471
|
+
|
|
472
|
+
Use `/**` rather than `/*` for a whole stage: destroying only deletes the stacks the pattern selects, and `/*` misses stacks nested below the stage's stacks, such as the `us-east-1` WebACL stack a website creates for its CloudFront distribution.
|
|
471
473
|
|
|
472
474
|
To tear down an individual stack, give the full stack name:
|
|
473
475
|
|
|
@@ -8,6 +8,7 @@ import Link from '@components/link.astro';
|
|
|
8
8
|
import NxCommands from '@components/nx-commands.astro';
|
|
9
9
|
import Drawer from '@components/drawer.astro';
|
|
10
10
|
import InstallCommand from '@components/install-command.astro';
|
|
11
|
+
import PackageManagerShortCommand from '@components/package-manager-short-command.astro';
|
|
11
12
|
|
|
12
13
|
The `TypeSafeApiProject` used in the shopping list application made use of:
|
|
13
14
|
|
|
@@ -114,12 +115,12 @@ Now that we have the basic structure for our Smithy API project, we can migrate
|
|
|
114
115
|
|
|
115
116
|
At this point, let's run a build to check our model changes and ensure we have some generated server code to work with. There will be some failures in the backend project (`@shopping-list/api`) but we'll address those next.
|
|
116
117
|
|
|
117
|
-
<
|
|
118
|
+
<PackageManagerShortCommand commands={["build"]} />
|
|
118
119
|
|
|
119
120
|
:::note
|
|
120
121
|
You may see a build failure due to lint issues. These can usually be automatically fixed:
|
|
121
122
|
|
|
122
|
-
<
|
|
123
|
+
<PackageManagerShortCommand commands={["lint"]} />
|
|
123
124
|
:::
|
|
124
125
|
|
|
125
126
|
#### Migrate the Lambda Handlers
|
|
@@ -132,7 +133,7 @@ The shopping list application's lambda handlers rely on the `@aws-sdk/client-dyn
|
|
|
132
133
|
|
|
133
134
|
<InstallCommand pkg="@aws-sdk/client-dynamodb" project="@shopping-list/api" />
|
|
134
135
|
|
|
135
|
-
Then, let's copy the `handlers/src/dynamo-client.ts` file from the PDK project to `backend/src/operations` so it's available for our handlers.
|
|
136
|
+
Then, let's copy the `handlers/typescript/src/dynamo-client.ts` file from the PDK project to `backend/src/operations` so it's available for our handlers.
|
|
136
137
|
|
|
137
138
|
The `ts#smithy-api` generator scaffolds an example `Echo` operation. Since we removed this from our model, delete the corresponding handler in `backend/src/operations/echo.ts`. We'll register our migrated operations in `service.ts` further below.
|
|
138
139
|
|
|
@@ -587,6 +588,7 @@ Additionally, update `packages/api/backend/project.json` and update `metadata.ap
|
|
|
587
588
|
+ "apiName": "my-api",
|
|
588
589
|
"auth": "iam",
|
|
589
590
|
"modelProject": "@shopping-list/api-model",
|
|
591
|
+
"iac": "cdk",
|
|
590
592
|
"ports": [3001]
|
|
591
593
|
},
|
|
592
594
|
```
|
|
@@ -595,10 +597,10 @@ Additionally, update `packages/api/backend/project.json` and update `metadata.ap
|
|
|
595
597
|
|
|
596
598
|
We can now build the project to check that the migration has worked so far:
|
|
597
599
|
|
|
598
|
-
<
|
|
600
|
+
<PackageManagerShortCommand commands={["build"]} />
|
|
599
601
|
|
|
600
602
|
:::note
|
|
601
603
|
You may see a build failure due to lint issues. These can usually be automatically fixed:
|
|
602
604
|
|
|
603
|
-
<
|
|
605
|
+
<PackageManagerShortCommand commands={["lint"]} />
|
|
604
606
|
:::
|
|
@@ -8,6 +8,7 @@ import Link from '@components/link.astro';
|
|
|
8
8
|
import NxCommands from '@components/nx-commands.astro';
|
|
9
9
|
import Drawer from '@components/drawer.astro';
|
|
10
10
|
import InstallCommand from '@components/install-command.astro';
|
|
11
|
+
import PackageManagerShortCommand from '@components/package-manager-short-command.astro';
|
|
11
12
|
|
|
12
13
|
The `CloudscapeReactTsWebsiteProject` used in the shopping list application configured a React website with CloudScape and Cognito authentication built in.
|
|
13
14
|
|
|
@@ -100,7 +101,7 @@ Since we're using [file-based routing](https://tanstack.com/router/latest/docs/f
|
|
|
100
101
|
|
|
101
102
|
Let's start the local website server:
|
|
102
103
|
|
|
103
|
-
<
|
|
104
|
+
<PackageManagerShortCommand commands={["dev"]} />
|
|
104
105
|
|
|
105
106
|
:::tip
|
|
106
107
|
We're using the `dev` target here, which also starts local servers for any APIs which have been connected with `connection`, and hot-reloads if your website, model, or backend changes! This allows us to test our API and website locally before we've even written any CDK code.
|
|
@@ -8,6 +8,7 @@ import Link from '@components/link.astro';
|
|
|
8
8
|
import NxCommands from '@components/nx-commands.astro';
|
|
9
9
|
import Drawer from '@components/drawer.astro';
|
|
10
10
|
import InstallCommand from '@components/install-command.astro';
|
|
11
|
+
import PackageManagerShortCommand from '@components/package-manager-short-command.astro';
|
|
11
12
|
|
|
12
13
|
The last project we need to migrate for our shopping list application is the `InfrastructureTsProject`. This is a TypeScript CDK project, for which the Nx Plugin for AWS equivalent is the <Link path="/guides/typescript-infrastructure">`ts#infra` generator</Link>.
|
|
13
14
|
|
|
@@ -152,10 +153,10 @@ Notice that we don't pass the identity or API to the website - runtime config is
|
|
|
152
153
|
|
|
153
154
|
Let's build the project now that we've migrated all the relevant parts of the codebase to our new project.
|
|
154
155
|
|
|
155
|
-
<
|
|
156
|
+
<PackageManagerShortCommand commands={["build"]} />
|
|
156
157
|
|
|
157
158
|
:::caution
|
|
158
159
|
You may see a build failure due to lint issues. These can usually be automatically fixed:
|
|
159
160
|
|
|
160
|
-
<
|
|
161
|
+
<PackageManagerShortCommand commands={["lint"]} />
|
|
161
162
|
:::
|
|
@@ -8,6 +8,7 @@ import Link from '@components/link.astro';
|
|
|
8
8
|
import NxCommands from '@components/nx-commands.astro';
|
|
9
9
|
import Drawer from '@components/drawer.astro';
|
|
10
10
|
import InstallCommand from '@components/install-command.astro';
|
|
11
|
+
import PackageManagerShortCommand from '@components/package-manager-short-command.astro';
|
|
11
12
|
|
|
12
13
|
|
|
13
14
|
Now we've got our fully migrated codebase, we can look at deploying it. There are two paths we can take at this point.
|
|
@@ -22,7 +23,7 @@ The simplest approach is to treat this as a completely new application, meaning
|
|
|
22
23
|
|
|
23
24
|
1. Deploy the new application:
|
|
24
25
|
|
|
25
|
-
<NxCommands commands={[
|
|
26
|
+
<NxCommands commands={['deploy-sandbox infra']} />
|
|
26
27
|
|
|
27
28
|
</Steps>
|
|
28
29
|
|
|
@@ -63,7 +64,7 @@ For our shopping list application, the stateful resources we care about are the
|
|
|
63
64
|
|
|
64
65
|
```diff lang="ts"
|
|
65
66
|
// packages/common/constructs/src/core/user-identity.ts
|
|
66
|
-
-this.userPool = this.createUserPool();
|
|
67
|
+
-this.userPool = this.createUserPool(mfa, mfaSecondFactor);
|
|
67
68
|
+this.userPool = UserPool.fromUserPoolId(
|
|
68
69
|
+ this,
|
|
69
70
|
+ 'UserPool',
|
|
@@ -73,9 +74,9 @@ For our shopping list application, the stateful resources we care about are the
|
|
|
73
74
|
|
|
74
75
|
1. Build and deploy the new application:
|
|
75
76
|
|
|
76
|
-
<
|
|
77
|
+
<PackageManagerShortCommand commands={["build"]} />
|
|
77
78
|
|
|
78
|
-
<NxCommands commands={[
|
|
79
|
+
<NxCommands commands={['deploy-sandbox infra']} />
|
|
79
80
|
|
|
80
81
|
Now we have our new application stood up referencing the existing resources, not yet taking any traffic.
|
|
81
82
|
|
|
@@ -98,7 +99,7 @@ For our shopping list application, the stateful resources we care about are the
|
|
|
98
99
|
|
|
99
100
|
```diff lang="ts"
|
|
100
101
|
// packages/common/constructs/src/core/user-identity.ts
|
|
101
|
-
+this.userPool = this.createUserPool();
|
|
102
|
+
+this.userPool = this.createUserPool(mfa, mfaSecondFactor);
|
|
102
103
|
-this.userPool = UserPool.fromUserPoolId(
|
|
103
104
|
- this,
|
|
104
105
|
- 'UserPool',
|
|
@@ -108,7 +109,7 @@ For our shopping list application, the stateful resources we care about are the
|
|
|
108
109
|
|
|
109
110
|
And then run a build
|
|
110
111
|
|
|
111
|
-
<
|
|
112
|
+
<PackageManagerShortCommand commands={["build"]} />
|
|
112
113
|
|
|
113
114
|
1. Use `cdk import` in your new application's `packages/infra` folder to see which resources we'll be prompted to import.
|
|
114
115
|
|
|
@@ -199,7 +200,7 @@ For our shopping list application, the stateful resources we care about are the
|
|
|
199
200
|
|
|
200
201
|
1. Deploy the new application again to make sure that any changes to these existing resources (now managed by your new stack) are made:
|
|
201
202
|
|
|
202
|
-
<NxCommands commands={[
|
|
203
|
+
<NxCommands commands={['deploy-sandbox infra']} />
|
|
203
204
|
|
|
204
205
|
1. Perform a full test of your new application again
|
|
205
206
|
|
|
@@ -14,7 +14,7 @@ The most commonly used components from Type Safe API are covered in the example
|
|
|
14
14
|
|
|
15
15
|
#### APIs Modelled with OpenAPI
|
|
16
16
|
|
|
17
|
-
The Nx Plugin for AWS supports APIs modelled in Smithy, but not those modelled directly OpenAPI. The <Link path="/guides/ts-smithy-api">`ts#smithy-api` generator</Link> is a good starting point which you can then modify. You can define your OpenAPI specification in the `model` project's `src` folder instead of Smithy, and
|
|
17
|
+
The Nx Plugin for AWS supports APIs modelled in Smithy, but not those modelled directly OpenAPI. The <Link path="/guides/ts-smithy-api">`ts#smithy-api` generator</Link> is a good starting point which you can then modify. You can define your OpenAPI specification in the `model` project's `src` folder instead of Smithy, and update the `model` project's `compile` target to run your desired code generation tool for clients/servers. If your desired tools are on NPM, you can install them as dev dependencies to your Nx workspace and call them directly as Nx build targets.
|
|
18
18
|
|
|
19
19
|
##### Backend
|
|
20
20
|
|
|
@@ -153,7 +153,7 @@ const pythonLambdaHandler = new Function(this, 'PythonImplementation', {
|
|
|
153
153
|
...
|
|
154
154
|
});
|
|
155
155
|
|
|
156
|
-
new
|
|
156
|
+
new Api(this, 'MyApi', {
|
|
157
157
|
integrations: Api.defaultIntegrations(this)
|
|
158
158
|
.withOverrides({
|
|
159
159
|
echo: {
|
|
@@ -199,6 +199,6 @@ Another option is to use GraphQL APIs with websockets on [AppSync](https://aws.a
|
|
|
199
199
|
|
|
200
200
|
You can also consider rolling your own code generators which interpret the same vendor extensions as Type Safe API. Refer to the [APIs Modelled with OpenAPI](#apis-modelled-with-openapi) section for details around building custom OpenAPI-based code generators. You can find the templates Type Safe API uses for API Gateway Websocket API Lambda handlers [here](https://github.com/aws/aws-pdk/tree/mainline/packages/type-safe-api/scripts/type-safe-api/generators/typescript-async-runtime/templates), and the client [here](https://github.com/aws/aws-pdk/blob/mainline/packages/type-safe-api/scripts/type-safe-api/generators/typescript-websocket-client/templates/client.ejs).
|
|
201
201
|
|
|
202
|
-
You can also consider migrating to use the <Link path="/guides/trpc
|
|
202
|
+
You can also consider migrating to use the <Link path="/guides/trpc">`ts#trpc-api` generator</Link> to use tRPC. At the time of writing we don't yet have support for subscriptions/streaming but if this is something you need do add a +1 to our [GitHub issue tracking this](https://github.com/awslabs/nx-plugin-for-aws/issues/194).
|
|
203
203
|
|
|
204
204
|
Smithy is protocol agnostic, but does not yet have support for the Websocket protocol, refer to [this GitHub issue tracking support](https://github.com/smithy-lang/smithy/issues/1505).
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
---
|
|
2
2
|
title: Prerequisites
|
|
3
3
|
---
|
|
4
|
-
import Link from '@components/link.astro';
|
|
5
4
|
import Snippet from '@components/snippet.astro';
|
|
6
5
|
|
|
7
6
|
### Required
|
|
@@ -11,7 +10,3 @@ import Snippet from '@components/snippet.astro';
|
|
|
11
10
|
### Recommended
|
|
12
11
|
|
|
13
12
|
<Snippet name="recommended-prerequisites" parentHeading="Recommended" />
|
|
14
|
-
|
|
15
|
-
:::tip[AI Assistant Setup]
|
|
16
|
-
If you use an AI Assistant such as Kiro, Kiro CLI, Cursor, Claude Code or Cline, you may also wish to <Link path="/get_started/building-with-ai">install the Nx Plugin for AWS MCP server.</Link>
|
|
17
|
-
:::
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
title: Recommended Prerequisites
|
|
3
3
|
---
|
|
4
|
-
- [PNPM >= 11](https://pnpm.io/installation#using-npm) (you can also use [Yarn >= 4](https://yarnpkg.com/getting-started/install), [Bun >= 1](https://bun.sh/docs/installation), or [NPM >=
|
|
4
|
+
- [PNPM >= 11](https://pnpm.io/installation#using-npm) (you can also use [Yarn >= 4](https://yarnpkg.com/getting-started/install), [Bun >= 1](https://bun.sh/docs/installation), or [NPM >= 11](https://nodejs.org/en/learn/getting-started/an-introduction-to-the-npm-package-manager) if you prefer)
|
|
5
5
|
- verify by running `pnpm --version`, `yarn --version`, `bun --version` or `npm --version`
|
|
6
6
|
- [AWS Credentials](https://docs.aws.amazon.com/sdkref/latest/guide/access.html) configured to your target AWS account are required to deploy your application (as well as for some local development workflows).
|
|
7
7
|
- [Docker](https://www.docker.com/) or [Finch >= 1.6.0](https://runfinch.com/) is required for some generators. For Docker, [multi-platform builds](https://docs.docker.com/build/building/multi-platform/) must be set up; Finch supports [multi-platform builds](https://runfinch.com/docs/getting-started/building-images/#building-a-multi-architecture-container-image) out of the box.
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
---
|
|
2
|
+
title: Workspace Prerequisite
|
|
3
|
+
---
|
|
4
|
+
import Link from '@components/link.astro';
|
|
5
|
+
|
|
6
|
+
:::note[Start here]
|
|
7
|
+
Generators run inside an Nx workspace with `@aws/nx-plugin` installed. If you don't have one yet, start by <Link path="guides/workspace">creating a workspace</Link>, or <Link path="get_started/existing-project">adding the plugin to an existing project</Link>.
|
|
8
|
+
:::
|