AWS S3 Bucket Setup Guide šŸš€

AWS S3 Bucket Setup Guide šŸš€
Setting up an S3 Bucket for your project on AWS is a breeze! Follow this guide to get your static website live in no time.

āœ” Access the Console:
- Start by signing into the AWS Management Console.
- Navigate to the Amazon S3 console from the services menu.

āœ” Create Your Bucket:
- In the left pane, select Buckets.
- Click Create bucket.
- Enter a unique name for your bucket. This name cannot be changed later and must be unique within the region you select.

āœ” Select Region:
- Choose your desired AWS Region, such as US East (N. Virginia) us-east-1.

āœ” Configure Access Settings:
- Under Block Public Access settings, uncheck the block options to unblock all. This ensures your bucket is accessible for public use, particularly important for static website hosting.

āœ” Upload Project Build:
- Run `npm run build` in your project to generate the build folder for deployment.
- Navigate to the build folder of your project.
- Drag and drop all files, including the static folder, into the S3 bucket.
- Click Upload to begin the process.

āœ” Organize Your Files:
- Ensure that all files and folders are located in the root directory of the S3 bucket.
- If necessary, use the Move option to arrange the files properly to avoid broken links or loading issues.

āœ” Set Bucket Policy for Public Access:
- Go to the Permissions tab of your bucket.
- Under Bucket Policy, add a policy that allows public access to the objects in your bucket. Example policy:

  ```json
  {
    "Version": "2012-10-17",
    "Statement": [
      {
        "Sid": "PublicReadGetObject",
        "Effect": "Allow",
        "Principal": "*",
        "Action": "s3:GetObject",
        "Resource": "arn:aws:s3:::your-bucket-name/*"
      }
    ]
  }
  ```

āœ” Enable Encryption:
- Under the Properties tab, enable Server-side encryption.
- Choose Amazon S3 managed keys (SSE-S3) for added security.

āœ” Activate Static Website Hosting:
- In the Properties tab, scroll down to find Static website hosting.
- Enable static hosting, and for Index document, enter `index.html`.

āœ” Test Your Website:
- Navigate back to the Objects tab.
- Find and click on `index.html` to retrieve the static website URL.
- Use the provided link to test your website! šŸŒ

Published: Aug 2024

ā† Back to Blog