@aws/nx-plugin-mcp 1.0.0-rc.98 → 1.0.1
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 +17 -9
- 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 +153 -65
- package/docs/get_started/tutorials/contribute-generator.mdx +5 -5
- package/docs/get_started/tutorials/dungeon-game/1.mdx +17 -17
- package/docs/get_started/tutorials/dungeon-game/overview.mdx +5 -76
- package/docs/guides/agentcore-gateway.mdx +2 -26
- package/docs/guides/connection/agentcore-gateway-agent.mdx +1 -1
- package/docs/guides/connection/py-agent-a2a.mdx +2 -2
- package/docs/guides/connection/py-agent-gateway.mdx +1 -1
- package/docs/guides/connection/py-agent-mcp.mdx +1 -1
- package/docs/guides/connection/react-trpc.mdx +1 -1
- package/docs/guides/connection/react-ts-agent.mdx +1 -1
- package/docs/guides/open-api-py-client.mdx +270 -0
- package/docs/guides/py-dynamodb.mdx +7 -0
- package/docs/guides/react-website-auth.mdx +3 -33
- package/docs/guides/react-website.mdx +3 -28
- package/docs/guides/runtime-config.mdx +2 -34
- package/docs/guides/terraform-project.mdx +1 -1
- package/docs/guides/ts-dynamodb.mdx +7 -0
- package/docs/guides/ts-smithy-api.mdx +8 -47
- package/docs/guides/typescript-project.mdx +2 -2
- package/docs/guides/workspace.mdx +7 -10
- package/docs/snippets/agent/architecture.mdx +9 -52
- package/docs/snippets/agent/bedrock-deployment.mdx +1 -1
- package/docs/snippets/agent/runtime-arn.mdx +1 -1
- package/docs/snippets/api/access-logging.mdx +1 -1
- package/docs/snippets/api/api-architecture.mdx +4 -75
- package/docs/snippets/api/type-safe-api-integrations.mdx +2 -4
- package/docs/snippets/lambda-function/architecture.mdx +3 -29
- package/docs/snippets/mcp/architecture.mdx +9 -38
- package/docs/snippets/mcp/bedrock-deployment.mdx +1 -1
- package/docs/snippets/pdk-migration/example/01-migrate-api.mdx +8 -6
- package/docs/snippets/pdk-migration/example/02-migrate-website.mdx +7 -7
- package/docs/snippets/pdk-migration/example/03-migrate-infra.mdx +4 -3
- package/docs/snippets/pdk-migration/example/04-deploy.mdx +8 -7
- package/docs/snippets/pdk-migration/faq/type-safe-api.mdx +4 -4
- package/docs/snippets/prerequisites.mdx +0 -5
- package/docs/snippets/rdb/architecture.mdx +2 -33
- package/docs/snippets/recommended-prerequisites.mdx +1 -1
- package/docs/snippets/workspace-prerequisite.mdx +8 -0
- package/generators.json +7 -0
- package/package.json +1 -1
- package/src/agentcore-gateway/schema.json +1 -0
- package/src/open-api/py-client/schema.json +28 -0
- package/src/py/agent/schema.json +2 -0
- package/src/py/mcp-server/schema.json +1 -0
- package/src/ts/agent/schema.json +1 -0
- package/src/ts/api/schema.json +2 -0
- package/src/ts/mcp-server/schema.json +1 -0
- package/src/ts/react-website/app/schema.json +1 -0
- package/src/ts/website/app/schema.json +1 -0
package/bin/aws-nx-mcp.js
CHANGED
|
@@ -21942,14 +21942,14 @@ const NX_VERSION = {
|
|
|
21942
21942
|
"@middy/core": "7.9.2",
|
|
21943
21943
|
"@nxlv/python": "23.0.0",
|
|
21944
21944
|
"@nx-extend/terraform": "10.4.1",
|
|
21945
|
-
nx: "23.2.
|
|
21946
|
-
"@nx/devkit": "23.2.
|
|
21947
|
-
"@nx/js": "23.2.
|
|
21948
|
-
"@nx/react": "23.2.
|
|
21949
|
-
"@nx/vite": "23.2.
|
|
21950
|
-
"@nx/vitest": "23.2.
|
|
21951
|
-
"@nx/workspace": "23.2.
|
|
21952
|
-
"create-nx-workspace": "23.2.
|
|
21945
|
+
nx: "23.2.1",
|
|
21946
|
+
"@nx/devkit": "23.2.1",
|
|
21947
|
+
"@nx/js": "23.2.1",
|
|
21948
|
+
"@nx/react": "23.2.1",
|
|
21949
|
+
"@nx/vite": "23.2.1",
|
|
21950
|
+
"@nx/vitest": "23.2.1",
|
|
21951
|
+
"@nx/workspace": "23.2.1",
|
|
21952
|
+
"create-nx-workspace": "23.2.1",
|
|
21953
21953
|
"@swc-node/register": "1.12.1",
|
|
21954
21954
|
"@swc/core": "1.16.1",
|
|
21955
21955
|
"@modelcontextprotocol/sdk": "1.30.0",
|
|
@@ -54646,6 +54646,7 @@ const renderComponent = (node, opts, pm, deps) => {
|
|
|
54646
54646
|
if (!commands) return void 0;
|
|
54647
54647
|
return [codeBlock(commands.map((c) => buildPackageManagerExecCommand(pm, c)).join("\n"))];
|
|
54648
54648
|
}
|
|
54649
|
+
case "ArchitectureDiagram": return [];
|
|
54649
54650
|
default: return;
|
|
54650
54651
|
}
|
|
54651
54652
|
};
|
|
@@ -54694,7 +54695,7 @@ const filterableValuesForProperty = (prop) => {
|
|
|
54694
54695
|
/**
|
|
54695
54696
|
* Pull out every filterable property (enum or boolean valued) as a
|
|
54696
54697
|
* `FilterableOption`. Shared between the MCP server (deriving options from a
|
|
54697
|
-
* generator's schema) and the docs
|
|
54698
|
+
* generator's schema) and the docs site (mapping user-referenced keys
|
|
54698
54699
|
* onto their values).
|
|
54699
54700
|
*/
|
|
54700
54701
|
const filterableOptionsFromSchema = (schema) => {
|
|
@@ -55424,6 +55425,13 @@ const generatorsJsonEntries = {
|
|
|
55424
55425
|
"metric": "g15",
|
|
55425
55426
|
"hidden": true
|
|
55426
55427
|
},
|
|
55428
|
+
"open-api#py-client": {
|
|
55429
|
+
"factory": "./src/open-api/py-client/generator",
|
|
55430
|
+
"schema": "./src/open-api/py-client/schema.json",
|
|
55431
|
+
"description": "Generate a Python httpx client from an OpenAPI specification",
|
|
55432
|
+
"metric": "g73",
|
|
55433
|
+
"hidden": true
|
|
55434
|
+
},
|
|
55427
55435
|
"open-api#ts-client": {
|
|
55428
55436
|
"factory": "./src/open-api/ts-client/generator",
|
|
55429
55437
|
"schema": "./src/open-api/ts-client/schema.json",
|
|
@@ -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
|
|
@@ -40,7 +43,7 @@ pnpm only runs install scripts for allow-listed packages, and `nx` needs its ins
|
|
|
40
43
|
|
|
41
44
|
```yaml title="pnpm-workspace.yaml"
|
|
42
45
|
allowBuilds:
|
|
43
|
-
|
|
46
|
+
nx: true
|
|
44
47
|
```
|
|
45
48
|
</Aside>
|
|
46
49
|
|
|
@@ -13,96 +13,99 @@ import RunGenerator from '@components/run-generator.astro';
|
|
|
13
13
|
import NxCommands from '@components/nx-commands.astro';
|
|
14
14
|
import Infrastructure from '@components/infrastructure.astro';
|
|
15
15
|
import EmbeddedGraph from '@components/embedded-graph.astro';
|
|
16
|
+
import Prompt from '@components/prompt.astro';
|
|
16
17
|
|
|
17
18
|
This guide walks you through the basics of installing and using `@aws/nx-plugin` to rapidly build projects on AWS.
|
|
18
19
|
|
|
19
|
-
:::tip[Full-Stack Tutorial]
|
|
20
|
-
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>.
|
|
21
|
-
:::
|
|
22
|
-
|
|
23
20
|
## Prerequisites
|
|
24
21
|
|
|
25
22
|
The following global dependencies are needed before proceeding:
|
|
26
23
|
|
|
27
24
|
<Snippet name="prerequisites" />
|
|
28
25
|
|
|
29
|
-
## Step 1:
|
|
26
|
+
## Step 1: Create a Workspace
|
|
30
27
|
|
|
31
|
-
|
|
28
|
+
Create an <Link path="guides/workspace">Nx workspace</Link> with the package manager of your choice, and open the directory it creates:
|
|
32
29
|
|
|
33
|
-
<CreateNxWorkspaceCommand workspace="my-project" />
|
|
30
|
+
<CreateNxWorkspaceCommand workspace="my-project" readonly editable={['iac', 'containers']} />
|
|
34
31
|
|
|
35
|
-
|
|
36
|
-
|
|
32
|
+
```sh
|
|
33
|
+
cd my-project
|
|
34
|
+
```
|
|
37
35
|
|
|
38
|
-
|
|
39
|
-
<Fragment slot="cdk">
|
|
40
|
-
<CreateNxWorkspaceCommand workspace="my-project" iac="cdk" />
|
|
41
|
-
</Fragment>
|
|
42
|
-
<Fragment slot="terraform">
|
|
43
|
-
<CreateNxWorkspaceCommand workspace="my-project" iac="terraform" />
|
|
44
|
-
</Fragment>
|
|
45
|
-
</Infrastructure>
|
|
36
|
+
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).
|
|
46
37
|
|
|
47
|
-
|
|
48
|
-
:::
|
|
38
|
+
## Step 2: Build Your Application
|
|
49
39
|
|
|
50
|
-
|
|
40
|
+
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.
|
|
51
41
|
|
|
52
|
-
|
|
53
|
-
cd my-project
|
|
54
|
-
```
|
|
42
|
+
### With AI
|
|
55
43
|
|
|
56
|
-
|
|
44
|
+
<Steps>
|
|
45
|
+
1. Open the workspace in your AI coding assistant.
|
|
57
46
|
|
|
58
|
-
|
|
47
|
+
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.
|
|
59
48
|
|
|
60
|
-
|
|
49
|
+
2. Ask for the application:
|
|
61
50
|
|
|
62
|
-
<
|
|
51
|
+
<Prompt>
|
|
52
|
+
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.
|
|
53
|
+
</Prompt>
|
|
63
54
|
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
55
|
+
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.
|
|
56
|
+
</Steps>
|
|
57
|
+
|
|
58
|
+
### With the CLI
|
|
67
59
|
|
|
68
|
-
|
|
60
|
+
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.
|
|
69
61
|
|
|
70
|
-
|
|
62
|
+
<Infrastructure>
|
|
63
|
+
<Fragment slot="cdk">
|
|
64
|
+
<EmbeddedGraph preset="quick-start" workspace="my-project" iac="cdk" orientation="horizontal" skipWorkspace />
|
|
65
|
+
</Fragment>
|
|
66
|
+
<Fragment slot="terraform">
|
|
67
|
+
<EmbeddedGraph preset="quick-start" workspace="my-project" iac="terraform" orientation="horizontal" skipWorkspace />
|
|
68
|
+
</Fragment>
|
|
69
|
+
</Infrastructure>
|
|
71
70
|
|
|
72
|
-
|
|
71
|
+
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.
|
|
72
|
+
|
|
73
|
+
#### Add a tRPC API
|
|
74
|
+
|
|
75
|
+
<RunGenerator generator="ts#api" requiredParameters={{ name: 'demo-api', framework: 'trpc' }} positional={['name']} noInteractive readonly />
|
|
73
76
|
|
|
74
77
|
This will create the API inside the `packages/demo-api` folder.
|
|
75
78
|
|
|
76
|
-
|
|
79
|
+
#### Add a React Website
|
|
77
80
|
|
|
78
|
-
<RunGenerator generator="ts#website" requiredParameters={{ name: 'demo-website' }} noInteractive />
|
|
81
|
+
<RunGenerator generator="ts#website" requiredParameters={{ name: 'demo-website' }} positional={['name']} noInteractive readonly />
|
|
79
82
|
|
|
80
83
|
This scaffolds a new React website in `packages/demo-website`.
|
|
81
84
|
|
|
82
|
-
|
|
85
|
+
#### Add Cognito Authentication
|
|
83
86
|
|
|
84
|
-
<RunGenerator generator="ts#website#auth" requiredParameters={{ project: '
|
|
87
|
+
<RunGenerator generator="ts#website#auth" requiredParameters={{ project: 'demo-website' }} noInteractive readonly />
|
|
85
88
|
|
|
86
89
|
This sets up the necessary infrastructure and React code to add Cognito Authentication to your website.
|
|
87
90
|
|
|
88
|
-
|
|
91
|
+
#### Connect Frontend to Backend
|
|
89
92
|
|
|
90
|
-
<RunGenerator generator="connection" requiredParameters={{ sourceProject: '
|
|
93
|
+
<RunGenerator generator="connection" requiredParameters={{ sourceProject: 'demo-website', targetProject: 'demo-api' }} noInteractive readonly />
|
|
91
94
|
|
|
92
95
|
This configures the necessary providers to ensure your website can call your tRPC API.
|
|
93
96
|
|
|
94
|
-
|
|
97
|
+
#### Add Infrastructure
|
|
95
98
|
|
|
96
99
|
Add the infrastructure project based on your chosen IAC provider.
|
|
97
100
|
|
|
98
101
|
<Infrastructure>
|
|
99
102
|
<Fragment slot="cdk">
|
|
100
|
-
<RunGenerator generator="ts#infra" requiredParameters={{ name: 'infra' }} noInteractive />
|
|
103
|
+
<RunGenerator generator="ts#infra" requiredParameters={{ name: 'infra' }} positional={['name']} noInteractive readonly />
|
|
101
104
|
|
|
102
105
|
This configures a CDK App which you can use to deploy your infrastructure on AWS.
|
|
103
106
|
</Fragment>
|
|
104
107
|
<Fragment slot="terraform">
|
|
105
|
-
<RunGenerator generator="terraform#project" requiredParameters={{ name: 'infra' }} noInteractive />
|
|
108
|
+
<RunGenerator generator="terraform#project" requiredParameters={{ name: 'infra' }} positional={['name']} noInteractive readonly />
|
|
106
109
|
|
|
107
110
|
This configures a Terraform project which you can use to deploy your infrastructure on AWS.
|
|
108
111
|
</Fragment>
|
|
@@ -118,18 +121,64 @@ Your website will be available at `http://localhost:4200`.
|
|
|
118
121
|
|
|
119
122
|
Changes to both your website and API will be reflected in real-time as both the local website and API servers will hot-reload.
|
|
120
123
|
|
|
124
|
+
<Drawer title="Calling your API from your website" trigger="Try it: call the API from your website">
|
|
125
|
+
|
|
126
|
+
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).
|
|
127
|
+
|
|
128
|
+
Update `packages/demo-website/src/routes/index.tsx` to call the API's `echo` procedure, showing a spinner while the request is in flight:
|
|
129
|
+
|
|
130
|
+
```diff lang="tsx"
|
|
131
|
+
+import { useQuery } from '@tanstack/react-query';
|
|
132
|
+
import { createFileRoute } from '@tanstack/react-router';
|
|
133
|
+
+import { Spinner } from '../components/spinner';
|
|
134
|
+
+import { useDemoApi } from '../hooks/useDemoApi';
|
|
135
|
+
|
|
136
|
+
export const Route = createFileRoute('/')({
|
|
137
|
+
component: RouteComponent,
|
|
138
|
+
});
|
|
139
|
+
|
|
140
|
+
function RouteComponent() {
|
|
141
|
+
+ const trpc = useDemoApi();
|
|
142
|
+
+ const echo = useQuery(
|
|
143
|
+
+ trpc.echo.queryOptions({ message: 'Hello from the API!' }),
|
|
144
|
+
+ );
|
|
145
|
+
+
|
|
146
|
+
return (
|
|
147
|
+
<div className="text-center">
|
|
148
|
+
<header>
|
|
149
|
+
<h1>Welcome</h1>
|
|
150
|
+
<p>Welcome to your new React website!</p>
|
|
151
|
+
</header>
|
|
152
|
+
+ {echo.isLoading ? (
|
|
153
|
+
+ <Spinner />
|
|
154
|
+
+ ) : echo.error ? (
|
|
155
|
+
+ <p>Error: {echo.error.message}</p>
|
|
156
|
+
+ ) : (
|
|
157
|
+
+ <p>{echo.data?.message}</p>
|
|
158
|
+
+ )}
|
|
159
|
+
</div>
|
|
160
|
+
);
|
|
161
|
+
}
|
|
162
|
+
```
|
|
163
|
+
|
|
164
|
+
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.
|
|
165
|
+
|
|
166
|
+
See the <Link path="guides/connection/react-trpc">React to tRPC connection guide</Link> for mutations, subscriptions, error handling and optimistic updates.
|
|
167
|
+
|
|
168
|
+
</Drawer>
|
|
169
|
+
|
|
121
170
|
## Step 4: Define Cloud Resources and Deploy to AWS
|
|
122
171
|
|
|
123
172
|
<Infrastructure>
|
|
124
173
|
<Fragment slot="cdk">
|
|
125
174
|
Open `packages/infra/src/stacks/application-stack.ts` and add the following code:
|
|
126
175
|
|
|
127
|
-
```
|
|
128
|
-
import {
|
|
129
|
-
DemoApi,
|
|
130
|
-
DemoWebsite,
|
|
131
|
-
UserIdentity,
|
|
132
|
-
} from '@my-project/common-constructs';
|
|
176
|
+
```diff lang="ts"
|
|
177
|
+
+import {
|
|
178
|
+
+ DemoApi,
|
|
179
|
+
+ DemoWebsite,
|
|
180
|
+
+ UserIdentity,
|
|
181
|
+
+} from '@my-project/common-constructs';
|
|
133
182
|
import { Stack, StackProps } from 'aws-cdk-lib';
|
|
134
183
|
import { Construct } from 'constructs';
|
|
135
184
|
|
|
@@ -137,13 +186,13 @@ export class ApplicationStack extends Stack {
|
|
|
137
186
|
constructor(scope: Construct, id: string, props?: StackProps) {
|
|
138
187
|
super(scope, id, props);
|
|
139
188
|
|
|
140
|
-
const identity = new UserIdentity(this, 'identity');
|
|
141
|
-
const api = new DemoApi(this, 'api', {
|
|
142
|
-
integrations: DemoApi.defaultIntegrations(this).build(),
|
|
143
|
-
});
|
|
144
|
-
api.grantInvokeAccess(identity.identityPool.authenticatedRole);
|
|
145
|
-
|
|
146
|
-
new DemoWebsite(this, 'website');
|
|
189
|
+
+ const identity = new UserIdentity(this, 'identity');
|
|
190
|
+
+ const api = new DemoApi(this, 'api', {
|
|
191
|
+
+ integrations: DemoApi.defaultIntegrations(this).build(),
|
|
192
|
+
+ });
|
|
193
|
+
+ api.grantInvokeAccess(identity.identityPool.authenticatedRole);
|
|
194
|
+
+
|
|
195
|
+
+ new DemoWebsite(this, 'website');
|
|
147
196
|
}
|
|
148
197
|
}
|
|
149
198
|
```
|
|
@@ -154,11 +203,6 @@ This is all the CDK we need to write to deploy our full stack application.
|
|
|
154
203
|
Open `packages/infra/src/main.tf` and add the following code:
|
|
155
204
|
|
|
156
205
|
```hcl
|
|
157
|
-
# Include metrics tracking for @aws/nx-plugin usage
|
|
158
|
-
module "metrics" {
|
|
159
|
-
source = "../../common/terraform/src/metrics"
|
|
160
|
-
}
|
|
161
|
-
|
|
162
206
|
# Deploy user identity
|
|
163
207
|
module "user_identity" {
|
|
164
208
|
source = "../../common/terraform/src/core/user-identity"
|
|
@@ -213,6 +257,15 @@ module "demo_website" {
|
|
|
213
257
|
|
|
214
258
|
depends_on = [module.user_identity, module.demo_api]
|
|
215
259
|
}
|
|
260
|
+
|
|
261
|
+
# Print the website URL and user pool id when the deployment finishes
|
|
262
|
+
output "website_url" {
|
|
263
|
+
value = module.demo_website.website_url
|
|
264
|
+
}
|
|
265
|
+
|
|
266
|
+
output "user_pool_id" {
|
|
267
|
+
value = module.user_identity.user_pool_id
|
|
268
|
+
}
|
|
216
269
|
```
|
|
217
270
|
|
|
218
271
|
This is all the Terraform we need to write to deploy our full stack application.
|
|
@@ -231,7 +284,7 @@ If you encounter any lint or formatting errors, you can run the following comman
|
|
|
231
284
|
<PackageManagerShortCommand commands={["lint"]} />
|
|
232
285
|
:::
|
|
233
286
|
|
|
234
|
-
:::
|
|
287
|
+
:::note[The workspace is out of sync]
|
|
235
288
|
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:
|
|
236
289
|
|
|
237
290
|
<NxCommands commands={["sync"]} />
|
|
@@ -246,7 +299,9 @@ Bootstrap your infrastructure:
|
|
|
246
299
|
<NxCommands commands={['bootstrap infra']} />
|
|
247
300
|
|
|
248
301
|
:::tip[Bootstrap Regions]
|
|
249
|
-
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.
|
|
302
|
+
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:
|
|
303
|
+
|
|
304
|
+
<NxCommands commands={['run infra:bootstrap --args="aws://<account-id>/us-east-1"']} />
|
|
250
305
|
:::
|
|
251
306
|
</Fragment>
|
|
252
307
|
<Fragment slot="terraform">
|
|
@@ -308,6 +363,8 @@ The first time you sign in as this user you are prompted to choose a new passwor
|
|
|
308
363
|
|
|
309
364
|
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.
|
|
310
365
|
|
|
366
|
+
Congratulations! 🎉 You have successfully built and deployed a full-stack application using `@aws/nx-plugin`!
|
|
367
|
+
|
|
311
368
|
## Step 6: Clean Up
|
|
312
369
|
|
|
313
370
|
When you have finished, delete the resources you deployed to avoid ongoing costs:
|
|
@@ -315,16 +372,47 @@ When you have finished, delete the resources you deployed to avoid ongoing costs
|
|
|
315
372
|
<Infrastructure>
|
|
316
373
|
<Fragment slot="cdk">
|
|
317
374
|
<NxCommands commands={['destroy-sandbox infra']} />
|
|
375
|
+
|
|
376
|
+
:::note[Retained Resources]
|
|
377
|
+
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.
|
|
378
|
+
:::
|
|
318
379
|
</Fragment>
|
|
319
380
|
<Fragment slot="terraform">
|
|
320
381
|
<NxCommands commands={['destroy infra']} />
|
|
382
|
+
|
|
383
|
+
:::note[Retained Resources]
|
|
384
|
+
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.
|
|
385
|
+
:::
|
|
321
386
|
</Fragment>
|
|
322
387
|
</Infrastructure>
|
|
323
388
|
|
|
324
|
-
|
|
325
|
-
|
|
389
|
+
To remove bootstrap resources, follow below:
|
|
390
|
+
|
|
391
|
+
<Infrastructure>
|
|
392
|
+
<Fragment slot="cdk">
|
|
393
|
+
Delete the bootstrap stack in every region you bootstrapped, including `us-east-1`. This removes the bootstrap roles and the container image repository:
|
|
394
|
+
|
|
395
|
+
```sh
|
|
396
|
+
aws cloudformation delete-stack --stack-name CDKToolkit --region <region>
|
|
397
|
+
```
|
|
398
|
+
|
|
399
|
+
:::note[Asset Bucket]
|
|
400
|
+
The asset bucket is retained on purpose, so delete it separately.
|
|
326
401
|
:::
|
|
402
|
+
</Fragment>
|
|
403
|
+
<Fragment slot="terraform">
|
|
404
|
+
<NxCommands commands={['bootstrap-destroy infra']} />
|
|
405
|
+
|
|
406
|
+
:::caution[Your Terraform State Is Deleted Too]
|
|
407
|
+
This empties and deletes the S3 bucket holding your Terraform state, so only run it once you have torn down all deployed infrastructure.
|
|
408
|
+
:::
|
|
409
|
+
</Fragment>
|
|
410
|
+
</Infrastructure>
|
|
327
411
|
|
|
328
412
|
---
|
|
329
413
|
|
|
330
|
-
|
|
414
|
+
## Next Steps
|
|
415
|
+
|
|
416
|
+
- <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.
|
|
417
|
+
- <Link path="guides/workspace">Workspaces</Link> — how your workspace is laid out, and the configuration the generators share.
|
|
418
|
+
- <Link path="get_started/existing-project">Add to an Existing Project</Link> — adopt the plugin in your existing codebase.
|
|
@@ -54,7 +54,7 @@ Let's create the new generator in `packages/nx-plugin/src/trpc/procedure`.
|
|
|
54
54
|
|
|
55
55
|
We provide a generator for creating new generators so you can quickly scaffold your new generator! You can run this generator as follows:
|
|
56
56
|
|
|
57
|
-
<RunGenerator generator="ts#nx-generator" requiredParameters={{ project: '@aws/nx-plugin', name: 'ts#trpc-api#procedure', directory: 'trpc/procedure', description: 'Adds a procedure to a tRPC API' }} />
|
|
57
|
+
<RunGenerator generator="ts#nx-generator" requiredParameters={{ project: '@aws/nx-plugin', name: 'ts#trpc-api#procedure', directory: 'trpc/procedure', description: 'Adds a procedure to a tRPC API' }} readonly />
|
|
58
58
|
|
|
59
59
|
You will notice the following files have been generated for you:
|
|
60
60
|
|
|
@@ -313,11 +313,11 @@ If you have completed the <Link path="get_started/tutorials/dungeon-game/overvie
|
|
|
313
313
|
|
|
314
314
|
In a separate directory, create a new test workspace:
|
|
315
315
|
|
|
316
|
-
<CreateNxWorkspaceCommand workspace="trpc-generator-test" />
|
|
316
|
+
<CreateNxWorkspaceCommand workspace="trpc-generator-test" readonly />
|
|
317
317
|
|
|
318
318
|
Next, let's generate a tRPC API to add the procedure to:
|
|
319
319
|
|
|
320
|
-
<RunGenerator generator="ts#api" requiredParameters={{name:"test-api", framework:"trpc"}} noInteractive />
|
|
320
|
+
<RunGenerator generator="ts#api" requiredParameters={{name:"test-api", framework:"trpc"}} noInteractive readonly />
|
|
321
321
|
|
|
322
322
|
#### Link our local Nx Plugin for AWS
|
|
323
323
|
|
|
@@ -337,7 +337,7 @@ Notice above we linked to the compiled plugin in `dist/packages/nx-plugin` rathe
|
|
|
337
337
|
|
|
338
338
|
Let's try the new generator:
|
|
339
339
|
|
|
340
|
-
<RunGenerator generator="ts#trpc-api#procedure" />
|
|
340
|
+
<RunGenerator generator="ts#trpc-api#procedure" readonly />
|
|
341
341
|
|
|
342
342
|
:::note[Generator Not Showing]
|
|
343
343
|
If you don't see the new generator in the list in VSCode, you might need to refresh the Nx workspace:
|
|
@@ -397,7 +397,7 @@ In practice, this process might look like:
|
|
|
397
397
|
|
|
398
398
|
1. Create a new workspace
|
|
399
399
|
|
|
400
|
-
<CreateNxWorkspaceCommand workspace="my-project" />
|
|
400
|
+
<CreateNxWorkspaceCommand workspace="my-project" readonly />
|
|
401
401
|
|
|
402
402
|
1. Run any generators that may be prerequisites to your new generator/feature/fix
|
|
403
403
|
1. Commit your changes (`git commit`)
|