自分のwebサイトをHugoを使用し作成しました。(このサイトです！)普段はNext.jsを使用しwebアプリを作成しているのですが、今回はHugoを使用することを決めました。選定利用としては様々なthemeがあり、利用や切り替えが楽、Markdownによるコンテンツ管理の容易さ、kubernetesのwebサイトで利用されており使ってみたかった点になります。

手順

環境

MacOS(Ventura) go version 1.22.3

構築

1. hugoのインストール

brew install hugo

2. Hugoサイトの作成

hugo new site my-blog

3. PaperModテーマの追加

git submodule add https://github.com/adityatelange/hugo-PaperMod.git themes/PaperMod
echo "theme = 'PaperMod'" >> hugo.toml

4. トップ画面の作成

hugo.toml

baseURL = "https://kei-ta.github.io/kei-ta-blog-go/"
languageCode = "ja"
title = "Kei-Ta Blog"
theme = "PaperMod"
[params]
defaultTheme = "dark"

[params.profileMode]
enabled = true
title = "Kei-Ta Blog"
subtitle = "This blog is my activity log."
imageUrl = "https://kei-ta.github.io/kei-ta-blog-go/me.jpg"
imageTitle = "me"


[[params.socialIcons]]
name = "X"
url = "https://x.com/bondai_engineer"

[[params.socialIcons]]
name = "Github"
url = "https://github.com/Kei-Ta"

[[params.socialIcons]]
name = "Instagram"
url = "https://instagram.com/tk23.05"

[menu]
[[menu.main]]
name = "Home"
url = "/"
weight = 1

[[menu.main]]
name = "Engineer"
url = "/engineer/"
weight = 2

[[menu.main]]
name = "DIY"
url = "/diy/"
weight = 3

コンテンツページの作成

content/enginner/_index.md

---
title: "Engineer"
date: 2023-07-08T12:00:00
draft: false
---

- Software Enginner
- Skill
    - AWS(2024 AWS All Certifications Engineer)
    - Go,TypeScript,Python,C++
- I'm interested in
    - k8s
    - Platform Enginner
    - OSS Activity
- OSS
    - [Kubernetes documentation](https://github.com/kubernetes/website)
    - [Yamada UI](https://github.com/yamada-ui/yamada-ui)
    - [aws-summit-download](https://github.com/Kei-Ta/aws-summit-download)
- My Tech Article

content/enginner/1.md

---
title: "Hugoでブログを作成し、GitHub Pagesで公開する"
date: 2023-07-08T12:00:00
draft: false
---

自分のwebサイトを[Hugo](https://gohugo.io/)を使用し作成しました。(このサイトです！)普段は[Next.js](https://nextjs.org/)を使用しwebアプリを作成しているのですが、今回はHugoを使用することを決めました。選定利用としては様々なthemeがあり、利用や切り替えが楽、Markdownによるコンテンツ管理の容易さ、kubernetesのwebサイトで利用されており使ってみたかった点になります。
...

diyページも同様に作成

4. hugoサーバの起動

hugo server

5. ローカルでの起動を確認

ブラウザでhttp://localhost:1313/kei-ta-blog-go/engineerへアクセス home 問題なくページができてることを確認
ブラウザでhttp://localhost:1313/kei-ta-blog-go/engineerへアクセス home

6. GitHub Pagesにデプロイ

このリンク通り行うとデプロイできます。 ブラウザでhttps://kei-ta.github.io/kei-ta-blog-go/へアクセス home