🚀 Optimizing Web App Performance with AWS CloudFront, New Relic Monitoring, and Terraform Deployment
Published: 2023-11-02 21:55:05

 
🚀 Introduction

In today's rapidly evolving digital landscape, deploying web applications efficiently and ensuring optimal performance is essential for delivering a seamless user experience. This project aims to address these critical aspects by leveraging Infrastructure as Code (IAC) through Terraform, harnessing the content delivery power of AWS CloudFront, and implementing robust monitoring using New Relic.

🎯 Objective

The objective of this post is to bring and spread a knowledge about #aws cloud services, how to ? and where to consume the #aws services to solve the real world business challenges                                                                            
	
🚀 Use Case:

Manual Deployment
Terraform (IaC) Deployment
New Relic Integration

This project aims to address these critical aspects by leveraging Infrastructure as Code (IAC) through Terraform, harnessing the content delivery power of AWS CloudFront, and implementing robust monitoring using New Relic.

Automated deployment of web applications is at the heart of this initiative, as it not only streamlines the provisioning of cloud infrastructure but also lays the foundation for future scalability across multiple cloud platforms, free from vendor lock-in constraints. By utilizing Terraform, a cloud-agnostic open-source tool, we ensure that our infrastructure can adapt to evolving requirements seamlessly.

The project also emphasizes the acceleration of web application performance through AWS CloudFront, a content delivery network (CDN) service. By strategically caching content at edge locations around the world, CloudFront enhances the user experience, minimizing latency and ensuring swift content delivery.   

To maintain a vigilant eye on the performance and health of our web application, we integrate New Relic monitoring. This comprehensive tool provides us with invaluable insights into infrastructure visibility and response monitoring. With the aid of AWS Lambda functions, we securely send logs from our AWS S3 bucket to New Relic for real-time analysis.

This project not only underscores the importance of automated deployment and performance optimization but also provides a detailed, step-by-step guide for implementing these solutions. Whether you're new to these technologies or a seasoned professional, this project equips you with the knowledge and tools to harness the full potential of Terraform, CloudFront, and New Relic for your web applications.

🛠️ Solution Diagram:

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fzov23tyjy1632cpuiqq.png)

The web application should deploy with the following criteria’s & requirements:

1. **Requirement 1:**
   - The web application should be deployed within the AWS Cloud platform.

2. **Requirement 2:**
   - The web application should be accessed securely.

3. **Requirement 3:**
   - The viewer’s experience should be seamless without any delays while accessing the web content and pages.

4. **Requirement 4:**
   - The web application should be accessible from around the world with a custom domain: www.prafect.link.

5. **Requirement 5:**
   - The web application logs should be stored in object storage and then sent to third-party monitoring solutions.

6. **Requirement 6:**
   - The web application should be deployed in an automated way without any vendor locking tools.


**Solution:**
Let’s discuss and analyze the solution for the above requirements:

1. **Solution 1: AWS S3**
   - From the AWS Cloud platform, there is a service called S3, which provides a service to deploy a static web application.

2. **Solution 2: AWS ACM**
   - AWS ACM is the solution that provides a wildcard certificate through which the web application can be secured with SSL/TLS communication.

3. **Solution 3: AWS Cloudfront**
   - AWS Cloudfront is the content delivery network service through which the web app content will be cached on edge locations nearby the viewers' proximity to improve the user's experience.

4. **Solution 4: AWS Route 53**
   - AWS Route 53 provides a DNS service through which the web application can have its own custom domain: www.prafect.link.

5. **Solution 5: AWS S3**
   - AWS S3 provides a service to store the logs and push the logs to an external monitoring tool. New Relic can be used, where S3 logs will be pushed to New Relic using a Lambda function.

6. **Solution 6: Terraform**
   - Terraform is the solution to provision the resources and infrastructure in an Infrastructure as Code (IAC) way. It's a cloud-agnostic open-source tool that can further scale up based on the requirements for multi-cloud.


**Project Cost Estimation:**
(Note: This cost is not any actual cost; it's just an estimation based on high-level requirements. Prices may vary based on adding and removing services based on requirements.)
Ref: [AWS Pricing Calculator](https://calculator.aws/#/addService)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/u8pql5bnrzpjao3vo6c7.png)

[Host a Static Website on AWS: Services Costs](https://aws.amazon.com/getting-started/projects/host-static-website/services-costs/)

**Tools & Technologies Covered:**

- AWS Cloud
- AWS S3
- AWS Certificate Manager
- AWS Cloudfront
- AWS Route 53
- AWS Lambda
- AWS CloudWatch
- New Relic (Monitoring)
- Terraform (Infrastructure as Code)
- Visual Studio Code (IDE)
- GitHub

Ref: AWS Services Documentation:
AWS S3: https://docs.aws.amazon.com/AmazonS3/latest/userguide/access-bucket-intro.html
AWS Cloudfront:
https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/GettingStarted.SimpleDistribution.html

**Pre-requisite:**
1. AWS Free Tier Account
2. AWS IAM User created with programmatic access
3. AWS Route53 hosted domain
4. Visual Studio Code configured
5. Latest Terraform version installed
6. GitHub Account
7. Gitbash installed on desktop
8. New Relic account set up
9. Web application source code ready

**AGENDA:**
To achieve the goal of explaining the user how to configure each and every service within the console to make them familiar with the ins and outs of all service components, and then to present the automated way in which the entire web application resources are provisioned within a few minutes using Terraform (IaC).

a. Manual way web application configuration and optimizing web speed to accelerate web performance.

b. Automated way using Terraform to deploy the complete web application.

-----


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/397o0tghk37fg8r4u07s.png)

**MANUAL DEPLOYMENT**

**1. Set up Web Application:**
   - Step 1: Register a Custom Domain with Route 53
   - Step 2: Create Two Buckets
   - Step 3: Configure Your Root Domain Bucket for Website Hosting
   - Step 4: Configure Your Subdomain Bucket for Website Redirect
   - Step 5: Configure Logging for Website Traffic
   - Step 6: Upload Index and Website Content
   - Step 7: Upload an Error Document
   - Step 8: Edit S3 Block Public Access Settings
   - Step 9: Attach a Bucket Policy
   - Step 10: Test Your Domain Endpoint
   - Step 11: Add Alias Records for Your Domain and Subdomain
   - Step 12: Test the Website

**2. Perform Latency Test without Cloudfront:**
   - a. Test from Canada
   - b. Test from London
   - c. Test from Singapore

**3. Configure Certificate Manager to Make the Website Secure:**
   - a. Request a Certificate
   - b. Validate - Add CNAME Records to Route53
   - c. Redirection Bucket – Change the Request Server from HTTP to HTTPS

**4. Accelerate Web Performance Using Cloudfront:**
   - a. Create Cloudfront Distribution
   - b. Validate that Cloudfront Domain is Displayed on the Web
   - c. Point Cloudfront Endpoint with Route53 Custom Domain
   - d. Measure the Latency Test with Cloudfront
     - i. Test from Canada
     - ii. Test from London
     - iii. Test from Singapore


** Implementation in Action:**

1.  Set up Web application

Step 1: Register a custom domain with Route 53

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/skzlp3nl09115nibvr0w.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/s5s34isstt4b01qoxhpn.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9e1zmd2bw2wiliy8enbn.png)


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4288m9ure4zg2fb9c2ee.png)

Step 2: Create two buckets

Main bucket: prafect.link
Second bucket: www.prafect.link

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6angcli7wqdjx986sqjx.png)
 
Step 3: Upload index and website content
Step 4: Upload an error document

Go to local terminal
AWS Configure : provide credentials
Go to source code directory: webfiles
aws s3 sync . s3://prafect.link

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/s6c72uaubrcyknagt9n3.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/yzxfm5opxybig3gt6epp.png)
 
Step 5: Configure your root domain bucket for website hosting
Enable Static web 
 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/cp6tdwo0lww6lwl8t3g7.png)

Step 6: Configure your subdomain bucket for website redirect
Bucket redirection: www.prafect.link 
 
 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/esyu1gghoqt9idqu54ov.png)


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ob87mqjjllmsywo0fxj6.png)


Step 7: Edit S3 Block Public Access settings
Buck Policy:
 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/lddwftfkwioiq9vd0ue2.png)

Step 9: Test your domain endpoint

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fkg1nh6ekvoq3locwu3m.png)
 
Verify that “index.html” is displayed the web page
Access web page using endpoint
S3 web endpoint
URL : http://prafect.link.s3-website-us-east-1.amazonaws.com
index.html
 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9gwlp6lvppmnl9ir815e.png)


Verify that “error.html” is displayed the error page
Access “error.html”
 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/w8dmhujmk4avec7cvdfj.png)


Step 10: Add alias records for your domain and subdomain
Add Custom domain with Route53
Verify that hosted zone exist
 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/n2p3lsmpygxse7e9c896.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sh4e02xrb0mfvgd2iaqo.png)



 

Create A record to add custom domain to web application
Prafect.link 
Point out alias to AWS S3 website Endpoint
 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vrullpszlpxsevg16iak.png)


Create second alias for www.prafect.link

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/j4m1bq72f0lwavfkejbl.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fk97g0nvqrmu9zrpn3ly.png)


Step 11: Test the website
Access the web application using custom domain
www.prafect.link

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/086l4yooyucnegmyk8m3.png)

2.	Perform Latency test without Cloudfront
a.	Test from Canada
b.	Test from London
c.	Test from Singapore

 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sk77hx9rglyivcnb6ufv.png)


Measure the performance of the web application
Certainly, here is the performance measurement presented in a table format:

| Origin     | Region    | Page         | DNS (ms) | Connection (ms) | Response (ms) |
|------------|-----------|--------------|----------|------------------|---------------|
| Canada     | US-east-1 | Home Page    | 189.39   | 102.67           |               |
|            |           | Contact Us   | 48.25    | 154.24           |               |
|            |           | Portfolio     | 49.70    | 123.31           |               |
| London     |           | Home Page    |          |                  | 322.29        |
|            |           | Contact Us   |          |                  | 347.94        |
|            |           | Portfolio     |          |                  | 533.79        |
| Singapore  |           | Home Page    |          |                  | 789.50        |
|            |           | Contact Us   |          |                  | 762.48        |
|            |           | Portfolio     |          |                  | 792.65        |


Validate response header that it is coming from Amazon S3
 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ox4tzcy1mws83ek523h9.png)


Test 1: Access from Canada
Home Page
 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/kjjmw2mxxnzqso1xwm8i.png)

About US

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/o249y3h2onr85pk9g738.png)

Portfolio
 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/aq7ffwkwvgnpv1bv0i6o.png)


Switch the location using VPN other than Canada to test the latency


Country : London

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hvzebxi2won93d1v7r3i.png)

HomePage
 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mk17qcjhmj0hihjjlxp2.png)
Contact Us

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vnvzxbl50dz2qlmpwqjy.png)
 
Portfolio
 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7n1q07om1xgj11tkjrgj.png)

Country: Singapore
HomePage
 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ejjnixrwh3286p6c292g.png)

About Us
 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/s8icbbrp5hiyept3zbh5.png)

Portfolio
 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/idns71hpqzslb7zbug17.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/r92sppq95n0myc91i73d.png)

3.Configure the Certificate Manager
How to secure Web application? 
	1.Request a certificate
Certificate Manager
SSL Certificate
Request certificate

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/94i58wrgd0ktoqyriue3.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/56b1mdvb94nvx2zzlr5s.png)
 
Status: Pending Validation

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qo5ugivse6t3ccdsv4vx.png)
 
2.Create records in Route53

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/e7ip7q24w3swyidc8fsn.png)
 
3.Go to Route53 and validate that two CNAME records created

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/grzv9yb21s4oj8yw7jx5.png)
 
SSL certificate issued successfully
 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jcs41jstv2rr6z5p501l.png)


Verify that web application is access using secure https
http://www.prafect.link : not secure
 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jqprrdceut2tueabjzbs.png)


4. Do one change on redirection bucket and redirect to “https”
Change from “http” to “https”
 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gu5i1jpngo1kl299yskz.png)


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d5didrtllsnxccmn99it.png)

  
5.Accelerate the web performance using Cloudfront

a. Create cloudfront distribution
b. Validate that cloudfront domain is displayed on the web
c. Point the cloudfront endpoint with the Route53 custom domain
d. Measure the Latency test with Cloudfront
i. Test from Canada
ii. Test from London
iii. Test from Singapore
 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0q845k032f1u1f7gwodq.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/leqzw0oxxfe8kla5wqq1.png)
 
Create Cloudfront distribution
Origin domain: Provide AWS S3 web endpoint:
http://prafect.link.s3-website-us-east-1.amazonaws.com
 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/iwc5kqvmq1rrhanq76i7.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/h7ewcfetqrdbouy8nnsr.png)

Use only North America and Europe
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/smmu9fl5ud2w85d7rnf4.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/yt0me0dyru15obaf5so0.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/q8ffmpoiqmb19ppr4rge.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rm8e7bo3zlskgvms7gw2.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ui1zkpcb678gcgr7nfx3.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/x7ngwh7ggzm46pan5v75.png)


Cloudfront deployment in progress

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/flkqv72sl1t4dno0axzc.png)
 
Cloudfront deployed

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/91vt86zwl2gg80dij0bg.png)
 
Custom origin

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mmoqeye57cjkgqfrmop9.png)

Validate that cloudfront domain is correctly deployed
 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9jxrp4wwmzrselp2n91p.png)

Access web application using cloudfront url
URL: https://d3hffwkpocdftx.cloudfront.net
 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/s5zq5f1pxpyyqt4ticu0.png)

## Security Checkpoint:
How to Secure AWS S3 web end point and restrict to access the web application allowing access through only Cloudfront web endpoint ?

Go to S3 Bucket policy
Go to Origin
Edit Origin
 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/quwgysbq720lgtpux97r.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5dcoyxzrwu6ew6k8up0d.png)
 
Replace this Bucket policy with cloudfront policy
{
	"Version": "2012-10-17",
	"Statement": [
		{
			"Sid": "PublicReadGetObject",
			"Effect": "Allow",
			"Principal": "*",
			"Action": "s3:GetObject",
			"Resource": "arn:aws:s3:::prafect.link/*"
		}
	]
}

{
        "Version": "2008-10-17",
        "Id": "PolicyForCloudFrontPrivateContent",
        "Statement": [
            {
                "Sid": "AllowCloudFrontServicePrincipal",
                "Effect": "Allow",
                "Principal": {
                    "Service": "cloudfront.amazonaws.com"
                },
                "Action": "s3:GetObject",
                "Resource": "arn:aws:s3:::prafect.link/*",
                "Condition": {
                    "StringEquals": {
                      "AWS:SourceArn": "arn:aws:cloudfront::914141388779:distribution/EU0BLI2K9XWK3"
                    }
                }
            }
        ]
      }

Restrict to access from S3 web endpoint and allow only from cloudfront distribution endpoint

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rkkldymlvuke4gon0c45.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ej3jlzthy4mgt3e4kv91.png)

 
Access Web url:
Expected: it should block the request using S3 endpoint : PASSED
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jfph3qcyqtzuyabee72e.png) 

Only allowed using cloudfront endpoint
  

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/795qhumzl1iw685r5av7.png)


Point out Cloudfront URL to Route53

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9m4erdmgglv1ioqq7iaz.png)
 
Replace the s3 web endpoint with cloudfront endpoint
Delete the record sets

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9z9zr2xo5lzatt6qwycx.png)

 
Create New record set for Prafect.link
Routing Policy: Simple Routing
 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/61xcerzuc5un0v55i6y3.png)

Create New record set for www.Prafect.link

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3udtlbp7q8mgodpzamit.png)
 
Record sets created successfully

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/dx6vf7hznct3wh05xa4i.png)

Measure the performance of the web application
Perform Latency test 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/g9jc9oxm9i07lwsk7itw.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6p4r1uxy9cgv7pk8ipyl.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mljn1snj37ao8n59f99h.png)


| Origin    | Region    | Cloudfront    | Page         | DNS      | Connection   | SSL      | Response    |
|-----------|-----------|---------------|--------------|----------|--------------|----------|-------------|
|           |           |               |              |          |              |          |             |
|           | Canada    | No Cloudfront | Home Page    | 189.39 ms| 102.67 ms    |          |             |
|           |           | With Cloudfront| Home Page    | 1.06 ms  | 22.08 ms     |          |             |
|           |           | No Cloudfront | Contact Us   | 48.25 ms | 25.33 ms     | 22.59 ms |             |
|           |           | With Cloudfront| Contact Us   | 46.67 ms |              |          |             |
|           |           | No Cloudfront | Portfolio     | 49.70 ms | 123.31 ms    |          |             |
|           |           | With Cloudfront| Portfolio     | 65.42 ms | 25.43 ms     | 25.43 ms | 23.75 ms    |
|           |           |               |              |          |              |          |             |
|           | London    | No Cloudfront | Home Page    |          | 322.29 ms    |          |             |
|           |           | With Cloudfront| Home Page    | 121.18 ms| 121.18 ms    | 121.18 ms| 252.88 ms    |
|           |           | No Cloudfront | Contact Us   |          | 347.94 ms    |          |             |
|           |           | With Cloudfront| Contact Us   | 122.69 ms| 122.69 ms    | 125.31 ms|             |
|           |           | No Cloudfront | Portfolio     |          | 533.79 ms    |          |             |
|           |           | With Cloudfront| Portfolio     | 120.55 ms| 120.55 ms    | 119.54 ms|             |
|           |           |               |              |          |              |          |             |
|           | Singapore | No Cloudfront | Home Page    |          | 789.50 ms    |          |             |
|           |           | With Cloudfront| Home Page    | 375.48 ms| 375.48 ms    | 409.51 ms|             |
|           |           | No Cloudfront | Contact Us   |          | 762.48 ms    |          |             |
|           |           | With Cloudfront| Contact Us   | 294.09 ms| 388.27 ms    | 390.91 ms|             |
|           |           | No Cloudfront | Portfolio     |          | 792.65 ms    |          |             |
|           |           | With Cloudfront| Portfolio     | 382.05 ms| 382.05 ms    | 378.65 ms|             |



Validate that web application is secure

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/dz9t27dxwqfmssrgydjj.png)

 
Verify Header that the page is coming from cloudfront cache
 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hja0mn9qd9w4cbwsr7ky.png)

Test from Canada
HomePage

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/h4ely3pbilcdhebfm8to.png)

About Us

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pl5bby1hf67sbbsz410a.png)

Test from London
 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nj9jz8m8xy0wp4uhgyxx.png)


Home Page

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/i4u66thgc49onn6tknet.png)

Contact Us

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/kaqbotg98kdyj5bqf49i.png)
 
Portfolio

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6su3czejdrnf7g5iw2vy.png)

Test from Singapore

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ccghstrr0qprnumtsn25.png)
 
Home Page

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nxiva3nhmmccyo1f15dz.png)


Contact Us

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3zpgc9mcki9rdy5556el.png)

 
Portfolio

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ik48k5vhojfy9dg3lun1.png)

 
Optimize the Cloudfront performance 
Point DNS to United Kingdom
Change the Routing Policy: Geolocation
Location: United Kingdom

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ffp5s4uhkdt8h6pyiwom.png)
 
Keep alive time 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/44qw639pbhs7cpd8uupg.png)

Change the timeout to 60 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gbuvc2b2fg0klvbp6tcd.png)

Cloudfront speed increase tips:
Cloudfront – Keep alive time need to increate: 60
DNS TTL time – need to increase: 60
SSL time need to increase

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6fywudc8qzh2o7fkxln1.png)


Cloudwatch
 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qvuv07wcuqk4snlhvs0x.png)


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pg2nuzbz46f6p9fk5ck4.png)

NEW RELIC
----------------------------------------------------------------------------------------------------------------
 INTEGRATION       
------------------------------------------------------------------------------------------------------------------------------------
Objective: The objective is to monitor Cloudfront logs using the external monitoring tool New Relic and integrate it with AWS S3. This will be achieved by implementing comprehensive monitoring through an AWS Lambda function. The Lambda function will be configured to trigger and send Cloudfront logs from an AWS S3 bucket to New Relic, providing infrastructure visibility and response monitoring.

Technology & Tools: New Relic, AWS S3, AWS Lambda

-------------------------------------------------------------------------------------------------------------------------------------
New relic

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2mp9whuq83t9y0kkv9sb.png)


  
Select AWS

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fbqvrr3rk1pmp16dajje.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5qv9kiqfg08ngejldmik.png)
 
Standard logs
https://docs.newrelic.com/docs/logs/forward-logs/cloudfront-web-logs/#enable-standard-logging



Create logs bucket in S3

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hp3uoulhdnqbkgwn8yph.png)

 
Enable standard logging
Go to Cloudfront Enable standard logging

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/biprl2io4mmvfkpvcp1j.png)


 
Go to this link: https://serverlessrepo.aws.amazon.com/applications
Search: newrelic

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/aex9mwb164xzd19gs1sv.png)
 

Click :Deploy

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xrlm77u91kjxd1t34vxz.png)

 
1.Scroll to the Application settings and enter your New Relic license key.
 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2mojmv79r6avqr8ecmr8.png)

Logtype: built in parsing rulesets : https://docs.newrelic.com/docs/logs/ui-data/built-log-parsing-rules/
Deployment in progress

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2ggu5ch4c8vwzjp4l978.png)
 
Lambda deployment complete

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/60nwo99vswcctjp85bl8.png)

 
Create Lambda trigger

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/br155vgzumpfj2rvkm35.png)
 
Add Trigger

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/j3vavf9wp8jmunk8yutr.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bzwjp24s1tloa8nz0r5p.png)

 
Trigger added successfully

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/96dga69gmi8jusgqpy3x.png)

 

Go back to newrelic
If configure correct it will look like this 
 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/v2iv3qnzxhf0l2hz0x9a.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/phupwegtucfgv2yp785q.png)

View logs

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8dwd80pvc44akgnoodl3.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zzbirji0ihc0eplhcznq.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7jr3y1feimyqat5ky0dm.png)


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/spdl1pc8z6ipe7cb9icg.png)

Objective: Automating Web Application Performance Enhancement

Objective: The objective is to automate the provisioning of services and configure CloudFront to improve the performance of a web application.

Technology & Tools: AWS S3, Terraform, CloudFront


Terraform
Terraform project source: 
GitHub: https://github.com/prafulpatel16/terraform-aws-tests.git
Project directory: gocloud-test/10-tf-static-web-complete/

WHAT IS TERRAFORM ?

HashiCorp Terraform is an infrastructure as code tool that lets you define both cloud and on-prem resources in human-readable configuration files that you can version, reuse, and share. You can then use a consistent workflow to provision and manage all of your infrastructure throughout its lifecycle. Terraform can manage low-level components like compute, storage, and networking resources, as well as high-level components like DNS entries and SaaS features.

How does Terraform work?

HashiCorp and the Terraform community have already written thousands of providers to manage many different types of resources and services. You can find all publicly available providers on the Terraform Registry, including Amazon Web Services (AWS), Azure, Google Cloud Platform (GCP), Kubernetes, Helm, GitHub, Splunk, DataDog, and many more.

The core Terraform workflow consists of three stages:
 

Definition: You define resources, which may span multiple cloud providers and services. For example, you might create a configuration to deploy an application on virtual machines in a Virtual Private Cloud (VPC) network with security groups and a load balancer.

Planning: Terraform creates an execution plan describing the infrastructure it will create, update, or destroy based on the existing infrastructure and your configuration.

Application: On approval, Terraform performs the proposed operations in the correct order, respecting any resource dependencies. For example, if you update the properties of a VPC and change the number of virtual machines in that VPC, Terraform will recreate the VPC before scaling the virtual machines.


**Implementation Phase:**

**Phase 1: AWS Cloud Configuration via Terminal**
1. Go to GitBash terminal and execute the command "aws configure."
2. Provide the IAM user's secret key and secret access key.
3. Set the AWS region to "us-east-1."
4. Specify the output type as "json."

**Phase 2: Create Terraform Project and Define Terraform Files and Folders**
1. Open Visual Studio Code (VS Code) and create a new folder named "tf-static-web."
2. Organize the file structure for the Terraform project:
   a. Create a new file "01-providers.tf."
   b. Create a new file "02-main.tf."
   c. Create a new file "03-variables.tf."
   d. Create a new file "04-outputs.tf."
   e. Create a new file "terraform.tfvars."
   f. Create a folder for the web application source code, named "webfiles," and upload the web application files into it.
3. Save all the created files within VS Code.

**Phase 3: Configure and Write Terraform Resources into Respective Files**
1. Open the "01-providers.tf" file and define the Terraform and provider blocks.
2. Open the "02-main.tf" file and write all the necessary S3 resources.
3. Open the "03-variables.tf" file and define the variables for dynamic access.
4. Open the "04-outputs.tf" file and specify the required outputs.
5. Open the "terraform.tfvars" file and configure variables for dynamic access that will override default variable values.

**Phase 4: Terraform fmt, Terraform validate, Terraform plan**
1. Go to the Git Bash terminal and execute the following Terraform commands:
2. Run "terraform init."
3. Execute "terraform fmt."
4. Validate the configuration with "terraform validate."
5. Apply the configuration with "terraform apply."
6. Observe that the "terraform.tfstate" is stored locally.

**Phase 5: Verify that Resources Are Created in AWS Cloud**
1. Access the AWS S3 console and confirm that the bucket has been created.
2. Verify that the web files have been uploaded to the bucket.
3. Confirm that the necessary permissions have been configured.
4. Ensure that the web endpoint has been created.

**Phase 6: Verify that the Web Application Is Accessible Successfully**
1. In the terminal, examine the output values.
2. Copy the endpoint URL and access it from a web browser.
3. Confirm that the "index.html" displays the web page.
4. Validate that the "error.html" is displayed as the error page.

AWS Configuration:

Go to terminal and type 
$aws configure 
 


Terraform file structure:
 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/z1zg4teb2j9n0kffi9li.png)

**Phase 2: Create Terraform Project and Define Terraform Files and Folders**
1. Open Visual Studio Code (VS Code) and create a new folder named "tf-static-web."
2. Organize the file structure for the Terraform project:
   a. Create a new file "01-providers.tf."
   b. Create a new file "02-main.tf."
   c. Create a new file "03-variables.tf."
   d. Create a new file "04-outputs.tf."
   e. Create a new file "terraform.tfvars."
   f. Create a folder for the web application source code, named "webfiles," and upload the web application files into it.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gqqk49ihvsn93qt5gh5g.png)
**Phase 3: Configure and Write Terraform Resources into Respective Files**
1. Open the "01-providers.tf" file and define the Terraform and provider blocks.
2. Open the "02-main.tf" file and write all the necessary S3 resources.
3. Open the "03-variables.tf" file and define the variables for dynamic access.
4. Open the "04-outputs.tf" file and specify the required outputs.
5. Open the "terraform.tfvars" file and configure variables for dynamic access that will override default variable values.
 	

01_Providers.tf 
-	Terraform block
-	Providers block
-	Terraform block
Providers file contains terraform block which includes a “backend” configurations for state file storage and also “required_provisioners” contains a source and version of the terraform provider.

-	Providers block

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/abutqcy0elgsxsrl6m4h.png)

This block contains a cloud providers information about region and profile on which the cloud services needs to be provisioned.

02_main.tf

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/dpr0nui27qv01sna6fay.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/waz6rk6lc6jqcgxpa9uh.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sdpsr8vmbnhgtunarf5y.png)
 
03_variables.tf 


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jtqpd0ksg9h14afx0y7g.png)

04_outputs.tf 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5fqm9fjdfo3erf8arhcu.png)


 
05_terraform.tfvars.tf 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wp4abz9u8zj8a0j9hnso.png)

Webfiles

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4ycavj9saqkr0yyo4px3.png)

AWS configured successfully


 	Phase 4: Terraform fmt, terraform validate, terraform plan
1)	Go to git bash terminal and apply the terraform commands
2)	Terraform init
3)	Terraform fmt
4)	Terraform validate
5)	Terraform apply 
6)	Observe that “terraform.tfstate” is stored locally


Terraform init

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4ziptynmzfj3ge2x9t52.png)


Terraform fmt

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/i3q5ms8fiaxbkvur3ovk.png)

 

Terraform validate

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/prr6vmwde3cp2t3rq24c.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/b2uxq1v4c4raurhmabn1.png)
 

Terraform plan

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3xg9t0ty4jjz26x8s53a.png)

 
 
Terraform apply

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/i51dq48ndo38kvx72lo8.png)


static-web-statefile
Terraform.tfstate

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fkuw6720gqybtf9nad36.png)

 	Phase 5: Verify that resources are created In AWS cloud
1)	Go to AWS S3 and verify that bucket is created
2)	Verify that web files are uploaded into bucket
3)	Verify that permission has been created

Terraform destroy


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/41f7vbakgarrvej6p2vq.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qtdw0obq1zehyu43h0um.png)

4)	Verify that web endpoint is created

 	Phase 6: Verify that web application accessible successfully
1)	Go to terminal and observe the outputs value
2)	Copy the endpoint url and access from web browser
3)	Verify that “index.html” is displayed the web page
4)	Verify that “error.html” is displayed the error page

Terraform destroy
 

**Conclusion:**

This project successfully optimized web application performance with AWS CloudFront, New Relic, and Terraform. We deployed a secure, globally accessible web app using Terraform's infrastructure as code (IAC). By fine-tuning latency, implementing SSL/TLS, and integrating CloudFront, we significantly improved user experience. Leveraging AWS Lambda, we monitored CloudFront logs and pushed data to New Relic, enhancing infrastructure visibility. This project demonstrates the power of cloud-native solutions and monitoring tools in delivering fast, reliable web applications.

  
Congratulations!!!! 🔥🚀

Let's Stay Connected:

1. 🌐 Website: [Visit my Website](https://www.praful.cloud)
2. 💼 LinkedIn: [Connect with me on LinkedIn](https://linkedin.com/in/prafulpatel16)
3. 🐙 GitHub: [Check out my GitHub](https://github.com/prafulpatel16)
4. 🎬 YouTube: [Subscribe to my YouTube Channel](https://www.youtube.com/@prafulpatel16)
5. ✍️ Medium: [Read my articles on Medium](https://medium.com/@prafulpatel16)
6. 📝 Dev.to: [Follow me on Dev.to](https://dev.to/prafulpatel16)

AWS #CloudEngineering #CloudComputing #AmazonWebServices #AWSArchitecture #DevOps #CloudSolutions #CloudSecurity #InfrastructureAsCode #AWSCertification #Serverless #AWSCommunity #TechBlogs #CloudExperts #CloudMigration #CloudOps #AWSJobs #TechIndustry #CareerInTech #InnovationInCloud #devops #cloudengineerjobs #devopsjobs #azure #gcp #oci #cloudjobs, #kubernetes