chrismitchellonline

Sync your Hugo Blog to S3

2018-10-20

Hugo is great running locally with hugo server. You write your awesome blog, get it ready to go, now lets push it to an AWS S3 bucket to get hosted online. Here is a breakdown of what is needed to get your Hugo blog hosted in an AWS S3 bucket using a Cloudfront distribution:

  • A domain name
  • An AWS account with an access key
  • S3 Bucket
  • Cloudfront Distribution
  • A Hugo blog

A Domain Name

There's gang of sites out there that allows you to register your domains and manage DNS. Personally I used GoDaddy because they were offering .99c domains. Google a coupon for this. Will need to setup a CNAME from your DNS control panel once Cloudfront is setup.

An AWS account with an access key

Head over to Amazon Web Services and create an account. Once signed into the console, visit the IAM page and create a user that has programatic access and grab the API secret and key.

S3 Bucket

Still in the AWS console, head over to S3 and create a bucket that your site will be hosted in. This does not need to be the name of your website, but it helps. One caveaut, S3 buckets need to be universally unique so its doubtful that you will be able to create a new bucket called google.com. When setting up a new S3 bucket for website hosting, ensure that you enable Static website hosting. This will allow you to point your Cloudfront distribution to your bucket. Make note of the endpoint that is generated when you enable hosting.

Cloudfront Distribution

Once your S3 bucket is setup head to the Cloudfront piece in AWS and create a new Cloudfront distribution that points to your S3 bucket. When creating the Cloudfront distribution, ensure that the Origin Domain Name and Path is set to the S3 bucket endpoint, mentioned earlier when setting up S3 bucket. Once the Cloudfront distrubution is created, the console will show you a

A Hugo Blog

Head over to Hugo website and get into Hugo. A developer colleague has written up a great article to get started, see their site at The Polyglot Developer. Once your Hugo blog is up and has content locally push to S3. A quick bash script to achieve this is here: #build hugo, i like to build all drafts and everything. hugo --buildDrafts export AWS_PROFILE=hugo aws s3 cp public s3://S3BUCKET --recursive

Conclusion

This has been a quick overview of the steps needed to host a Hugo blog site using Amazon Web Services. After the hosting and site is setup locally, use a simple bash script to deploy your site to S3.

comments powered by Disqus
Social Media
Sponsor