エンジニアの裏庭

ご挨拶 本ブログの最初の投稿。 地方の大学を中退後、ものの見事に就活に苦戦し、フリーランスエンジニアとして独立し、なんとか生き延びてきた私。 前々から、何かしらアウトプットをしなければとは考えていたものの、重い腰が上がらず数年が経過。。。 ふと思い立ち、このブログを作ろうと考えたのが、2025/04/18(翌日が30歳の誕生日。20代最後の日)である。 本業でも行なっている、バックエンドエンジニア(フルスタックに片足をツッコミ気味), DevOps関連の投稿や、 趣味で行なっている、電子工作, 自宅サーバー, 3Dプリンタに関しての投稿も行いたい。 個人的な偏見だとも思うが、理系の技術職として、ふわっとした感じに受け取れる"です・ます調"の記載に気持ち悪さを感じる為、“である調"での記載をさせていただく。 ご容赦いただきたい。 本投稿のはじめに このブログは、静的サイトジェネレーターの「Hugo」を使用して構築されている。この記事では、ブログの技術的な構成、使用しているツール、ワークフロー、こだわった点などについて解説する。Hugoに興味がある方や、半年後の自分の参考になれば幸いである。 テーマは、とりあえずで入れて、後々気に入らなければ変えれば良い程度で、適当に人気そうなものを採用した。初期構築には、最近本業の方でも積極的に利用が進められているcline+claude3.7の力を大いに借りた。(あまり細かいconfigが分かっていないので、ゆくゆくチューニングしていく予定。) 技術スタック このブログは以下の技術スタックで構成されている： 静的サイトジェネレーター: Hugo テーマ: PaperMod ホスティング: Cloudflare Pages 開発環境: Node.js (v22.14.0) バージョン管理: Git Hugoについて Hugoは、Go言語で書かれた高速な静的サイトジェネレーターである。以下の特徴がある： 高速なビルド: 数千ページのサイトでも数秒でビルド可能 クロスプラットフォーム: Windows、macOS、Linuxで動作 テーマ: 豊富なテーマが利用可能 Markdown: コンテンツはMarkdown形式で記述 ショートコード: 拡張機能を簡単に追加可能 はまりポイント 最初は、Hugoをhomebrew経由でインストールした(最新であった0.146.3)のだが、何故か本番ビルドの際にエラーで転けた。 しばらく彷徨った結果、直近のHugoのバージョンアップによる問題であることが判明。 (PaperModのレポジトリでIssueが上がっていた) その為、どうせ他でも使うだろうとの目論見も含めて、npm経由でHugoを導入することにした。(私は自称、熱心なnode信者である。) https://www.npmjs.com/package/hugo-extended 素敵なことに、npmのパッケージのバージョンとHugoのバージョンが一致している模様。 前述のIssue内にあった情報をもとに、一つ前のマイナーバージョンである、0.145.0を導入。 既に修正PRは作成されているので、マージされたらどこかのタイミングでアップデート予定 にしても、ブログを始めようとして、初っ端からハマるとは幸先の悪い。。。 プロジェクト構造 このブログのプロジェクト構造は以下のとおりである： blog.untan.tech/ ├── archetypes/ # 記事のテンプレート ├── assets/ # SCSS, JS, フォントなどのアセット ├── content/ # ブログコンテンツ │ ├── posts/ # 記事ファイル │ ├── archives.md # アーカイブページ │ └── search.md # 検索ページ ├── data/ # Hugoデータファイル ├── layouts/ # カスタムレイアウト（必要に応じて） ├── static/ # 画像などの静的ファイル ├── themes/ # テーマ │ └── PaperMod/ # PaperModテーマ ├── _scripts/ # カスタムスクリプト ├── hugo.toml # サイト設定ファイル └── package.json # npm設定ファイル 設定ファイル（hugo.toml） Hugoの設定はHugo.tomlファイルで管理している。主な設定項目は以下のとおりである： ...