diff --git a/packages/@aws-cdk/aws-amplify-alpha/README.md b/packages/@aws-cdk/aws-amplify-alpha/README.md index 5cb37b99e28ce..0aa1e72e37726 100644 --- a/packages/@aws-cdk/aws-amplify-alpha/README.md +++ b/packages/@aws-cdk/aws-amplify-alpha/README.md @@ -225,6 +225,16 @@ const amplifyApp = new amplify.App(this, 'App', { }); ``` +## Configure server side rendering when hosting app + +Setting the `platform` field on the Amplify `App` construct can be used to control whether the app will host only static assets or server side rendered assets in addition to static. By default, the value is set to `WEB` (static only), however, server side rendering can be turned on by setting to `WEB_COMPUTE` as follows: + +```ts +const amplifyApp = new amplify.App(this, 'MyApp', { + platform: amplify.Platform.WEB_COMPUTE, +}); +``` + ## Deploying Assets `sourceCodeProvider` is optional; when this is not specified the Amplify app can be deployed to using `.zip` packages. The `asset` property can be used to deploy S3 assets to Amplify as part of the CDK: diff --git a/packages/@aws-cdk/aws-amplify-alpha/lib/app.ts b/packages/@aws-cdk/aws-amplify-alpha/lib/app.ts index f0aaa7a7176f7..1398a1edf2c0d 100644 --- a/packages/@aws-cdk/aws-amplify-alpha/lib/app.ts +++ b/packages/@aws-cdk/aws-amplify-alpha/lib/app.ts @@ -158,6 +158,15 @@ export interface AppProps { * @default - a new role is created */ readonly role?: iam.IRole; + + /** + * Indicates the hosting platform to use. Set to WEB for static site + * generated (SSG) apps (i.e. a Create React App or Gatsby) and WEB_COMPUTE + * for server side rendered (SSR) apps (i.e. NextJS). + * + * @default - WEB + */ + readonly platform?: Platform; } /** @@ -248,6 +257,7 @@ export class App extends Resource implements IApp, iam.IGrantable { oauthToken: sourceCodeProviderOptions?.oauthToken?.unsafeUnwrap(), // Safe usage repository: sourceCodeProviderOptions?.repository, customHeaders: props.customResponseHeaders ? renderCustomResponseHeaders(props.customResponseHeaders) : undefined, + platform: props.platform || Platform.WEB, }); this.appId = app.attrAppId; @@ -528,3 +538,16 @@ function renderCustomResponseHeaders(customHeaders: CustomResponseHeader[]): str return `${yaml.join('\n')}\n`; } + +export enum Platform { + /** + * WEB - Used to indicate that the app is hosted using only static assets. + */ + WEB = 'WEB', + + /** + * WEB_COMPUTE - Used to indicate the app is hosted using a combination of + * server side rendered and static assets. + */ + WEB_COMPUTE = 'WEB_COMPUTE', +} diff --git a/packages/@aws-cdk/aws-amplify-alpha/test/app.test.ts b/packages/@aws-cdk/aws-amplify-alpha/test/app.test.ts index 8e7c4e9f24b9b..b5c800bf387d6 100644 --- a/packages/@aws-cdk/aws-amplify-alpha/test/app.test.ts +++ b/packages/@aws-cdk/aws-amplify-alpha/test/app.test.ts @@ -442,3 +442,25 @@ test('with custom headers', () => { }, }); }); + +test('create a statically hosted app by default', () => { + // WHEN + new amplify.App(stack, 'App', {}); + + // THEN + Template.fromStack(stack).hasResourceProperties('AWS::Amplify::App', { + Platform: amplify.Platform.WEB, + }); +}); + +test('create a dynamically rendered app when the platform is set to WEB_COMPUTE', () => { + // WHEN + new amplify.App(stack, 'App', { + platform: amplify.Platform.WEB_COMPUTE, + }); + + // THEN + Template.fromStack(stack).hasResourceProperties('AWS::Amplify::App', { + Platform: amplify.Platform.WEB_COMPUTE, + }); +}); diff --git a/packages/@aws-cdk/aws-amplify-alpha/test/integ.app-asset-deployment.js.snapshot/cdk-amplify-app-asset-deployment.template.json b/packages/@aws-cdk/aws-amplify-alpha/test/integ.app-asset-deployment.js.snapshot/cdk-amplify-app-asset-deployment.template.json index fa569dddee6d3..8efab94ff98ac 100644 --- a/packages/@aws-cdk/aws-amplify-alpha/test/integ.app-asset-deployment.js.snapshot/cdk-amplify-app-asset-deployment.template.json +++ b/packages/@aws-cdk/aws-amplify-alpha/test/integ.app-asset-deployment.js.snapshot/cdk-amplify-app-asset-deployment.template.json @@ -29,7 +29,8 @@ "AppRole1AF9B530", "Arn" ] - } + }, + "Platform": "WEB" } } }, @@ -67,4 +68,4 @@ ] } } -} \ No newline at end of file +} diff --git a/packages/@aws-cdk/aws-amplify-alpha/test/integ.app-codecommit.js.snapshot/cdk-amplify-codecommit-app.template.json b/packages/@aws-cdk/aws-amplify-alpha/test/integ.app-codecommit.js.snapshot/cdk-amplify-codecommit-app.template.json index 79781cb08b86b..cb96e980bfe05 100644 --- a/packages/@aws-cdk/aws-amplify-alpha/test/integ.app-codecommit.js.snapshot/cdk-amplify-codecommit-app.template.json +++ b/packages/@aws-cdk/aws-amplify-alpha/test/integ.app-codecommit.js.snapshot/cdk-amplify-codecommit-app.template.json @@ -67,7 +67,8 @@ "Repo02AC86CF", "CloneUrlHttp" ] - } + }, + "Platform": "WEB" } }, "AppmainF505BAED": { @@ -119,4 +120,4 @@ ] } } -} \ No newline at end of file +} diff --git a/packages/@aws-cdk/aws-amplify-alpha/test/integ.app.js.snapshot/cdk-amplify-app.template.json b/packages/@aws-cdk/aws-amplify-alpha/test/integ.app.js.snapshot/cdk-amplify-app.template.json index ddcac808c7c09..a0d4dcb69bbd1 100644 --- a/packages/@aws-cdk/aws-amplify-alpha/test/integ.app.js.snapshot/cdk-amplify-app.template.json +++ b/packages/@aws-cdk/aws-amplify-alpha/test/integ.app.js.snapshot/cdk-amplify-app.template.json @@ -79,7 +79,8 @@ "AppRole1AF9B530", "Arn" ] - } + }, + "Platform": "WEB_COMPUTE" } }, "AppmainF505BAED": { @@ -137,4 +138,4 @@ ] } } -} \ No newline at end of file +} diff --git a/packages/@aws-cdk/aws-amplify-alpha/test/integ.app.ts b/packages/@aws-cdk/aws-amplify-alpha/test/integ.app.ts index 737d226ce92c2..e0fa9ec65447b 100644 --- a/packages/@aws-cdk/aws-amplify-alpha/test/integ.app.ts +++ b/packages/@aws-cdk/aws-amplify-alpha/test/integ.app.ts @@ -25,6 +25,7 @@ class TestStack extends Stack { }, }, ], + platform: amplify.Platform.WEB_COMPUTE, }); amplifyApp.addCustomRule({