Hosting a static website on Amazon S3 (AWS tutorials)

Hosting a static website on Amazon S3 (AWS tutorials)

Hello everyone! In this video I’m going to
show you how you can host static websites

on Amazon S. But before we do that, let’s
first take a look at what S is. Well S is

a cloud storage service, built by Amazon,
that allows you to store an unlimited amount

of files in the cloud. And being the cloud,
you of course only pay for what you use. So

why would you use S instead of a regular
webhost? Well first of all S has great performance.

It’s also very secure since you don’t have
PHP or a MySQL database running that can be

compromised. It’s low cost in the sense that
you only pay for what you use and it can scale

very well. It can scale from request per
second to dozens of requests per second. So

what’s next in this tutorial? I’m going to
show you how you can create a bucket. We’re

going to enable the static website hosting
feature, we’re going to set a bucket policy

allowing all our files to be accessed through
a browser. And than we’re going to test our

website and see if it actually works.

So let’s begin.

So for the purpose of this video, I’ve created
a simple website that I’m going to host on

S, called “My awesome website”. And this
is what it looks like. It’s basically two

simple pages with “Hello world, this is my
awesome website’s homepage. There’s even a

second page which you check out here”. And
you can click and than it navigates to page.html

and than you can back if you want, back to
the homepage.

Okay so let’s now host our static website
on Amazon. Let’s go to the AWS management

console, which is at console.aws.amazon.com.
And I’m going to open up the S management

console here. As you can see I have a lot
of buckets where I can store files. And for

my website I’m going to create a new bucket.
I’m going to click “Create Bucket” and I’m

going to call it “www.myawesomewebsite.com”.
I’m going to leave the region by default,

Ireland. I live in Europe so this is a very
good region. I’m not going to set up logging,

so I’m just going to go for “Create”.

And Amazon is now creating my bucket and boom,
there you have it. My bucket has been created.

So the first thing that we’re going to do
is enable static website hosting for this

bucket. So I’m going to click on “Static website
hosting” and I’m going to click “Enable” and

now Amazon wants to know what our index and
error documents are. So my index document

is very traditional, it’s called “index.html”
and my error document is called “.html”.

These are two files that should be in this
bucket, for the website to work. So I’m going

to click “Save” and right now my bucket and
my website is accessible through this URL.

So it’s called [reads URL]. So if I click
on it, I see ” forbidden”. That’s pretty

logical because there’s nothing in the bucket
yet. So let’s go into the bucket, let’s click

on the name. And I’m going to upload some
files, so here I’m going to say “Add files”

and I’m going to select all my files here,
my HTML files. You can’t actually upload folders

to this but we’re going to do that manually.
Okay, so there are my files. Now I’m going

to create a folder “CSS” and in that folder
I’m going to upload my stylesheet. And there

you have it, my website is completely uploaded
to Amazon S.

Now let’s take a look if that website is already
up and running. So let’s go to my website

and hit refresh. No, I still got ” forbidden”.
Why is that? Well, Amazon makes sure that

all the files that you upload are not publicly
accessible straight away. This is a security

feature. You have two choices: either you
can make every file public – which you can

do, you click on a file, open it’s properties
and than you can set the permissions and you

can allow anyone to get your object OR you
can do this instantly for all files in your

bucket. I think that’s a much nicer solution,
so let’s go for that! So to do that, let’s

click on your bucket name and let’s go the
properties – which is by default selected

– and we’re going to select “Permissions”.
We’re going to add a bucket policy. So now

Amazon asks you which policy I have to add.
Well I have already created a policy here,

which is stored on my desktop. And this is
the policy that you need to make all files

in your bucket publicly accessible. I will
share this in the video’s description. So

basically what you’re saying is that we’re
allowing anyone to read or get an S object,

and we’re going to allow it for all files
in this bucket, which is the name of my bucket.

So let’s save that and let’s save here as
well. And now if I’m gonna go back to my website

and I hit refresh, sure enough there is my
website! Hello World! I can navigate to the

other page and I can navigate back and all
is very well. Now let’s also test our error

document. So here we navigate to “index.html”.
Let’s say I want to go to “blabla.html” which

is a file that does not exist. If I hit enter,
Amazon automatically redirects me to my error

document. I created this file: “, oops,
page gone missing”. And so that’s it! We hosted

our static website on Amazon S. I hope you
enjoyed this video! Thanks for watching!

Subtitles End: http://onlinestorewebpro.com/

Spread the love

Leave a Reply

Your email address will not be published. Required fields are marked *

Google Analytics Alternative