How to deploy a static website / app in AWS.

Deploying a website or app on Amazon Web Services (AWS) provides a reliable and scalable platform for your application. With AWS’s global infrastructure, your app can perform optimally and remain accessible to users worldwide. This guide will walk you through the steps to deploy a static website or app on AWS seamlessly.

In this demo, we will deploy a static site on S3 bucket instead of using a EC2 instance, which is also a way to have a app running on aws among many others.

Prerequisites

• An AWS account.
• An existing app / website.
• AWS CLI installed and configured.

Step 1: Create an S3 Bucket

Amazon S3 is a very versatile object storage product that you can use for hosting static websites. To set it up:

1. Log in to your AWS account.
2. Navigate to the S3 service and click Create bucket.
3. Enter a unique name for your bucket and select a region (Remember that bucket names must be globally unique meaning across all AWS accounts not just yours , so if you get errors just add numbers to the name).
4. Disable the ‘Block all public access’ option to make your site accessible. (Usually you would use IAM roles to access to bucket in a secure controlled way but for static hosting we can allow all public access)
5. Click Create to finalize.

Step 2: Upload Build Files to S3 Bucket

Once your bucket is ready, upload your app’s files:

1. Open your terminal and navigate to the build folder in your project.
2. Use the following command to upload files to S3: aws s3 sync build/ s3://<your-bucket-name>/ , Replace <your-bucket-name> with the name of your S3 bucket.

Step 3: Configure S3 Bucket for Static Hosting

Enable static website hosting for your bucket:

1. Open your bucket in the S3 console and go to the Properties tab.
2. In the Static website hosting section, enable hosting.
3. Set index.html as the index document and error.html (optionnal) as the error document.
4. Save the changes.

Step 4: Associate a Domain Name (Optional)

To make your app accessible via a custom domain:

1. Use AWS Route 53 or any DNS provider to register a domain name.
2. Configure the domain to point to your S3 bucket.

Step 6: Enable CloudFront CDN (Optional)

Improve your app’s performance by using AWS CloudFront for content delivery:

1. In the AWS Management Console, navigate to CloudFront and create a new distribution.
2. Link your S3 bucket as the origin.
3. Configure caching and other settings as needed.

Conclusion

Congratulations! Your website / app is now deployed on AWS using S3 for hosting. This setup ensures your app is fast, reliable, and ready for users across the globe. Optional steps like adding a custom domain or enabling a CDN can further enhance user experience.