Moving House

I’m in the process of moving house. I’m not sure how this works in other places, but here in the UK it’s a bit of a nightmare. One of the things that happens here when you move is that you have to let your service providers know (water, power, etc). I didn’t really give this any thought, this isn’t my first rodeo, but since my last move I have started hosting my blog on my raspberry pi from home and one of the service providers is my ISP.

Internet Outage

When you move your ISP take a little bit of time to sort things out with your new line. I believe they call it “provisioning”. As a result you can be without internet for a while. This means that my blog would be down for that amount of time at least (obviously this doesn’t include the amount of time it would take me to disconnect, move, and then reconnect everything either).

Those of you who have read my other blog posts will know that moving this blog to the cloud was always something that I wanted to reserve for any sort of spike in its usage. Needless to say, there hasn’t been a significant spike as yet but this situation has forced me down the cloud route.

For the hosting, I have chosen to use AWS S3 with cloudformation as it’s something that I have some experience with and I already have an account with them for some other projects.

Create S3 Bucket

Firstly we need to create an S3 bucket that we can host the static content in.

  • Go to your AWS account console
  • Select S3
  • Click create bucket

01 creating the s3 bucket

Bucket settings:

The settings for your bucket should be as follows:

  • Name the bucket the same as your domain
  • Select your region, versioning is up to you here
  • Leave the ownership as the default (this should grant your current account access)
  • Allow access to the public. This is against the recommendation, but we need to public to be able to see our site!

02 creating the s3 bucket

Configure S3 bucket

  • Under the bucket configuration, select static web hosting and enable it.
  • Set your entry point as the index and the error document unless you have a specific error document you want to use. Mine is index.html.

03 configure the s3 bucket

Set your policy to allow public read. Here’s my example policy:

    {
            "Version": "2012-10-17",
            "Statement": [
                    {
                            "Sid": "PublicReadForGetBucketObjects",
                            "Effect": "Allow",
                            "Principal": "*",
                            "Action": "s3:GetObject",
                            "Resource": "arn:aws:s3:::tinklr.net/*"
                    }
            ]
    }

04 example policy

Copy files up to S3 bucket

To get my files in the S3 bucket, I’m just going to drag and drop, if I stay with this solution I will probably put an automated mechanism in place. As I have a jekyll blog, I will upload the _site files that are generaterd by jekyll.

05 upload to s3 bucket

Check to see if the S3 bucket is working and hosting your site. The link can be found in the Static web hosting set up under properties:

06 s3 bucket end point

Mine is working as can be seen here:

07 working site

Create Cloudfront Distribution

Cloudfront is a content delivery network that should improve the speed of access to your site, it will also allow us to streamline the domain and SSL cert required.

  • Go to AWS cloudfront
  • Click create distribution
  • Select the Web “Get Started” button

08 cloudfront start

Set the Origin domain name to your S3 bucket, it should appear in the dropdown if it’s configured correctly:

09 linking cloudfront to s3

Leave the rest as the default, we can configure this later as we move through the set up. One thing to remember with the cloudfront set up is that you will need to invalidate it to show any changes to your site.

