Part 2: Deploying to Netlify

Part 1 is here.

First we need to prepare configuration file for netlify in hugo.

1

touch netlify.toml

Paste the following into the netlify.toml file. Change the HUGO_VERSION to accordingly.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30

[build]
publish = "public"
command = "hugo --gc --minify -b $URL"

[context.production.environment]
HUGO_VERSION = "0.68.3"
HUGO_ENV = "production"
HUGO_ENABLEGITINFO = "true"

[context.split1]
command = "hugo --gc --minify --enableGitInfo"

[context.split1.environment]
HUGO_VERSION = "0.68.3"
HUGO_ENV = "production"

[context.deploy-preview]
command = "hugo --gc --minify --buildFuture -b $DEPLOY_PRIME_URL"

[context.deploy-preview.environment]
HUGO_VERSION = "0.68.3"

[context.branch-deploy]
command = "hugo --gc --minify -b $DEPLOY_PRIME_URL"

[context.branch-deploy.environment]
HUGO_VERSION = "0.68.3"

[context.next.environment]
HUGO_ENABLEGITINFO = "true"

Deploying to Netlify

Before we proceed, ensure that you have your website project host on github. If you have been following the steps from previous article, then you are good to go and your codes are already on Github.

Create a Netlify account

Visit app.netlify.com and select your preferred signup method. For our case, we are using GitHub, so select that option and proceed with signup.

Create a New Site with Continuous Deployment

Select the “New site from Git”

Select your git provider

Select your git provider. For this scenario, we are using GitHub.

Select the repository you want to use for continuous deployment.

Choose your Hugo website repository. For this case, I choose notekaki.com

Deploy settings

Select the branch you want to be published, your build commands and your publish directory. For our case, we are using master branch. Publish directory for Hugo is public.

Build & deploy site

Once you have finished with the deployment settings, click Deploy Site and wait for it to be built.

Once the build is finished, you should now see a “Hero Card” at the top of your screen letting you know the deployment is successful. You’ll see that the URL is automatically generated by Netlify. You can update the URL in “Settings.” Visit the live site.

Now every time you push changes to your hosted git repository, Netlify will rebuild and redeploy your site.