
HUGOを使おうとするとnetlifyなどにデプロイすることを勧められます。
でも国内のサービスを使いたいですよね?
そこでさくらのレンタルサーバーを利用することを考えてみたいと思います。
ブログの公開程度なら一番安いプラン(年額1,980円)で良いと思います。
初期費用無料、転送量無制限、Let’s Encrypt対応となっていて、なかなか使えます。
(このブログもそのプランです)
もしそれ以上のプランがお望みでしたら、ページ下部のリンクから申し込んでいただければ助かります。
サーバーの申し込み、HUGOのセットアップ+テーマの導入は割愛します。
他のブログを探してみてくださいね。
HUGOの記事の作成・確認の流れ
記事の作成
HUGO
のディレクトリで、 hugo new content posts/new-article.md
か hugo new content posts/new-article/index.md
で記事を作ります。
なぜ記法が二つあるのかですが、それぞれのテーマによって異なるからです。
それぞれ出来上がるURLが /posts/new-article.html
か /posts/new-article/index.html
になりますので、ブログの構造によって違いますね。
このブログは後者になります。
確認
hugo server -D
で表示を確認します。
その時に、 draft
が true
になっているものも確認できます。http://localhost:1313/
でブラウザで表示できます。
ビルド
記事の設定部分の draft
を false
に変えて、 hugo --minify --gc
をします。
そうすると public
ディレクトリがサイトの構造になっているはずです。
サイトにアップロードする
public
ディレクトリの内容を、さくらのレンタルサーバーの www
ディレクトリに丸々アップロードすれば完了です。
ただ、これだとFTPソフトを立ち上げなくてはならず、コマンドだけでできないので、不便ですね。
同期にrcloneを使ってみる
rcloneというソフトを使ってみるといいでしょう。
ダウンロード
https://rclone.org/downloads/
こちらからダウンロードできます。Intel/AMD - 64bit
のwindowsを選びましょう。(macの方は必要なものをどうぞ)
インストール・設定
適当な場所に解凍し、パスを通しておきます。
方法は以下を参照してください。
https://chatgpt.com/share/67e415fc-849c-8006-b840-bb3b47cda317
先ほどの HUGO
のディレクトリに cd
します。
rclone config
と入力しエンターn
(new remote)を選択name
にsakura
を入力(判別できる名前)Storage
に15
を入力(FTP)host
にxxxx.sakura.ne.jp
(xxxx
は申込時に決定されたサブドメイン) を入力user
に申し込み時に決定されたユーザー名(多分サブドメインと同じ)を入力port
はエンターでデフォルトFTP password
にy
を入力password
に申し込み時に知らされたパスワードを入力- もう一度パスワードを入力
tls
はエンターでデフォルトexplicit_tls
はtrue
を入力Edit advanced config?
はエンターKeep this "sakura" remote?
はエンター- 最後に
q
で終了
これで設定は完了です。
同期(アップロード)
それでは同期してみましょう。rclone sync -v ./public/ sakura:/home/xxxx/www/
を入れエンターを押します。
( xxxx
は申込時に決定されたサブドメイン)
その時に最後の /
を省略しないように注意してください。
これでコマンドだけでアップロードできるようになりました。
npmを使う
もしnpm
を導入しているようなら以下のような package.json
を作ると楽になります。
{
"name": "hugo",
"version": "1.0.0",
"description": "",
"scripts": {
"build": "hugo --gc --minify",
"sync": "rclone sync -v ./public/ sakura:/home/xxxx/www/",
"clean": "rmdir /S /Q .\\public",
"serv": "npm run clean && hugo server --gc -D"
}
}
npm run build
でビルド、npm run sync
でアップロード、npm run serv
でローカルサーバーが立ち上がります。
(macの方はcleanのコマンドを変更する必要があります)
HUGOを使っている方は多いんでしょうか?あまり見たことが無いような気がします。
でもショートコードがあるのである程度のカスタマイズもできますし、出力されるのが静的HTMLなので軽いのも良いですね。
何か案件で使ってみたいものです。
テンプレートがGoのものなので少し慣れないところもありますが、基本文法が分かってしまえば作れると思います。