Hugoで作ったサイトをNetlifyでホスティングするまでの手順
目次
Hugoで作成した、このサイトをNetlifyでホスティングするまでのメモ。
Hugoで新規サイトを作成
使用したHugoは0.31.1
# 新規サイト作成〜Beautiful Hugoテーマのclone
$ hugo new site devnull
$ cd themes
$ git clone https://github.com/halogenica/beautifulhugo.git beautifulhugo
$ cp -r beautifulhugo/exampleSite/* ..
その後、config.tomlの編集、コンテンツの作成、テーマの調整などを行う。
GitHubでリポジトリ作成
$ git init
$ git remote add origin https://github.com/hogehoge/hogehoge.git
$ git add .
$ git commit -m 'first commit'
$ git push origin master
Netlifyでホスティング
Netlifyにログインし、以下の設定を行う。
- [New site from Git]ボタンをクリック
- [Limit GitHub access to public repositories.]をチェックし[GitHub]ボタンをクリック
- ブランチにmaster、コマンドにhugo、Publishディレクトリにpublic/を設定
- [Advanced Setting]をクリックし、キーにHUGO_VERSIONを値に0.31.1を指定
- [Deploy Site]をクリック
カスタムドメインの設定
- 画面上部の[Settrings]メニューをクリック
- 画面左側の[Domain Management]をクリック
- [Add custom domain]をクリックしてドメイン名を入力後、[Save]ボタンをクリック
- [Point your domain at the Netlify servers]をクリックし、CNAMEレコードをみてDNSへ追加する。
HTTPS化
- HTTPSセクションの[Let’s Encrypt certificate]をクリック
- Force HTTPSセクションの[Force HTTPS]をクリック
ローカルで記事を書きGitHubへpushすれば、自動的にデプロイされるのでお手軽で良い。
Netlifyは無料のPersonalプランでもカスタムドメイン・HTTPS・プライベートリポジトリが使えるのが素敵だ。