hi my name is noah gift and i'm an adjunct professor at duke i'm also an executive in
residence there and i specialize in data science and cloud computing and today i'm going to be
giving a talk on hugo helping humans at scale through continuous delivery on aws
one of the topics i'm extremely passionate about is re-looking at technology and taking a different
lens where we look at the stakeholders i think the last 10 20 years we've seen that there has been
really this idea that startups are are only good technology is only good but then we look
at the effects on society people believing things that aren't true that are clearly easy to debunk
you know problems with getting people vaccines there's been this proliferation of misinformation
and disinformation and there's been this metric of user growth and engagement as in revenue right as
the revaluation as the things that we value in society but i think it's time that other
parts of our society fight back and we and we use our own resources to spread actual true
information true facts and one of the ways you can do this is by using a technology like hugo
hugo is open source it's easy to deploy you don't have to pay anything to a hosting provider if you
don't want to you can do it all yourself with your own two hands and you can actually spread
accurate meaningful information at a global scale so you could build a website as big as the wall
street journal or the new york times yourself and actually have a bunch of facts that continuously
get deployed into a production based environment so that's really my my challenge for people that
are listening to this are that you can actually create a difference in the world by spreading
information and hugo could be one of the vehicles that you use so i'm going to go through and walk
step by step through some of the processes that i've used personally for websites with hugo
and i challenge you to try to make the world a better place by spreading true and and facts
throughout the the world and making humanity better all right let's go ahead and get started
let's take a look at this hugo static site process here of continuous delivery on aws and really
let's start at the beginning here first on the source code section what we could do is develop
a local server workflow and this could be in an environment like either aws cloud 9 or potentially
github code spaces or some other cloud-based environment maybe the google cloud azure cloud it
could be your desktop as well i personally prefer to use cloud-based development environments and
i would go through and get this running locally first making sure that i've got everything set up
that i've actually got everything that would uh be deployed in the cloud-based environment running in
my my environment that's a mimic of this and this is really what the cloud9 environment does it's
an exact replica of the kind of environment that i would run later now once i've gone through and
i've pushed my code into github i can actually listen via the build server and the build server
would go through here and actually trigger a new deploy process every time a change is made in
github now the great thing about this process is that with the 80 bus cloud 9 environment
obviously i can push the code in test the changes locally with a local hugo server here and make
sure everything looks right or if they're small content based changes i can just edit directly
from github and those changes can automatically be deployed and here's where we get into the aws code
build process and the aws code build process uh what it will do is it could create an item
potent uh infrastructure command no it could be in c sharp which is a language i like it could
also be in python which another language i like it could be in typescript you could basically
programmatically control the deployment in an item potent way and what this means is that every time
you make a change it'll always be the exact same change no matter how many times you deploy so you
know that your website is in a solid condition potentially read-only so that no one could ever
break into it you would then go through and build your hugo site sync those files directly into
this s3 environment and then this would be really the basis of your website the only thing left to
do would be to have route 53 lock into the bucket and then also talk to the 80 bush cloud front
which is the cdn and the beautiful thing about this workflow is you can deploy everything within
just a few seconds okay let's go ahead and take a look at how we would do this okay let's take
a look here at my personal website noagift.com i can move this down a little bit and in general the
idea here is that whenever i want to continuously deploy this website all i need to do is go over
to my github repo here look at the repo that has my code in it no gif website and i can just if i
want edit directly inside of this website add content courses whatever it is i'm building it
out and it automatically will deploy this into the website up here so this is really the beauty
of how this works in fact just to let you know how simple it is to make a change i can actually even
edit potentially the readme itself and just say you know bump deploy and if we go through here
and we bump the deploy i didn't make any content changes but it'll trigger the build code build
you can see that it's deploying successfully and that if i select this this process is going
through and and building out in real time exactly what's happening inside of my my
project so this is one of the really nice things about using this continuous deployment uh process
and i type in know a gift here we go we can see this was just deployed recently latest build and i
could even start it again manually if i wanted to and i could even look at the logs in detail which
is which is kind of neat and this is going to show us step by step what to do so how do i do this on
my own if somebody else wanted to reproduce what i did well to start off with i would recommend going
into aws here and creating a new environment so let's go ahead and do that we'll call this hugo
and then inside of here i like fast machines so i'm going to select a slightly bigger machine
here so it'll be a little bit responsive so 16 gigs of ram 8 cpu that looks good we'll use amazon
linux because that's what the aws code build will use and notice that it'll timeout after 30
minutes for me and go ahead and create this and now what's great is that i can start developing
in identically the same environment that the build system that will push the code to s3 will
actually use and this is a huge advantage of the aws cloud9 environment and it's actually a very
good environment to build in all right so we've got this thing set up here and a few different
things to point out is that i have a shell right and this is a bash based shell and it can do
really anything that a regular aws environment can do because i have the credentials set up
here automatically in a role-based privileges so i can actually interact with the aws ecosystem and
even sync my hugo site directly there so all right let's go over here to hugo to the latest release
go down and grab a 64-bit tar file let's go ahead and say copy link address and then go back to this
environment go ahead and say wget pull it down locally now i just need to uncompress this thing
there we go and now it's really just a one-liner i can just say pseudo
cp hugo let's go ahead and put hugo into user
local bin perfect now that it's inside of there if i if i go ahead and i remove the rest of
this stuff inside of my environment so i'll remove hugo or remove hugo
the tar file and i type in which hugo we can see that user local ban hugo type in
hugo version here we go and we've got the latest version of hugo now uh what the next
thing that i would recommend to do is actually go to the quick start here and let's follow
the quick start guide so pretty easy to to get started with it we can say this hugo new site
there we go that worked out pretty well make this a little bit bigger
so we've got this new site here notice the structure we have a content we have the themes
the config file all that stuff now we'll want to go ahead and follow exactly what they say
which is let's go ahead and cd into that quick start directory let's go ahead and say get init
as well and then finally let's go ahead and add a theme so we can copy this part
there we go now that we've added the theme we can actually echo it
into the conv into the config file which will allow us to run it and now we can just type in
really the last step which is to add a new post let's go ahead and do that let's type in new post
perfect now if i go to content i go to post the big thing to do as a takeaway
is that we want to make it not a draft because those won't publish we'll say false
and then we'll also say here hello world hello world and then we're pretty close to being able
to run we just type in hugo serve i believe dash d and this will serve it out now to test
it out there's a couple of different ways to approach this i would just open up a new shell
first so say need terminal and just curl the address that shows up which is localhost 1313
and we can see that it's in fact running and hugo is is still running building everything's working
properly now one of the things that we can do though to fully view everything
that's happening is to go into our other environment here let's go ahead and go to aws
and let's go ahead and go to ec2 and let's actually open it up so that we can see what's
happening and so in this case if i look at the hugo deploy here this is the website hosting
environment that i'm working in currently and we can see this is the public ip address
but we can't access it because ews is secured by default so what we'll need to do is go to
security go into the security details here go into the group and scroll down to edit inbound rules
and we'll add a rule that says custom 0 0 and for port 1313
and this will allow anybody to go through and view our website remote which is what we want
and the only other thing we'll need to do is make sure that we have the right ip address that's
one thing and i can go ahead and replace this right here and put in 1313 but it won't run yet
because of the fact that we need to tell hugo itself to bind to that port so we'll have to do
bind equals and we'll have to go ahead and say 0.0.0.0
and if we run that and we go back we should have our hugo site running and notice here's the hello
world latest post here now if we want to change it in real time very straightforward to do because
i'm inside of cloud9 we can say this is from cloud9 save it notice it automatically builds
it we go back here look automatically updates our website so this is an amazing workflow that is is
really easy to get started with and to develop your code locally now if you wanted to then
go to the next step like i did all you need to do is push it to a github repository like i'm doing
right here let's go ahead and walk through some of the things that i did so i have my
content everything's the same over here i have my theme all this and really the secret sauce here
is this buildspec.yaml file this does the majority of the work and let's go ahead and
see what are the things that i do so i copy the latest hugo release or the one that i was using
at the time i built this i do similar things to what i did in this environment i then go ahead
and say hugo which builds a website and then i sync the code by using aws s3 sync command
to my bucket which is the same as my name this is really a key here to get route 53 working i then
do a replace of all my content i do a cache and validation for a cloud front which is the cdn
and it's really just those three steps aws s3 sync and go through and do the cache control replace
and then go through here and do a cache invalidation now how would we actually go through
and take a look at this in the real world if we go through here and we look at amazon s3 here
let's look at the website that i've got set up it says publicly available
or accessible we have properties and if we scroll down what are the things that
make it happen one is that i've enabled this feature of aws static website hosting
very easy to do you just say edit once you've done this you can take this bucket website endpoint
and you go to route 53 and you just add that into your route 53 address which it is actually inside
of here if you wanted to play around with it and look at it you could look at the service
route 53 and actually configure that yourself the only other thing that is is probably important
to be aware of is that you have to create a bucket policy and so in this particular
environment here the other thing to be aware of that i did was under the permissions i have
actually a policy that's a read-only policy this lets people read the the access to to my website
once i've got these two things set up uh the policy and the static website hosting
that's linked to route 53 the only other thing that we would need to do is go over to cloud9
and and and and i'm sorry into code build and make sure that code build is actually
building out our our project so you'd say go ahead and create a new build project and a few things to
point out in this build project would be that you would want to point it to where your code lives
it could live in any of these locations s3 code commit i would probably recommend github go
ahead and select a managed image i would say use amazon linux 2 because that's the same
as the environment that we're building in go ahead and select the latest runtime
and we're not using docker so you don't need to do this but you would need to select a
a new service role in iem that has the ability to copy data into s3 as well as communicate with
cloudfront so this is something to be aware of in order to do that you would need to go over to
the im system if we go down here and we go to the um the im system here just type in iaem
lets go to all services i i and go to iam the iem system is where you can actually go ahead
and create a role that would actually allow you to do that build process
finally you would use the build spec.eml file and this would actually allow you to push
the the configuration change to production and continuously deploy your code one last thing i'll
point out is once you go down here to whatever repo notice that you should select get sub modules
all right that's it that's all we have to do to get hugo working in your aws continuous delivery
environment let's go ahead and recap the steps so step one would be make sure you have an aws
account launch a cloud9 environment step two is i would set up your github communication so
create some keys we didn't go over that but it's pretty straightforward to do once you've done that
go ahead and download the latest hugo file in this case i downloaded the the latest version
and uncompressed it and copied it into user local bin once you've done that go ahead and
create a new site with the quick start guide add the sub modules that will give you the hugo theme
and then go ahead and run it locally and do a curl to make sure it's working
then go over to the security groups make sure that you open up the port 1313 so that you can actually
expose it to zero zero zero then go back make sure that you can do that workflow once you've
got that working that could be your development environment and you can go back and forth and get
it get it running locally and get the site exactly the way you'd like then simultaneously i would go
over to aws s3 create a static hosting scenario there so you can go ahead and follow the official
documentation for aws there's a very good how-to guide on how to set up the permissions correctly
and then actually from cloud9 you could even just copy those files over there if you wanted to just
test it out before you set up the continuous delivery process once you've got the manual
copying of the data in there then i would go through and do the aws code build process
to do the continuous delivery so really a very straightforward process to set up a global scale
website that is on par with something like wall street journal or new york times okay good luck