To do this select the distribution and go to the “Invalidations” tab:

  • click “Create Invalidation”
  • Type /* in the box and click “invalidate”

10 invalidate distribution

This will allow the distribution to pick up the changes. Enable the distribution by selecting it in the list and clicking “Enable”. This can take a little time and you should see the “Deployed” status when it’s complete.

11 deployed

When you have the deployed state, take the domain name and test that the cloud front is showing your site now too:

12 cloudfront domain

Mine is showing at the domain so we can move on.

Setting up for SSL Certificate

  • Go into the distribution and select the “Behaviors” tab
  • Select the behavior checkbox and click “Edit”
  • I want to redirect HTTP to HTTPS, so I’ll select that and then click “Yes, Edit”

13 ssl config

After a quick invalidation, I can see that it now forces the request to https:

14 forced https

Domain switch

For this I will first need to switch my domain name from it’s current provider to route 53. This will differ for each domain but you will need to unlock it to allow Route 53 to pick it up. I’ll go through the process for me and hopefully it will cover enough for you to do it too.

Open route 53 and select “Registered domains” from the side menu and the select “Transfer Domain”

15 route 53 start

Enter your domain and click check, if it’s locked you should see a message like mine:

16 domain locked

I had to go to my current provider to unlock the domain before I could continue and then request an auth code. Once I had requested this, I could start the transfer. Add it to your cart and follow the steps.

17 ready for transfer

You may need an auth code to complete the transfer. If so you will be presented with a screen to enter it. Put your auth code in the box and select to continue using the current name server provider for now until we’ve set up the hosted zone:

18 auth code

I selected to keep some information private on the next screen but that would be your call. It will just keep some information about me off the whois record. Check the details and click “Complete Purchase”.

19 complete purchase

Amazon should then send you an email to approve the transfer, which I approved.

Cloudfront domain set up

Now we need to link cloudfront to our domain.

  • Go to general under the distribution and select “Edit”
  • Set the domain to your domain, use the default cloudfront cert for now, we’ll switch this later
  • Click “Yes, Edit”

We have to wait for it to redeploy and then we can continue.

Create the hosted zone

Now we need to create the hosted zone for our service.

  • Go back to route 53, under Hosted zones click “Create Hosted Zone”
  • Enter your domain name and leave it as a Public Hosted Zone
  • Now we need to create some record sets by clicking “Create Record Set”
  • Firstly we’ll create the A Record and alias it to the cloudfront distribution
  • Alias the default set up to the cloudfront distribution that we just created (it should be there if it’s redeployed from the previous step). If it’s not ready yet…just wait longer.

20 hosted zone

Switch the domain to AWS DNS

You may have to wait for this step as you probabaly won’t be able to see your domain until the transfer is complete. This can take a number of days (around seven for me). If you are using a new domain then it should be available much quicker. Also, you may have to confirm your email address to allow the transfer to complete (I did).

Back in Route 53, select “Registered domains”. My domain is now listed:

21 domain list

Copy your DNS settings from your hosted zone so you can add them to your DNS for your domain:

22 list of dns from route 53

Under “Registered domains” Select the domain and “Add or edit name server”. Remove the original DNS and replace them with the DNS listed in your hosted zone under NS then hit “Update”.

23 dns servers

When this change has been completed, you should see your domain change to point at the cloudfront end point. I ran a quick dig tinklr.net and I could see that it had changed:

24 terminal dig result

Set up the new SSL cert for your domain

Now the transfer is complete, I can see that I will need to create a new SSL certificate as I’m currently getting a “not secure” message.

Head over to the certificate manager in AWS and click “Request a certificate”:

25 request certificate

Select “Request a public certificate” and continue:

26 public certificate

Add your domain to the list and continue:

27 add domain

Choose DNS validation and click “Review”:

28 dns validation

Confirm everything is correct and click “Confirm and request”:

29 confirm

  • Now we need to create a cname record in our Route53 DNS.
  • Click the drop down next to your domain and you should see the details that need to be added to our DNS record.
  • Amazon has made this quite simple for us. We simply click “Create record in Route 53” and then click “Create” on the popup

30 create

Hopefully you’ll see the success message below:

31 success

Back in Route53 we can see that Amazon has added the cname for us:

32 cname added

  • Now head over to cloudfront and select your distribution
  • Under the general tab, select Edit and under SSL Certificate, select Custom SSL Certificate
  • Click in the box underneath and you should see your domain appear, select it and then, at the bottom of the screen click “Yes, Edit”

33 custom ssl certificate

  • Now we wait until the changes propogate through, hopefully no more than 30 minutes.
  • When it’s complete you should see a valid certificate and no security errors:

34 valid cartificate

And that’s it, now we have a fully hosted jekyll blog on the cloud. Now I just need to pack my things and I can move house!