Hosting AI Model Demos as Static Websites on S3

Question

Pulumi · Accepted Answer

To host AI model demos as static websites on Amazon S3, you'll need to create an S3 bucket configured for website hosting. Then, you'll upload your HTML, JavaScript, and any other static files to this bucket. Optionally, you could also set up a CDN with AWS CloudFront to distribute your content globally with low latency.

Here’s how you can do this using Pulumi and Python:

1. **Create an S3 bucket**: Use `aws.s3.Bucket` to create a new S3 bucket.
2. **Configure the bucket for web hosting**: Use the `website` argument in `aws.s3.Bucket` to specify the index document and error document.
3. **Upload static files**: Use `aws.s3.BucketObject` for each file you need to upload to the S3 bucket.
4. **Set up a CDN with CloudFront** (optional): Use `aws.cloudfront.Distribution` to create a CloudFront distribution. You'll specify your S3 bucket as an origin and configure cache behaviors.

Below is the Pulumi program written in Python that accomplishes these tasks:

```python
import pulumi
import pulumi_aws as aws

# Create an S3 bucket configured for website hosting.
static_website_bucket = aws.s3.Bucket("static-website-bucket",
    website=aws.s3.BucketWebsiteArgs(
        index_document="index.html",
        error_document="error.html"
    )
)

# Upload the index page to the S3 bucket.
index_page = aws.s3.BucketObject("index-page",
    bucket=static_website_bucket.id,
    key="index.html",
    content_type="text/html",
    source=pulumi.FileAsset("./site/index.html")  # Path to your index.html file.
)

# Replace the previous step with additional BucketObject instances for other files you need, such as CSS, JavaScript, etc.

# Set up AWS CloudFront to distribute your website (optional).
cdn = aws.cloudfront.Distribution("cdn",
    origins=[aws.cloudfront.DistributionOriginArgs(
        domain_name=static_website_bucket.bucket_regional_domain_name.apply(lambda domain_name: f"{domain_name}.s3.amazonaws.com"),
        origin_id=static_website_bucket.id,
    )],
    enabled=True,
    is_ipv6_enabled=True,
    comment="CDN for AI Model Demo Static Website",
    default_root_object="index.html",
    default_cache_behavior=aws.cloudfront.DistributionDefaultCacheBehaviorArgs(
        viewer_protocol_policy="redirect-to-https",
        allowed_methods=["GET", "HEAD"],
        cached_methods=["GET", "HEAD"],
        target_origin_id=static_website_bucket.id,
        forwarded_values=aws.cloudfront.DistributionDefaultCacheBehaviorForwardedValuesArgs(
            query_string=False,
            cookies=aws.cloudfront.DistributionDefaultCacheBehaviorForwardedValuesCookiesArgs(
                forward="none"
            )
        ),
        min_ttl=0,
        default_ttl=3600,
        max_ttl=86400,
    ),
    price_class="PriceClass_All",
    restrictions=aws.cloudfront.DistributionRestrictionsArgs(
        geo_restriction=aws.cloudfront.DistributionRestrictionsGeoRestrictionArgs(
            restriction_type="none",
        )
    ),
    viewer_certificate=aws.cloudfront.DistributionViewerCertificateArgs(
        cloudfront_default_certificate=True,
    )
)

# Export the website URL and CloudFront distribution domain.
pulumi.export("website_url", static_website_bucket.website_endpoint)
pulumi.export("cloudfront_domain", cdn.domain_name)
```

### Explanation:

- `aws.s3.Bucket`: Creates a new S3 bucket that will host the static website files.
- `aws.s3.BucketWebsiteArgs`: Configures the created S3 bucket to serve a static website specifying an `index_document` and an `error_document`.
- `aws.s3.BucketObject`: Uploads the `index.html` file to the S3 bucket; you should repeat this for each static file needed for your site.
- `pulumi.FileAsset`: Points to the local path of your `index.html` file which gets uploaded to S3.
- `aws.cloudfront.Distribution`: (Optional) Sets up a CloudFront distribution for your S3 bucket, providing a cached CDN endpoint for the static website.
- `pulumi.export`: Outputs the website endpoint URL and the CDN domain name so you can easily access them after deployment.