Hosting Web Components on Amazon S3

Static assets like e.g. html,css or JavaScript files can be directly deployed to Amazon S3 with the AWS Cloud Development Kit (CDK) in Java.

You will have to create the S3 bucket first:

public class CDKStack extends Stack {

public CDKStack(final Construct scope, final String id, final StackProps props) {
    super(scope, id, props);

    var bucket = Bucket.Builder.create(this, id+"-bucket").
                    bucketName("wc-on-s3-with-airhacks").
                    publicReadAccess(true).
                    websiteIndexDocument("index.html").
                build();

...and then deploy the website from a folder:

    BucketDeployment.Builder.create(this, id+"-deployment").
        sources(List.of(Source.asset("./website/src/"))).
        destinationBucket(bucket).
    build();

The website's URL becomes available after a successful deployment: mvn package && cdk deploy with the following output:

CfnOutput.Builder.create(this, id + "-url").value(bucket.getBucketWebsiteUrl()).build();

In a production system, you could use AWS CloudFront for global caching. The SSL certificate is available via AWS ACM, and a nicer domain name can be registered and configured with AWS Route 53.

The example website in the screencast was taken from: github.com/AdamBien/bce.design and the "streamlined CDK starter" is available from: github.com/AdamBien/aws-cdk-plain.

See it in action: