I’m sure many of us have experienced it while using a website that when we load a website it takes some time to load the whole content but after visiting it one time if we again load it loads faster , it is very common in websites with much data like YOUTUBE, AMAZON etc. So you may have wondered why ? Don’t worry today i’ll be explaining you the reason for difference of those 5 seconds.

So the reason behind is that the website which we are using has its data in some location in the world so when we load the site first time the data travels from that location to a data center near us(either of same website or of company from which website is taking service),gets stored in it and then reach to us which takes some time but when we load it again the data which travelled first time is already stored in nearby data center so it reaches us faster. This is called CDN (content delivery network)

AWS provides this CDN as a service through CloudFront.

Now we are going to see it practically , so i’m going to do following steps for this :

  • Create a EC2 instance and configure webserver in it
  • Add a volume to it and attach it to its /var/www/html directory
  • Create a S3 bucket and put some object in it
  • Create a cloudfront and use its origin as S3 bucket
  • Create a website
  • Use this s3 object through cloudfront in our website

> Create a ec2 instance

If you dont know how to create EC2 instance using AWS-CLI visit my previous blog :


> Create a s3 bucket

to create s3 bucket we use command :

aws s3 mb s3://bucket_name

Check it in AWS console :

> Put a data as object in S3 bucket

to put a data as object we use command :

aws a3 sync data_local_path s3://bucket_name — include data

check it in AWS console :

now s3 gives us a url of this object to use anywhere :

as we can see when we try to accesss this url it gives error, that’s because this object is not allowed for public read so we add a extra term while uploading this object to make it public :

aws s3 sync data_local_path s3://bucket_name — include data — acl public-read

now we can see our object using url :

> Create a cloudfront distribution

to create aws cloudfront distribution we use command :

aws cloudfront create-distribution — origin-domain -name bucket_name.s3.amazonaws.com

check it in aws console :

now this distribution will provide us a url for our object which when used will store this object in local data-centre(edges) near location from which it is accessed.

> Create a volume

to check how to create a volume visit :


now attach it to our ec2 instance :

> Open ec2 instanse

Now we are going to use our ec2 instance for which i’m going to use a software called putty. You can also use “connect” option to use instance from AWS console.

you can download putty from here : https://www.putty.org/

now we install webserver in our instance. i’ve used httpd websever from Apache , you can use any other webserver.

To install webserver services we use following commands :

yum install httpd

systemctl enable httpd

now after starting web-server we create a partition in the attached volume :

now we format it :

then we mount it our web_pages directory :

mount <device> /var/www/html

> Create a website in which we use our cloudfront object url

we go inside our /var/www/html directory and create a web page to be accesssed through httpd server

now when we access this site, cloudfront which already put this object in all the data-centers(edges) show us image much faster that normal

That’s it.

Thank you.




Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store