There are a few things to get out of the way before diving into the guide. To deploy, you’ll need to make sure you have connected a host account to your Nanobox account, and launched a new application.
With those out of the way you’re ready to get started!
To get started, all you’ll need is an empty project directory. Create a directory wherever you want your application to live and cd into it:
mkdir path/to/project && cd path/to/project
Configure Hugo to run with Nanobox
Nanobox uses a simple config file known as a boxfile.yml to describe your application’s infrastructure. In the root of your project add the following boxfile.yml:
run.config:# use the static engineengine:staticengine.config:# tell the engine where to serve static assets fromrel_dir:public# enable file watching for live reloadfs_watch:true# install hugoextra_steps:-bash./install.shdeploy.config:# generate site on deployextra_steps:-hugo
Nanobox uses Docker to create instant, isolated, development environments. Because of this, you’ll need to make sure that during development you have Hugo available.
Do this by adding a custom install script at the root of your project that will install Hugo automatically for you:
#!/bin/bashif[[ ! -f /data/bin/hugo ]];thencd /tmp
tar -xzf hugo_0.31.1_Linux-64bit.tar.gz
mv hugo /data/bin/hugo
rm -rf /tmp/*
Generating a New Hugo App
You’ll generate your new application from inside the Nanobox VM (this is why you don’t need to worry about having Go or Hugo installed).
Run the following command to drop into a Nanobox console (inside the VM) where your codebase is mounted:
Once inside the console use the following steps to create a new Hugo application:
# cd into the /tmp dir to create an app
# generate the hugo app
hugo new site app
# cd back into the /app dir
# copy the generated app into the project
shopt -s dotglob
cp -a /tmp/app/* .
Install a theme
cd into the themes directory and clone the nanobox-hugo-theme repo:
git clone https://github.com/sdomino/nanobox-hugo-theme
To use the theme either copy the entire config.toml that comes with the theme, or just add the theme to your existing config.toml
# copy the config.toml that comes with the theme
cp ./themes/nanobox-hugo-theme/config.toml config.toml
# or, add it to your existing config.toml
theme = "nanobox-hugo-theme"
View Your App
To view your application simply run the following command from a Nanobox console:
hugo server --bind="0.0.0.0" --baseUrl=$APP_IP
With that you should be able to visit your app at the given IP:1313 address
Develop, Develop, Develop
With Hugo installed you’re ready to go. Develop Hugo like you would normally (using all the generators, etc.). Once your app is ready to deploy, run hugo to generate your static assets and get ready to deploy!
Deploying Hugo with Nanobox
To deploy your application to Nanobox you simply need to link your local codebase to an application you’ve created on Nanobox. That is done with the following command: