Hugo 入門:初心者向けガイド
· 読了時間 2 分
はじめに
Hugo は最も人気のあるオープンソースの静的サイトジェネレーターの一つである。驚異的な速度と柔軟性により、Hugo はウェブサイト構築を再び楽しいものにしてくれる。
なぜ Hugo を選ぶのか?
次のプロジェクトで Hugo を選ぶ説得力のある理由をいくつか挙げる:
- 圧倒的な速度
- 習得の容易さ
- 高い柔軟性
- 素晴らしいコミュニティ
初めての Hugo サイトをセットアップする
初めての Hugo サイトを作成する手順を順に見ていく:
terminal
# 新しい Hugo サイトを作成
hugo new site my-awesome-site
cd my-awesome-site
# git を初期化しテーマを追加
git init
git submodule add https://github.com/theNewDynamic/gohugo-theme-ananke themes/ananke
# テーマを設定ファイルに追加
echo "theme = 'ananke'" >> config.toml
# 最初の投稿を作成
hugo new posts/my-first-post.md
コンテンツの扱い
Hugo はコンテンツ作成をシンプルにする。ここでは、コンテンツを効果的に整理する方法を紹介する。
高度な機能
Hugo には多くの高度な機能が最初から備わっている:
- タクソノミー:カテゴリとタグ
- ショートコード:複雑なコンテンツを簡単に追加する手段
- カスタム出力:JSON、AMP など
- アセット処理:SASS/SCSS、PostCSS
コード例
以下はシンプルな Hugo テンプレートの例である:
layouts/_default/single.html
{{ define "main" }}
<article>
<h1>{{ .Title }}</h1>
<time>{{ .Date.Format "2006-01-02" }}</time>
{{ .Content }}
</article>
{{ end }}
まとめ
Hugo はモダンなウェブサイトを構築するための優れた基盤を提供する。速度・柔軟性・使いやすさの組み合わせにより、あらゆる規模のプロジェクトに最適な選択肢となっている。
次のステップ
- Hugo の公式ドキュメントを探索する
- Hugo コミュニティに参加する
- いくつかの Hugo テーマをチェックする