Clickbait? Maybe, you tell me. On today’s world, whatever you do, there is no excuse to not have a website, if you have a business, if you’re making a blog, if you want your CV out? There’s many reasons to expose what you have to give to the world. So I’m going to assume you know how to write some HTML and CSS and JS, if you don’t, head to W3Schools and get some nice free education! Because doing an actual website is outside of the scope of this post, let’s just get the boilerplate template from here. In all fairness it’s a very good starting point for a blank website anyways!
So everybody in the dev world knows AWS is Amazon Web Services and S3 is one of the many (many many) services they have. S3 is used for mostly storing data, however, so many people are now using it for running static websites that AWS is now catering for this as a case. So first, head up to Amazon and create your AWS account.
Create a bucket
Once you’ve signed up on the console, go to Services > S3 and click Create Bucket. Select a region that suits you and give it a name. Leave everything on defaults (we’ll configure it in a bit) and create the bucket.
Once you have your bucket, click on the bucket row and the properties panel will display, take a note of the ARN (Amazon Resource Name) of your bucket. You’ll need it further down!
Create a User for access
Now we need a user to connect to AWS with permissions to send data to our bucket and IAM will help us to do this. Go to Services > IAM. On the menu to the left go to Users > Add User. Make sure you give your user has Programmatic access as we’re going to use it just for API access. Don’t worry about permissions yet, we’ll do that in a second, go the last screen and take note of your Access Key and your Secret Access Key, if you lose the second you can’t see it again and you’d have to create another pair so make sure they’re safe!
Create a policy for accessing your bucket
So now we have a user, let’s create an access policy for our bucket. Policies on AWS are basically a way to describe access rules for an object or a type of object, in this case a bucket vs all the S3 buckets we own. So we stay on IAM and go to Policies > Create policy. Let’s stick to the visual editor as it’s much easier that way. You will need for your policy:
- Service. S3
- Actions. This is the permissions you want to give on this policy. Think of it as what the holder of the policy can do on a bucket. It’s useful to think as how you give the policy exactly what it needs and nothing else.
- List. I usually go for ListBucket though technically you don’t need it.
- Read. GetObject, all you need is to be able to read an object to know if it’s changed
- Write. PutObject, this one allows you to write files to the bucket
- PermissionsManagement. PutObjectAcl and PutObjectAcl, we need these to be able to make files public every time we send them to the bucket
- Resources. Here you add your bucket ARN so this policy applies to just this bucket. This is a very good way to lock your security and prevent anyone from accessing your data. Needless to say in today’s world this is mandatory! If you add your bucket name, you need to tick Any for the objects so it applies to every object inside the bucket, otherwise your permissions will be too restrictive.
- Request Conditions. This is the last part of the security, for the time being I will leave it alone, but on of the things you can do is whitelist IPs in this section and make sure your website is only available to a given set of IPs.
Create a Group to use the policy
Click on Review Policy and then Save your changes. Voila! You have an access policy for your bucket. Next up, we’re creating a group, go to Groups on IAM and Click on Create new Group. Give it a name and remember descriptive is good for later (I went for s3-access-to-my-site). On the Attach Policy screen find your access policy and select it, then click on Next step and Save your group. Now click on your newly created group and on the Users tab click on Add Users to Group and add the user your created earlier to this group.
You now have created a Bucket where you’re going to store your website files. You have a group that has the permissions to upload files to this Bucket and now have a user that has been added to this group. You’re all set! Just need a website now!
Get the AWS CLI toolkit
Now you need your AWS CLI toolkit. This will help you upload your files to S3 on a quick command line. Go to the CLI homepage and get yours, if you’re on a Mac or Linux you can get it easily via terminal and if you’re on windows there’s a nice MSI installer for you, either way is very simple!
Once you have the toolkit installed, it’s time to go back to the notes you took when creating your user for your AWSKey and the Secret Key. Oh you lost them? No problems, just create a new set of keys again.
Now open your terminal and tell aws who you are with the following command:
This will ask you for both keys, your default region name (I am using eu-west-1 which is Ireland, if you need to look where your region is go here) and your default output format (json, xml, whatever takes your fancy).
So now we have the toolkit configured, navigate to your folder and synchronise your folder with S3:
aws s3 sync . s3://your-bucket-name --acl public-read
You should see the files being uploaded and they’ll be on your S3 bucket now. We’re nearly there! Some final touches, so now we want our bucket to host files as a static website, for this we go to the bucket on AWS and click on properties and select the website hosting tab, set our default document and our error document and voila! We’re done.
So where is your website? The format for your website url now is this:
So would be something like http://this-is-not-a-real-name.s3-website-eu-west-1.amazonaws.com
Really easy right? Well have a go and let me know how it works for you!