hugo/content/en/hosting-and-deployment/hosting-on-bitbucket.md
Bjørn Erik Pedersen 5e078383a7 Squashed 'docs/' changes from 785e375f..49809a03
49809a03 Merge commit '20a631b4964fc0ab9137cce1e41774cbc17de044'
20a631b4 Squashed 'themes/gohugoioTheme/' changes from b8202f539..dafc91ff1
8b58f565 Re-generate CLI docs
4653a724 Add Netlify deployment badge
2d6246bc Remove some deprecated site variables
e6777153 Improve Algolia Search Display Styling
1570999f Add missing "." in front of gitlab-ci.yaml example
b922ae7d This adds documentation to the new configDir/Environment logic from .53 (#729)
7cff379f Correctly escape multi-word taxonomy terms in example
2dfeeda4 fix typo by removing stray paren
0870bd9a Fix typo in `paginate` description
91e8be85 Fixes https://github.com/gohugoio/hugo/issues/5609
c1db65ec Make the dummy URL more obvious
b4589ff0 Fix a link
b73dcb9a Consistently use "posts" as section name in examples
7a56abbc Format definitions
a9c6fd9b Minor clarification over the last commit
5c86bdc8 Add alternative instructions for Quick Start for non-git users
dafe7ee9 Add Visual Studio Code plug-ins
110ed19e Update HUGO_VERSION
2abd031a Update page.md
b332f7b9 Update page.md
f5a8c9d4 Update static-files.md
6d0c155c Add note about relative protocol URLs
a13751ac Theme Warning: Remove note about unquoted URLs
4c8f7d68 Incorporate feedback
6f2b9cf0 Update Creating Themes Warning
40d88d98 Fix ToC example to use binary true/false
4a11f3f1 Fix typo
2dbfc0a4 Fix a typo in taxonomies
d63790ef Do not mark UndocumentedFeature issues as stale
d7aff095 Regenerate docs.json
71c0826f Update transform.Unmarshal.md

git-subtree-dir: docs
git-subtree-split: 49809a038b2691637bab7f3f2e385dde654a88b8
2019-02-01 09:01:04 +01:00

4.9 KiB

title linktitle description date publishdate lastmod categories keywords authors menu weight sections_weight draft toc aliases
Host on Bitbucket Host on Bitbucket You can use Bitbucket in conjunction with Aerobatic to build, deploy, and host a Hugo website. 2017-02-04 2017-02-04 2017-02-04
hosting and deployment
hosting
bitbucket
deployment
aerobatic
Jason Gowans
docs
parent weight
hosting-and-deployment 50
50 50 false true
/tutorials/hosting-on-bitbucket/

You can use Bitbucket and Aerobatic to build, deploy, and host a Hugo website. Aerobatic is a static hosting service that integrates with Bitbucket and provides a free hosting tier.

Assumptions

Install Aerobatic CLI

If you haven't previously used Aerobatic, you'll first need to install the Command Line Interface (CLI) and create an account. For a list of all commands available, see the Aerobatic CLI docs.

npm install aerobatic-cli -g
aero register

Create and Deploy Site

hugo new site my-new-hugo-site
cd my-new-hugo-site
cd themes; git clone https://github.com/eliasson/liquorice
hugo -t liquorice
aero create                                           # create the Aerobatic site
hugo --baseURL https://my-new-hugo-site.aerobatic.io  # build the site overriding baseURL
aero deploy -d public                                 # deploy output to Aerobatic

Version v1 deployment complete.
View now at https://hugo-docs-test.aerobatic.io

In the rendered page response, the https://__baseurl__ will be replaced with your actual site url (in this example, https://my-new-hugo-site.aerobatic.io). You can always rename your Aerobatic website with the aero rename command.

Push Hugo site to Bitbucket

We will now create a git repository and then push our code to Bitbucket. In Bitbucket, create a repository.

# initialize new git repository
git init

# set up our .gitignore file
echo -e "/public \n/themes \naero-deploy.tar.gz" >> .gitignore

# commit and push code to master branch
git add --all
git commit -m "Initial commit"
git remote add origin git@bitbucket.org:YourUsername/my-new-hugo-site.git
git push -u origin master

Continuous Deployment With Bitbucket Pipelines

In the example above, we pushed the compiled assets in the /public folder to Aerobatic. In the following example, we use Bitbucket Pipelines to continuously create and deploy the compiled assets to Aerobatic.

Step 1: Configure Bitbucket Pipelines

In your Hugo website's Bitbucket repo;

  1. Click the Pipelines link in the left nav menu of your Bitbucket repository.
  2. Click the Enable Pipelines button.
  3. On the next screen, leave the default template and click Next.
  4. In the editor, paste in the yaml contents below and click Commit.
image: beevelop/nodejs-python
pipelines:
  branches:
    master:
      - step:
          script:
            - apt-get update -y && apt-get install wget
            - apt-get -y install git
            - wget https://github.com/gohugoio/hugo/releases/download/v0.18/hugo_0.18-64bit.deb
            - dpkg -i hugo*.deb
            - git clone https://github.com/eliasson/liquorice themes/liquorice
            - hugo --theme=liquorice --baseURL https://__baseurl__ --buildDrafts
            - npm install -g aerobatic-cli
            - aero deploy

Step 2: Create AEROBATIC_API_KEY environment variable.

This step only needs to be done once per account. From the command line;

aero apikey
  1. Navigate to the Bitbucket account settings for the account that the website repo belongs to.
  2. Scroll down to the bottom of the left nav and click the Environment variables link in the PIPELINES section.
  3. Create a new environment variable called AEROBATIC_API_KEY with the value you got by running the aero apikey command. Be sure to click the Secured checkbox.

Step 3: Edit and Commit Code

hugo new posts/good-to-great.md
hugo server --buildDrafts -t liquorice #Check that all looks good

# commit and push code to master branch
git add --all
git commit -m "New blog post"
git push -u origin master

Your code will be committed to Bitbucket, Bitbucket Pipelines will run your build, and a new version of your site will be deployed to Aerobatic.

At this point, you can now create and edit blog posts directly in the Bitbucket UI.

Suggested next steps

The code for this example can be found in this Bitbucket repository. Aerobatic also provides a number of additional plugins such as auth and redirects that you can use for your Hugo site.