├── README.md
└── Static Webiste Hosting Using Terraform
    ├── error.html
    ├── index.html
    ├── output.tf
    ├── provider.tf
    └── resource.tf


/README.md:
--------------------------------------------------------------------------------
  1 | #  Terraform AWS S3 Static Website Hosting
  2 | 
  3 | ## Project Description:
  4 | In this project, I developed a streamlined infrastructure for hosting a static website using Terraform and Amazon Web Services (AWS) S3. The primary goal of this project is to demonstrate the automated provisioning and deployment of a web hosting solution for static websites.
  5 | 
  6 | ## Overview:
  7 | 
  8 | ![s3](https://github.com/mathesh-me/static-website-host-1/assets/144098846/ab68ff80-7841-4674-9b3c-ceac0710a39b)
  9 | 
 10 | 
 11 | ## Key Components and Features:
 12 | 
 13 | ### Terraform Infrastructure as Code (IaC):
 14 | I utilized Terraform, an IaC tool, to define and provision the AWS resources required for my static website hosting solution. This allows for version-controlled, repeatable infrastructure deployments.
 15 | 
 16 | ### AWS S3 Bucket:
 17 | I created an S3 bucket to store and serve the static website files. This bucket is configured for website hosting, allowing for easy content delivery.
 18 | 
 19 | ### Content Upload and Management: 
 20 | I provided instructions and scripts for uploading and managing my website content within the S3 bucket.
 21 | 
 22 | ## Prerequisites:
 23 | 
 24 | 1. Basic knowledge of AWS services and concepts.
 25 | 2. Familiarity with Terraform and infrastructure as code principles.
 26 | 3. An AWS account with appropriate permissions.
 27 | 4. An IDE of your Choice , I would suggest VS Code Editor .
 28 | 5. This project serves as an excellent foundation for hosting various types of static websites, including personal blogs, portfolio sites, or small business websites.
 29 | 
 30 | 
 31 | ## Steps :
 32 | 
 33 | ### Step 1: Set Up Your Development Environment
 34 | 
 35 | Install Terraform and the AWS Command Line Interface (CLI) on your local machine.
 36 | Configure your AWS credentials by running ```aws configure``` and providing your AWS access key and secret key.
 37 | 
 38 | ### Step 2: Define Your Website Content
 39 | 
 40 | To prepare static website files (HTML), place them in the directory where your Terraform configuration files are located. Name the main HTML file "index.html," and optionally, you can also include an "error.html" file. If you prefer, you can reference my repository for the static website HTML files.
 41 | 
 42 | ### Step 3: Terraform Configuration File Syntax
 43 | 
 44 | If we want to Create a terraform configuration file we have to use .tf (e.g., main.tf) to define the infrastructure as code using terraform.
 45 | 
 46 | ### Step 4: Define your Configuration Files in your IDE
 47 | ### Define the AWS provider and required resources like S3 buckets, IAM roles, and policies
 48 | 1. Define ```provider.tf``` file using the below code :
 49 | 
 50 | ```
 51 | provider "aws" {
 52 |     region = "ap-south-1"
 53 | }
 54 | ```
 55 | 2. In your Integrated Development Environment (IDE), open the terminal and navigate to the directory where you have created these configuration files.
 56 | 3. After navigating to the directory where your configuration files are located in your IDE's terminal, you can run the following command to initialize Terraform and prepare it for use with AWS:
 57 | 
 58 | ```shell
 59 | terraform init
 60 | ```
 61 | 
 62 | Running `terraform init` will install the necessary plugins and modules required for connecting to AWS and managing your infrastructure.<br>
 63 | 4. And then define __resource.tf__ file for creating bucket by using the below code :
 64 | 
 65 | ```
 66 | resource "aws_s3_bucket" "bucket1" {
 67 |     bucket = "web-bucket-mathesh"
 68 |   
 69 | }
 70 | ```
 71 | 5. Then below command for creating the bucket :
 72 | 
 73 | ```
 74 | terraform apply -auto-approve
 75 | ```
 76 | 6. And then add the below codes in __resource.tf__ file :
 77 | ```
 78 | resource "aws_s3_bucket_public_access_block" "bucket1" {
 79 |   bucket = aws_s3_bucket.bucket1.id
 80 | 
 81 |   block_public_acls       = false
 82 |   block_public_policy     = false
 83 |   ignore_public_acls      = false
 84 |   restrict_public_buckets = false
 85 | }
 86 | 
 87 | resource "aws_s3_object" "index" {
 88 |   bucket = "web-bucket-mathesh"
 89 |   key    = "index.html"
 90 |   source = "index.html"
 91 |   content_type = "text/html"
 92 | }
 93 | 
 94 | resource "aws_s3_object" "error" {
 95 |   bucket = "web-bucket-mathesh"
 96 |   key    = "error.html"
 97 |   source = "error.html"
 98 |   content_type = "text/html"
 99 | }
100 | 
101 | 
102 | resource "aws_s3_bucket_website_configuration" "bucket1" {
103 |   bucket = aws_s3_bucket.bucket1.id
104 | 
105 |   index_document {
106 |     suffix = "index.html"
107 |   }
108 | 
109 |   error_document {
110 |     key = "error.html"
111 |   }
112 | 
113 | }
114 | 
115 | resource "aws_s3_bucket_policy" "public_read_access" {
116 |   bucket = aws_s3_bucket.bucket1.id
117 |   policy = <<EOF
118 | {
119 |   "Version": "2012-10-17",
120 |   "Statement": [
121 |     {
122 |       "Effect": "Allow",
123 | 	  "Principal": "*",
124 |       "Action": [ "s3:GetObject" ],
125 |       "Resource": [
126 |         "${aws_s3_bucket.bucket1.arn}",
127 |         "${aws_s3_bucket.bucket1.arn}/*"
128 |       ]
129 |     }
130 |   ]
131 | }
132 | EOF
133 | }
134 | ```
135 | 
136 | 7. And then again run the command :
137 | 
138 | ```
139 | terraform applyb -auto-approve
140 | ```
141 | 8. The code above will apply the necessary configurations for features such as static website hosting, bucket policies, and blocking public access to your bucket.
142 | 9. Certainly, it's important to customize the code to your specific needs. Please remember to change the bucket name, region, and configurations as per your requirements when using the code from the Terraform documentation.
143 | 
144 | ### Step 5: Define the Output file
145 | 
146 | 1. We use an output file to obtain your website link in your IDE, eliminating the need to access the link through the AWS Console.
147 | 2. Define __output.tf__ file by using the below terraform code :
148 | ```
149 | output "websiteendpoint" {
150 |     value = aws_s3_bucket.bucket1.website_endpoint
151 |   
152 | }
153 | ```
154 | 3. And then run the following command :
155 | 
156 | ```
157 | terraform apply -auto-approve
158 | ```
159 | 4. It will give your website link as output as shown below
160 | 
161 | ![s3](https://github.com/mathesh-me/static-website-host-1/assets/144098846/90551cc8-ed1e-45c3-91b1-ffcce24666e1)
162 | 
163 | ### Step 6: Verify the Output 
164 | 
165 | Copy the link and paste it in your favourite browser.
166 | 
167 | ![s4](https://github.com/mathesh-me/static-website-host-1/assets/144098846/f1908092-afeb-427b-a129-cc291275f4ae)
168 | 
169 | 
170 | 
171 | 


--------------------------------------------------------------------------------
/Static Webiste Hosting Using Terraform/error.html:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html lang="en">
 3 | <head>
 4 |     <meta charset="UTF-8">
 5 |     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 6 |     <title>Error - Best Books for Cloud and DevOps</title>
 7 |     <style>
 8 |         body {
 9 |             font-family: Arial, sans-serif;
10 |             background-color: #f0f0f0;
11 |             margin: 0;
12 |             padding: 0;
13 |         }
14 | 
15 |         header {
16 |             background-color: #ff4c4c; /* Red color for error */
17 |             color: #fff;
18 |             text-align: center;
19 |             padding: 20px;
20 |         }
21 | 
22 |         h1 {
23 |             font-size: 36px;
24 |         }
25 | 
26 |         main {
27 |             max-width: 800px;
28 |             margin: 20px auto;
29 |             padding: 20px;
30 |             background-color: #fff;
31 |             box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
32 |             border-radius: 5px;
33 |         }
34 | 
35 |         p {
36 |             font-size: 16px;
37 |         }
38 | 
39 |         a {
40 |             color: #007BFF;
41 |             text-decoration: none;
42 |         }
43 | 
44 |         a:hover {
45 |             text-decoration: underline;
46 |         }
47 |     </style>
48 | </head>
49 | <body>
50 |     <header>
51 |         <h1>Error - Best Books for Cloud and DevOps</h1>
52 |     </header>
53 |     <main>
54 |         <p>Oops! Something went wrong. We apologize for the inconvenience.</p>
55 |         <p>Please <a href="index.html">return to the homepage</a> and try again.</p>
56 |     </main>
57 | </body>
58 | </html>
59 | 


--------------------------------------------------------------------------------
/Static Webiste Hosting Using Terraform/index.html:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html lang="en">
 3 | <head>
 4 |     <meta charset="UTF-8">
 5 |     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 6 |     <title>Best Books for Cloud and DevOps</title>
 7 |     <style>
 8 |         body {
 9 |             font-family: Arial, sans-serif;
10 |             background-color: #f0f0f0;
11 |             margin: 0;
12 |             padding: 0;
13 |         }
14 | 
15 |         header {
16 |             background-color: #007BFF;
17 |             color: #fff;
18 |             text-align: center;
19 |             padding: 20px;
20 |         }
21 | 
22 |         h1 {
23 |             font-size: 36px;
24 |         }
25 | 
26 |         main {
27 |             max-width: 800px;
28 |             margin: 20px auto;
29 |             padding: 20px;
30 |             background-color: #fff;
31 |             box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
32 |             border-radius: 5px;
33 |         }
34 | 
35 |         .book {
36 |             margin-bottom: 20px;
37 |             padding: 20px;
38 |             background-color: #f9f9f9;
39 |             border: 1px solid #ddd;
40 |             border-radius: 5px;
41 |             transition: transform 0.2s ease-in-out;
42 |         }
43 | 
44 |         .book:hover {
45 |             transform: scale(1.03);
46 |         }
47 | 
48 |         h2 {
49 |             font-size: 24px;
50 |             margin-bottom: 10px;
51 |         }
52 | 
53 |         p {
54 |             font-size: 16px;
55 |         }
56 | 
57 |         a {
58 |             color: #007BFF;
59 |             text-decoration: none;
60 |         }
61 | 
62 |         a:hover {
63 |             text-decoration: underline;
64 |         }
65 |     </style>
66 | </head>
67 | <body>
68 |     <header>
69 |         <h1>Best Books for Cloud and DevOps</h1>
70 |     </header>
71 |     <main>
72 |         <div class="book">
73 |             <h2>The DevOps Handbook</h2>
74 |             <p><b>Authors: Gene Kim, Jez Humble, Patrick Debois, John Allspaw and John Willis</b></br>
75 | 
76 |                 The DevOps Handbook: How to Create World-Class Agility, Reliability and Security in Technology Organizations book is considered as the DevOps bible by many readers. The authors talk about the importance of implementing DevOps into any organization and how it helps to gain a competitive advantage from the rest. It also talks about the core benefits of DevOps and practical applications of how to adopt DevOps. There are a number of case studies on companies that have done it successfully and how you can implement them into your own organization.</p>
77 |             <a href="https://www.amazon.com/DevOps-Handbook-World-Class-Reliability-Organizations/dp/1942788002">Buy the Book</a>
78 |         </div>
79 |         
80 |         <div class="book">
81 |             <h2>The Phoenix Project</h2>
82 |             <p><b>Authors: Gene Kim</b></br>
83 | 
84 |                 The Phoenix Project book explains the concept of DevOps using a fictional company and fictional employees. The story revolves around Bill, a VP at Parts Unlimited, who has been assigned to fix all of the company’s problems. The company is in a fix and nothing works, including their payment system. Bill starts to identify all of these issues and implement solutions for them. We see throughout the book that these solutions are in fact, DevOps practices. It is an excellent way to understand complex DevOps subject matters in a fun way.</p>
85 |             <a href="https://www.amazon.com/Phoenix-Project-DevOps-Helping-Business/dp/1942788290">Buy the Book</a>
86 |         </div>
87 |         
88 |         <div class="book">
89 |             <h2>The Unicorn Project</h2>
90 |             <p><b>Authors: Gene Kim</br>
91 | 
92 |                 The Unicorn Project: A Novel about Developers, Digital Disruption, and Thriving in the Age of Data book is like a sequel to the Phoenix Project book, but with a different point of view. This time, the main protagonist is Maxine, a developer in the Phoenix Project team. She finds a mentor in Erick who guides her with the five ideals of problem-solving in DevOps.</p>
93 |             <a href="https://www.amazon.in/Unicorn-Project-Developers-Disruption-Thriving-ebook/dp/B07QT9QR41">Buy the Book</a>
94 |         </div>
95 | 
96 |     </main>
97 | </body>
98 | </html>
99 | 


--------------------------------------------------------------------------------
/Static Webiste Hosting Using Terraform/output.tf:
--------------------------------------------------------------------------------
1 | output "websiteendpoint" {
2 |     value = aws_s3_bucket.bucket1.website_endpoint
3 |   
4 | }


--------------------------------------------------------------------------------
/Static Webiste Hosting Using Terraform/provider.tf:
--------------------------------------------------------------------------------
1 | provider "aws" {
2 |     region = "ap-south-1"
3 | }


--------------------------------------------------------------------------------
/Static Webiste Hosting Using Terraform/resource.tf:
--------------------------------------------------------------------------------
 1 | resource "aws_s3_bucket" "bucket1" {
 2 |     bucket = "web-bucket-mathesh"
 3 |   
 4 | }
 5 | resource "aws_s3_bucket_public_access_block" "bucket1" {
 6 |   bucket = aws_s3_bucket.bucket1.id
 7 | 
 8 |   block_public_acls       = false
 9 |   block_public_policy     = false
10 |   ignore_public_acls      = false
11 |   restrict_public_buckets = false
12 | }
13 | 
14 | resource "aws_s3_object" "index" {
15 |   bucket = "web-bucket-mathesh"
16 |   key    = "index.html"
17 |   source = "index.html"
18 |   content_type = "text/html"
19 | }
20 | 
21 | resource "aws_s3_object" "error" {
22 |   bucket = "web-bucket-mathesh"
23 |   key    = "error.html"
24 |   source = "error.html"
25 |   content_type = "text/html"
26 | }
27 | 
28 | 
29 | resource "aws_s3_bucket_website_configuration" "bucket1" {
30 |   bucket = aws_s3_bucket.bucket1.id
31 | 
32 |   index_document {
33 |     suffix = "index.html"
34 |   }
35 | 
36 |   error_document {
37 |     key = "error.html"
38 |   }
39 | 
40 | }
41 | 
42 | resource "aws_s3_bucket_policy" "public_read_access" {
43 |   bucket = aws_s3_bucket.bucket1.id
44 |   policy = <<EOF
45 | {
46 |   "Version": "2012-10-17",
47 |   "Statement": [
48 |     {
49 |       "Effect": "Allow",
50 | 	  "Principal": "*",
51 |       "Action": [ "s3:GetObject" ],
52 |       "Resource": [
53 |         "${aws_s3_bucket.bucket1.arn}",
54 |         "${aws_s3_bucket.bucket1.arn}/*"
55 |       ]
56 |     }
57 |   ]
58 | }
59 | EOF
60 | }


--------------------------------------------------------------------------------