# Simple Website Hosting on AWS S3 Using Terraform

**Introduction**

In this blog post, we'll explore the process of hosting a simple static website on Amazon Web Services (AWS) S3 using Terraform. Static websites are cost-effective and efficient, making them an excellent choice for personal portfolios, blogs, or small business websites. By the end of this guide, you'll have your website up and running on AWS S3, all managed through Terraform.

### **Step 1: Install Terraform and AWS CLI**

Before we begin, ensure that you have Terraform and the AWS CLI installed on your system. You can find installation instructions for both tools on the official Terraform [**website**](https://developer.hashicorp.com/terraform/tutorials/aws-get-started/install-cli) and the AWS CLI [**documentation**](https://docs.aws.amazon.com/cli/latest/userguide/getting-started-install.html).

### **Step 2: Create an IAM User**

To interact with AWS services, we'll need an IAM (Identity and Access Management) user with administrative access. Follow these steps:

1. Log in to your AWS account.
    
2. Navigate to the IAM service.
    
3. Click "Users" and then "Add User."
    
4. Give your user a name, and under permissions, choose "Attach policies directly" and select the "AdministratorAccess" policy.
    
5. Create an Access Key and save the CSV file containing the access key and secret access key for later use.
    

### **Step 3: Authenticate with IAM Credentials**

Open your terminal and run the following command, replacing `ACCESS_KEY` and `SECRET_KEY` with your IAM user's credentials:

$ aws configure

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1694081859309/c6c890f5-7434-4f93-abcf-6f0d37afc9b5.png align="center")

### **Step 4: Configuration using Terraform**

Create a folder for your project and open it in Visual Studio Code.My folder name is "terraform-s3-static-webhost".

1. Create a `provider.tf` file. This is where we configure the AWS provider. Refer to the [**Terraform documentation**](https://registry.terraform.io/providers/hashicorp/aws/latest/docs) for provider configuration details.
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1694085288029/f37a8540-76ec-4fb7-aa2d-70d6ec589904.png align="center")
    
    Initialize Terraform using:
    
    $ terraform init
    
    It will help us to download all the dependencies or files for the provider.
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1694082120175/dc544eaa-d2ae-4a45-9c4e-c0fa56bc0dd6.png align="center")
    
2. Create a `main.tf` file where we'll define our S3 bucket configuration. You can copy and paste the S3 bucket configuration from the [**Terraform documentation**](https://registry.terraform.io/providers/hashicorp/aws/latest/docs/resources/s3_bucket).
    
    Ensure your bucket name is unique globally.
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1694082453885/3a8b5103-c5ea-44fd-b2af-e8260a4e7eea.png align="center")
    
3. Create a `variable.tf` file to define variables, like your bucket name.
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1694082725096/e394bd75-89e2-4c14-92e7-b48290b19b92.png align="center")
    
    Run `terraform plan` and `terraform apply -auto-approve` to create the S3 bucket.
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1694083691565/d5abc0d1-259a-497f-b302-89c7bf8bc8de.png align="center")
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1694083854076/bffe568a-659f-4da4-bb93-a439930913c7.png align="center")
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1694083974796/d30f4514-efdf-436c-87d8-6872faf70665.png align="center")
    
    (-auto-approve -use this only if you want to skip typing *yes* to apply)
    
    Now navigate to your AWS account&gt;s3 and check if the bucket is successfully created or not.
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1694084375609/0dc8de56-e3e3-4dc3-9e5b-060d92e38939.png align="center")
    
4. **Manage S3 Bucket Ownership**
    
    To manage S3 bucket ownership, add the [**S3 bucket ownership controls**](https://registry.terraform.io/providers/hashicorp/aws/latest/docs/resources/s3_bucket_ownership_controls) configuration to your `main.tf` file
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1694084258501/ddf77d01-bc6f-49d5-a0ff-ed24c1bfeab5.png align="center")
    
5. **Make the Bucket Public**
    
    To make your bucket public and add an ACL resource, use the [**S3 bucket public access block**](https://registry.terraform.io/providers/hashicorp/aws/latest/docs/resources/s3_bucket_public_access_block) configuration. Set all values to 'false'.
    
    With 'public-read' ACL, this disables the default S3 bucket security settings.
    
    [https://registry.terraform.io/providers/hashicorp/aws/latest/docs/resources/s3\_bucket\_acl](https://registry.terraform.io/providers/hashicorp/aws/latest/docs/resources/s3_bucket_acl)
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1694084523536/ae375182-cc6b-49cf-83cf-7b2b8912a65c.png align="center")
    
    Run `terraform plan` and `terraform apply`. Check the changes on AWS S3 bucket permissions.
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1694087266703/fa1bb518-8133-44e6-a6b2-2775d2169780.png align="center")
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1694087561194/c5881550-b44c-47b9-a192-865945f253c5.png align="center")
    
6. **Enable Static Website Hosting**
    
    To enable static website hosting, use the [**S3 bucket website configuration**](https://registry.terraform.io/providers/hashicorp/aws/latest/docs/resources/s3_bucket_website_configuration) resource. Before that, You'll need to create `index.html` and `error.html` files in your project folder and add them to your S3 bucket using the [**S3 object**](https://registry.terraform.io/providers/hashicorp/aws/latest/docs/resources/s3_object) configuration.
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1694086574091/abe9287b-0cc8-4c14-93c3-091bc176cd00.png align="center")
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1694086503734/33b45e58-d6ec-4fd3-9d0a-ca00abf4d763.png align="center")
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1694087064454/38ce63db-57e0-45bc-ad68-af2dd3b47c39.png align="center")
    
    1. **index.html**: The index.html file is the main entry point of a website. It contains the content and structure of the webpage that visitors see first when they access the site.
        
    2. **error.html**: The error.html file is a custom error page that is displayed when a visitor encounters an issue or error while navigating the website. It provides a user-friendly message to help users understand and resolve the problem.
        
    
    Edit `index.html` to customize your website. Retrieve the object URL for `profile.jpg` in your AWS S3 bucket(AWS &gt;S3 &gt; your bucket&gt;profile.jpeg &gt;copy object URL).
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1694086764891/12aa3e09-a7cd-439b-b2ba-8ee68cac4856.png align="center")
    
    Go to VSC&gt;index.html add this object URL to *img src.*
    
    After making changes, run `terraform plan` and `terraform apply`. Navigate to AWS S3 &gt; your bucket &gt; properties &gt; static web hosting to see your portfolio.
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1694086891472/ad064f14-64f6-4d10-bb83-2095b78789cb.png align="center")
    

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1694418781290/c26cf430-9573-4634-87da-cd031c04a2cb.png align="center")

**Project**

You can find the Project on my github:

[https://github.com/Anju12345hub/Terraform-s3-static-webhosting-project](https://github.com/Anju12345hub/Terraform-s3-static-webhosting-project)

**Reference**

[https://youtu.be/wFWg0Y68Owo?si=gYRjlTg0xFUQSF4q](https://youtu.be/wFWg0Y68Owo?si=gYRjlTg0xFUQSF4q)

**Conclusion**

You've successfully hosted a simple static website on AWS S3 using Terraform. This setup is not only cost-effective but also scalable and reliable. Feel free to customize your website further and explore more advanced AWS features to enhance your hosting experience. Happy hosting!
