AWS Builder Center

Builder Center

Global Distribution 🌍 - Making Your Website Accessible Worldwide

Global Distribution 🌍 - Making Your Website Accessible Worldwide

Learn how to make your website fast and accessible for visitors around the world. Solve the problems of distance, speed, and security that every website faces.

Ana Cunha

Developer Advocate @ AWS
Welcome to Day 4 of the AWS Builder Challenge #2  🚀! Today you'll solve a fundamental problem that every website faces: how do you make your site fast for visitors whether they're next door or on the other side of the world?
In about 30 minutes, you'll learn why distance matters on the internet, how to solve the speed problem, and how to keep your files secure while making them globally accessible. We're not just making your site work, we're learning how the internet actually delivers content and why some websites feel instant while others feel slow.
This means understanding why a visitor in Tokyo might have a slow experience accessing files stored in Mexico City, learning how the world's fastest websites solve this problem, and implementing the same solution for your personal website. The goal is to understand the fundamental challenges of global web delivery.
By the end of today, you'll have a website that loads quickly for visitors anywhere in the world. Let's get started!

What you will accomplish today

  • Understand why distance affects website speed
  • Learn how global content delivery works
  • Set up worldwide distribution for you website
  • Keep your storage secure while serving content globally

What you will need

  • AWS account from Day 1  💻
  • S3 bucket from Day 2  📁
  • Website files from Day 3  📝
  • About 30 minutes of your time ⏰

Step 1: The distance problem 🌐

Let's start with a simple question: why do some websites load instantly while others take forever?
The physics of the internet: When someone visits your website, their request travels through cables, fiber optics, and wireless signals to reach your server. Just like driving across town takes longer than walking to your neighbor's house, data traveling from Tokyo to Mexico City takes longer than data traveling within the same city.
Real-world example: Your website files are stored in Mexico City. A visitor in Tokyo, Japan clicks on your site, their request travels ~11,000 kilometers (6,800 miles) to Mexico City. Your server sends the files back ~11,000 kilometers to Tokyo. Total distance: ~22,000 kilometers just to load one webpage!
This problem creates:
  • Slow loading times: Long distances mean delays
  • Unreliable connections: More distance = more things that can go wrong
  • Poor user experience: Visitors leave slow websites

Step 2: How the world's fastest websites solve this 🚀

Major websites like Amazon, Netflix, and Google have solved this problem. Here's their secret:
Bring content closer to users. Instead of storing everything in one location, they copy their content to servers around the world. When someone visits their website, they get content from the nearest server, not from thousands of miles away.
This system has a name: Content Delivery Network (CDN). A CDN is a network of servers distributed globally that work together to deliver content quickly. Think of it like having multiple copies of your store in different cities instead of making everyone drive to one location.
How a CDN works: You upload your website files to one central location (your "origin"), and the CDN automatically copies these files to servers worldwide. When someone visits your website, they get content from the nearest server instead of traveling thousands of miles to your origin. This means your website loads quickly no matter where the visitor is located.
Benefits:
  • Speed: Content comes from nearby servers
  • Reliability: If one server has issues, others can take over
  • Security: Built-in protection against attacks
  • Cost savings: Less load on your main server

Step 3: Set up global distribution for your website 🌍

Now let's implement this solution for your website. AWS provides a CDN service called CloudFront  that we'll use to distribute your content globally.
We'll create a global distribution network for your website and connect it securely to your private storage bucket. Then we'll configure it to serve your content from locations worldwide and test it to make sure everything works properly.
  1. Open the CDN service: In the AWS Console, search for "CloudFront" and click on it
  2. Create your global distribution: Click "Create CloudFront distribution"
  3. Distribution name: Give a name your distribution (e.g. "My personal website distribution")
  4. Distribution type: Select "Single website or app" and click "Next"
  5. Skip custom domain setup: Leave the domain field empty for now (we'll add this later) and click "Next
  6. Specify your origin:
    • Origin type: Select "Amazon S3"
    • S3 origin: Click "Browse S3" and select your bucket from Day 2 
    • Origin path: Leave empty (unless your website files are in a specific folder inside your bucket)
  7. Settings: Use the default recommended settings.
    • Leave "Allow private S3 bucket access to CloudFront" checked.
    • Origin settings: Use recommended origin settings
    • Cache settings: Use recommended cache settings tailored to serving S3 content
  8. Skip security protections - Choose "Do not enable security protections" and click "Next". (AWS WAF provides advanced protection against web attacks, but for personal learning websites with no sensitive data or user input, the built-in CloudFront security is sufficient). We are also trying to avoid extra costs while learning 💰
  9. Review and create - Review your settings and click "Create distribution"
You'll know you're done when you see a new distribution with status "Deploying".

Step 4: Configure your homepage 🏡

Now let's set a default root object for your distribution. This makes your domain automatically serve your homepage when visitors access your root URL.
When someone visits your website's main address (like d1234567890123.cloudfront.net), they're accessing the "root URL" without any specific file name. Your CDN doesn't know which file to show them, so visitors see an error instead of your website.
Setting index.html as the default root object tells your CDN "when someone visits the main address, automatically show them index.html." This ensures your site works like any professional website with clean URLs that go straight to your content.
  1. Edit your distribution: Click on "Edit" under the "Settings" on the "General" tab of your distribution
  2. Set default root object:
    • Scroll down to Default root object field
    • Enter: index.html (no forward slash)
    • Click "Save changes"

Step 5: Test Your Global Website 🧪

Now let's test that everything works!
  1. Wait for global deployment: Your distribution status will show "Deploying" for 5-15 minutes. This time is needed to copy your content to servers worldwide. Refresh the page to check progress.
  2. Get your global URL: Once the status of your distributions shows “Deployed”, copy your distribution domain (similar to d1234567890123.cloudfront.net)
  3. Test your website: Open https://your-distribution-domain.cloudfront.net on your browser. Your website should load quickly.
  4. Verify security: Try accessing your storage bucket directly (the URL from Day 3 ). You should still see "Access Denied".
You'll know you're done when visiting your CloudFront domain (something similar to d1234567890123.cloudfront.net) automatically shows your website, but direct S3 access is still blocked.

Step 6: Understand Your Security Setup 🔒

Good news! When you selected "Allow private S3 bucket access to CloudFront" in Step 3, AWS automatically configured the security for you.
What happened behind the scenes: AWS automatically created an Origin Access Control (OAC) and updated your S3 bucket policy. Think of OAC like giving your CDN a special key to your private storage room. Visitors can get content through the CDN, but they can't access your storage directly, only the CDN has the key.
This means your files stay completely private in S3, but CloudFront can still serve them to visitors worldwide. This is much more secure than making your S3 bucket public, which would expose your files to anyone on the internet.

Checklist

Check the items below to make sure you have completed today's challenge:
  • [ ] Created global distribution for your website
  • [ ] Connected it securely to your private storage
  • [ ] Verified website loads quickly through the global URL
  • [ ] Confirmed storage bucket remains private and secure
🎉 Congratulations! You've solved the fundamental challenge of global web delivery. Your website now loads quickly for visitors anywhere in the world while maintaining enterprise-grade security.
# cloud-launch-challenge-1
Any opinions in this article are those of the individual author and may not reflect the opinions of AWS.
Enjoyed reading this content? Let the author know!

Your likes, comments, shares, and saves help creators reach more builders.

Loading recommendations

Loading article