Skip to content

Commit 164c326

Browse files
rossmck80kaiz-io
rossmck80
and
kaiz-io
authored
Creating a simpler version of Typescript static website hosting without Cloudfront, ACM and Route53 (#1104)
* Added new Typescript example static-site-basic * Removed DO_NOT_AUTOTEST file - no preconfiguration required * tidied up comments * Update package.json * Update cdk.json --------- Co-authored-by: Michael Kaiser <[email protected]> Co-authored-by: Michael Kaiser <[email protected]>
1 parent 8a39ebd commit 164c326

File tree

8 files changed

+191
-0
lines changed

8 files changed

+191
-0
lines changed

‎typescript/static-site-basic/README.md‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
# Static site
2+
3+
## <!--BEGIN STABILITY BANNER-->
4+
5+
![Stability: Experimental](https://img.shields.io/badge/stability-Experimental-important.svg?style=for-the-badge)
6+
7+
> **This is an experimental example. It may not build out of the box**
8+
>
9+
> This example is built on Construct Libraries marked "Experimental" and may not be updated for latest breaking changes.
10+
>
11+
> If build is unsuccessful, please create an [issue](https://github.com/aws-samples/aws-cdk-examples/issues/new) so that we may debug the problem
12+
13+
---
14+
15+
<!--END STABILITY BANNER-->
16+
17+
This example creates the infrastructure for hosting a static site, which uses an S3 bucket for storing the content. The site contents (located in the 'site-contents' sub-directory) are deployed to the bucket. As this is a basic example, it is not intended for production workloads. It does not use a CloudFront distribution or SSL.
18+
19+
## Prep
20+
21+
## Deploy
22+
23+
```shell
24+
$ npm install -g aws-cdk
25+
$ npm install
26+
$ npm run build
27+
$ cdk deploy -c static-content-prefix=web/static
28+
```

‎typescript/static-site-basic/cdk.json‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"app": "ts-node index.ts"
3+
}

‎typescript/static-site-basic/index.ts‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
#!/usr/bin/env node
2+
import * as cdk from "aws-cdk-lib";
3+
import { StaticSiteBasic } from "./static-site-basic";
4+
5+
/**
6+
* This stack allows the user to specify a prefix path for static content in their
7+
* website hosting bucket.
8+
* Use 'cdk synth -c static-content-prefix=web/static '
9+
* Or add the following to cdk.json:
10+
* {
11+
* "context": {
12+
* "static-content-prefix": "web/static",
13+
* }
14+
* }
15+
**/
16+
class MyStaticSiteBasicStack extends cdk.Stack {
17+
constructor(parent: cdk.App, name: string, props: cdk.StackProps) {
18+
super(parent, name, props);
19+
20+
new StaticSiteBasic(this, "StaticSiteBasic", {
21+
staticContentPrefix: this.node.tryGetContext("static-content-prefix"),
22+
});
23+
}
24+
}
25+
26+
const app = new cdk.App();
27+
28+
new MyStaticSiteBasicStack(app, "MyStaticSite", {
29+
env: {
30+
account: app.node.tryGetContext("accountId"),
31+
},
32+
});
33+
34+
app.synth();

‎typescript/static-site-basic/package.json‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
{
2+
"name": "static-site-basic",
3+
"version": "1.0.0",
4+
"description": "Infrastructure for hosting an HTTP website in S3",
5+
"scripts": {
6+
"build": "tsc",
7+
"watch": "tsc -w",
8+
"cdk": "cdk"
9+
},
10+
"author": {
11+
"name": "Amazon Web Services",
12+
"url": "https://aws.amazon.com",
13+
"organization": true
14+
},
15+
"license": "Apache-2.0",
16+
"devDependencies": {
17+
"@types/node": "^10.17.0",
18+
"aws-cdk": "*",
19+
"typescript": "~5.1.6"
20+
},
21+
"dependencies": {
22+
"aws-cdk-lib": "^2.0.0",
23+
"constructs": "^10.0.0",
24+
"ts-node": "^10.9.2"
25+
}
26+
}

‎typescript/static-site-basic/site-contents/error.html‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
<html>
2+
<header><title>Hello world: Error</title></header>
3+
<body>
4+
Uh oh, you reached the error page!
5+
</body>
6+
</html>

‎typescript/static-site-basic/site-contents/index.html‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
<html>
2+
<header><title>Hello world</title></header>
3+
<body>
4+
Hello, world!
5+
</body>
6+
</html>

‎typescript/static-site-basic/static-site-basic.ts‎

Lines changed: 61 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
#!/usr/bin/env node
2+
import * as s3 from "aws-cdk-lib/aws-s3";
3+
import * as s3deploy from "aws-cdk-lib/aws-s3-deployment";
4+
import { CfnOutput, RemovalPolicy, Stack } from "aws-cdk-lib";
5+
import { Construct } from "constructs";
6+
import path = require("path");
7+
8+
export interface StaticSiteBasicProps {
9+
staticContentPrefix: string;
10+
}
11+
12+
/**
13+
* Static site infrastructure, which deploys site content to an S3 bucket.
14+
*/
15+
export class StaticSiteBasic extends Construct {
16+
constructor(parent: Stack, name: string, props: StaticSiteBasicProps) {
17+
super(parent, name);
18+
19+
// Content bucket
20+
const indexDocument = "index.html";
21+
22+
const websiteBucket = new s3.Bucket(this, "WebsiteBucket", {
23+
websiteIndexDocument: indexDocument,
24+
publicReadAccess: true,
25+
blockPublicAccess: new s3.BlockPublicAccess({
26+
blockPublicAcls: false,
27+
blockPublicPolicy: false,
28+
ignorePublicAcls: false,
29+
restrictPublicBuckets: false,
30+
}),
31+
/**
32+
* The default removal policy is RETAIN, which means that cdk destroy will not attempt to delete
33+
* the new bucket, and it will remain in your account until manually deleted. By setting the policy to
34+
* DESTROY, cdk destroy will attempt to delete the bucket, but will error if the bucket is not empty.
35+
*/
36+
removalPolicy: RemovalPolicy.DESTROY, // NOT recommended for production code
37+
38+
/**
39+
* For sample purposes only, if you create an S3 bucket then populate it, stack destruction fails. This
40+
* setting will enable full cleanup of the demo.
41+
*/
42+
autoDeleteObjects: true, // NOT recommended for production code
43+
});
44+
45+
new CfnOutput(this, "Bucket", { value: websiteBucket.bucketName });
46+
new CfnOutput(this, "StaticSiteUrl", {
47+
value: [
48+
websiteBucket.bucketWebsiteUrl,
49+
props.staticContentPrefix,
50+
indexDocument,
51+
].join("/"),
52+
});
53+
54+
// Deploy site contents to S3 bucket
55+
new s3deploy.BucketDeployment(this, "DeployWebsite", {
56+
sources: [s3deploy.Source.asset(path.join(__dirname, "./site-contents"))],
57+
destinationBucket: websiteBucket,
58+
destinationKeyPrefix: props.staticContentPrefix, // optional prefix in destination bucket
59+
});
60+
}
61+
}

‎typescript/static-site-basic/tsconfig.json‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
{
2+
"compilerOptions": {
3+
"target": "ES2018",
4+
"module": "commonjs",
5+
"lib": [
6+
"es2016",
7+
"es2017.object",
8+
"es2017.string"
9+
],
10+
"strict": true,
11+
"noImplicitAny": true,
12+
"strictNullChecks": true,
13+
"noImplicitThis": true,
14+
"alwaysStrict": true,
15+
"noUnusedLocals": true,
16+
"noUnusedParameters": true,
17+
"noImplicitReturns": true,
18+
"noFallthroughCasesInSwitch": false,
19+
"inlineSourceMap": true,
20+
"inlineSources": true,
21+
"experimentalDecorators": true,
22+
"strictPropertyInitialization": false
23+
},
24+
"include": [
25+
"./*.ts"
26+
]
27+
}

0 commit comments

Comments
 (0)