How to setup Amazon Cloudfront and S3 to serve static resources

Amazon CloudFront is a content delivery network (CDN) that helps you serve static content such as images and videos to your users faster and more efficiently by caching it at edge locations around the world. Amazon S3 is a highly scalable and durable cloud storage service that lets you store and retrieve data from anywhere on the web. By combining Amazon CloudFront with Amazon S3, you can serve static content to your users more reliably, with lower latency, and at lower cost.

Here are the steps to set up and configure Amazon CloudFront and S3 Storage to serve static content:

Step 1: Create an Amazon S3 Bucket

The first step is to create an Amazon S3 bucket to store your static content. You can do this by logging in to the Amazon S3 Console and clicking on “Create Bucket”. Give your bucket a unique name and select a region that is closest to your users. You can also configure other settings such as versioning, logging, and object-level permissions.

Next, configure the bucket permissions to allow public read access to your static content. This can be done by adding a bucket policy that grants “s3:GetObject” permission to “Everyone” or by setting the access control list (ACL) for your objects to “Public”. You can also encrypt your data at rest using server-side encryption (SSE).

Step 2: Upload Your Static Content to Amazon S3

Once you have created your S3 bucket, you can upload your static content to it. This can be done through the S3 console, or by using an S3 client such as Cyberduck or FileZilla. You can upload individual files or entire directories, and you can also use lifecycle policies to manage your data retention and deletion.

Step 3: Create an Amazon CloudFront Distribution

After you have uploaded your static content to your S3 bucket, the next step is to create an Amazon CloudFront distribution. This can be done through the Amazon CloudFront console. Go to the CloudFront console and create a new distribution. Choose “Web” as the delivery method and select your S3 bucket as the origin. Make sure to select the “Restrict Bucket Access” option to allow CloudFront to access your S3 bucket. In the distribution settings, configure the default cache behavior and any other settings you need, such as SSL/TLS certificate, origin access identity, or price class.

Step 4: Configure Your DNS Settings

After you have created your CloudFront distribution, you will need to configure your DNS settings to point your domain name or subdomain to your CloudFront distribution. This can be done through your domain registrar or DNS provider.

You will need to create a CNAME record that points to your CloudFront distribution domain name. For example, if your CloudFront domain name is d123456789.cloudfront.net, you would create a CNAME record that points to this domain name.

Step 5: Test Your Setup

Once you have configured your DNS settings, you can test your setup by accessing your static content through your CloudFront distribution domain name. Your content should now be served faster and more efficiently to your users.

Conclusion

Amazon CloudFront and S3 Storage provide a powerful and cost-effective solution for serving static content such as images and videos.