Skip to content

Commit

Permalink
feat(amplify): enables apps hosted with server side rendering (#26861)
Browse files Browse the repository at this point in the history
### Problem:
The Amplify App L2 construct does not support the ability for customers to configure a SSR app without reaching down into the lower level L1.

### Solution:
Expose the `platform` field used to set SSG vs SSR hosted applications. Do not expose `WEB_DYNAMIC` as SSRv1 is on the deprecation path.

### Testing Done:
* `yarn build+test`
* added new tests for `platform` field
* updated snapshots for new default value

Closes #24076 and #23325

----

*By submitting this pull request, I confirm that my contribution is made under the terms of the Apache-2.0 license*
  • Loading branch information
srquinn21 authored Aug 25, 2023
1 parent 8a3db0a commit c67da83
Show file tree
Hide file tree
Showing 7 changed files with 65 additions and 6 deletions.
10 changes: 10 additions & 0 deletions packages/@aws-cdk/aws-amplify-alpha/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -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:
Expand Down
23 changes: 23 additions & 0 deletions packages/@aws-cdk/aws-amplify-alpha/lib/app.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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;
}

/**
Expand Down Expand Up @@ -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;
Expand Down Expand Up @@ -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',
}
22 changes: 22 additions & 0 deletions packages/@aws-cdk/aws-amplify-alpha/test/app.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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,
});
});
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,8 @@
"AppRole1AF9B530",
"Arn"
]
}
},
"Platform": "WEB"
}
}
},
Expand Down Expand Up @@ -67,4 +68,4 @@
]
}
}
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -67,7 +67,8 @@
"Repo02AC86CF",
"CloneUrlHttp"
]
}
},
"Platform": "WEB"
}
},
"AppmainF505BAED": {
Expand Down Expand Up @@ -119,4 +120,4 @@
]
}
}
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -79,7 +79,8 @@
"AppRole1AF9B530",
"Arn"
]
}
},
"Platform": "WEB_COMPUTE"
}
},
"AppmainF505BAED": {
Expand Down Expand Up @@ -137,4 +138,4 @@
]
}
}
}
}
1 change: 1 addition & 0 deletions packages/@aws-cdk/aws-amplify-alpha/test/integ.app.ts
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,7 @@ class TestStack extends Stack {
},
},
],
platform: amplify.Platform.WEB_COMPUTE,
});

amplifyApp.addCustomRule({
Expand Down

0 comments on commit c67da83

Please sign in to comment.