先に移行する理由について話しましょう#
以前は hexo + next テーマを使用していましたが、自分で気まぐれに外部リンクや live 2d、タグクラウドなどを追加しました。人々からはかなり見栄えが良いと言われましたが、自分が見慣れるとちょっと派手すぎると感じるようになりました。また、他の人のブログにアクセスするときに、基本的には hexo + next を見ることが多くなりました... 少し飽きてしまいました。
しかし、理解するのは簡単です。hexo は使いやすく安定しており、機能が充実しており、成熟したテーマ(Next と言います)があります。この時点で私の視線は hugo に向けられました。
Hugo は Go 言語に基づいて開発され、世界で最も高速なウェブサイト構築ツールとして称されています。具体的にどれほど速いかはわかりませんが、hexo で静的ウェブページを生成するときには待つ必要がありますが、hugo を使うと待つことなくすぐに完了するような感じがします...
もう一つの利点は、hugo がホットリロードをサポートしていることです。ファイルの変更内容がリアルタイムにウェブページに表示されます。hexo では複数回のリフレッシュが必要ですが、hugo の方が便利です。
hugo には上記の利点がありますが、hexo に比べて知名度やチュートリアル、ドキュメント、設定の最適化などはオンライン上では比較的少ないため、いくつかのことは自分で試行錯誤する必要があります。
構築#
環境#
ブログの生成#
hugo をインストールした後、**hugo new site ' ブログ名 '** コマンドを実行すると、hugo はブログを保存するためのフォルダを生成します。一般的には次のようなフォルダがあります:
- archetypes/
- content/
- data/
- themes/
- layouts/
- static/
- config.toml
一般的な設定情報は config.toml に記述され、記事やいくつかのページは content フォルダにあります。archetypes フォルダには、hugo new コマンドを使用してページを生成する際のヘッダーの設定情報形式が一般的に格納されます。themes フォルダには必要なテーマが格納されます。
テーマのインストール#
hexo とは異なり、hugo にはデフォルトのテーマが付属していないため、hugo serve を実行してブラウズすると、何も表示されません。そのため、hugo 公式テーマライブラリから好みのテーマを探す必要があります。
同時に、テーマの提供するドキュメントに従って config.toml を設定します。ダウンロードしたテーマのフォルダには通常、exampleSite というフォルダが含まれており、これは作者の設定例です。設定内容がわからない場合は、作者の例をコピーして自分で編集してください。
記事の生成#
hugo new posts/xxxx.mdコマンドを使用すると、content/posts フォルダに必要なマークダウンファイルが生成されます。マークダウンの構文で編集してください。
もう一つ注意する点は、新しく生成されたファイルの上部に、hexo とは異なり draft 属性が追加されていることです。これはドラフトかどうかを示すもので、true の場合、そのファイルはページにレンダリングされず、ブログに表示されません。削除するか、false に変更するとレンダリングされます。
タグとカテゴリの追加方法は hexo と同じです。
ページの生成#
特定のページ(アーカイブページなど)は、hugo new page/xxx.mdコマンドを使用して生成できます。たとえば、about ページはhugo new page/about.mdとなります。生成後、draft を削除して layout 属性を追加し、そのページの種類を指定します。about ページの場合はlayout: aboutとなります。
ブラウズとデプロイ#
ブラウズするにはhugo serveコマンドを使用し、アドレスは http://localhost:1313/ です。
hexo とは少し異なります。
hugoコマンドを実行して静的ページを生成し、ブログのフォルダに public フォルダが追加されます。このフォルダには最終的に生成されるページが含まれています。public フォルダのファイルをリポジトリにプッシュすれば完了です。
最後に#
長期的な視点で見ると、記事を書くほど hugo の利点がより明確になります。
しかし、実際にはただ遊ぶために使っているだけです。
Just for fun.