Building a Static Website with Terraform: Step-by-Step Guide

Creating and hosting a static website has never been easier with the power of Infrastructure as Code (IaC) and cloud services. In this guide, we'll walk you through setting up a static website using Terraform to manage AWS resources. You'll learn how to automate the creation of an S3 bucket, configure it for static website hosting, deploy your website files, and some additional considerations.

Prerequisites

Before we start, ensure you have the following:
• An AWS account.
• AWS CLI installed and configured with appropriate permissions.
• Terraform installed.

Step 1: Initialize Your Project

Create a new directory for your Terraform project and navigate to it:

mkdir my-static-website

cd my-static-website

Step 2: Define Your Terraform Configuration

Create a file named terraform.tf and define your provider configuration:

terraform {
  required_version = ">= 1.8.5"
  required_providers {
    aws = {
      source  = "hashicorp/aws"
      version = "~> 5.40.0"
    }
  }
}

provider "aws" {
  profile = "default"
  region  = "ap-south-1"
}

This configuration sets up Terraform to use the AWS provider, specifying your AWS profile and region.

Step 3: Create the S3 Bucket

Create a file named bucket.tf to define your S3 bucket and its configuration:

resource "aws_s3_bucket" "terraform_demo_43234" {
  bucket = "terraform-demo-43234-unique-id" # Ensure this bucket name is unique
}

resource "aws_s3_object" "terraform_index" {
  bucket       = aws_s3_bucket.terraform_demo_43234.id
  key          = "index.html"
  source       = "index.html"
  content_type = "text/html"
  etag         = filemd5("index.html")
}

resource "aws_s3_bucket_website_configuration" "terraform_hosting" {
  bucket = aws_s3_bucket.terraform_demo_43234.id

  index_document {
    suffix = "index.html"
  }
}

This defines an S3 bucket and uploads an index.html file to it, configuring the bucket for static website hosting.

Step 4: Set Bucket Policies

Create a file named policy.tf to define your S3 bucket policies for public access:

resource "aws_s3_bucket_public_access_block" "terraform_demo" {
  bucket                  = aws_s3_bucket.terraform_demo_43234.id
  block_public_acls       = false
  block_public_policy     = false
}

resource "aws_s3_bucket_policy" "open_access" {
  bucket = aws_s3_bucket.terraform_demo_43234.id

  policy = jsonencode({
    Version = "2012-10-17"
    Id      = "Public_access"
    Statement = [
      {
        Sid       = "IPAllow"
        Effect    = "Allow"
        Principal = "*"
        Action    = ["s3:GetObject"]
        Resource  = "${aws_s3_bucket.terraform_demo_43234.arn}/*"
      },
    ]
  })

  depends_on = [aws_s3_bucket_public_access_block.terraform_demo]
}

This ensures your bucket's objects are publicly accessible.

Step 5: Output the Website URL

Create a file named output.tf to output your website's URL:

output "website_url" {
  value = "http://${aws_s3_bucket.terraform_demo_43234.bucket}.s3-website.${aws_s3_bucket.terraform_demo_43234.region}.amazonaws.com"
}

This outputs the URL of your hosted static website after deployment.

Step 6: Deploy Your Static Website

1. Initialize Terraform:

terraform init

This command prepares your working directory for other Terraform commands.

2. Apply the Configuration:

terraform apply

Review the changes and confirm with yes.

3. Access Your Website:

After the apply process completes, Terraform will output your website's URL. Visit this URL to see your static website live.

Additional Considerations

• Custom Domain: To use a custom domain for your static website, you can set up Route 53 for DNS management and CloudFront for CDN and SSL/TLS termination.

• Versioning and Backup: Enable versioning on your S3 bucket to maintain backups of your files. This helps in case of accidental deletion or modification.

• Security: Review and implement appropriate security measures, such as bucket policies and IAM roles, to restrict access and protect your resources.

• Monitoring and Logging: Set up S3 access logging and CloudWatch alarms to monitor and manage your static website's performance and availability.

Conclusion

Congratulations! You've successfully deployed a static website using Terraform on AWS. By leveraging Infrastructure as Code, you can manage your resources efficiently and ensure consistency across deployments. This approach not only saves time but also enhances scalability and maintainability for your projects.

Feel free to explore more Terraform resources and customize your setup further. Happy coding!