https://o-unit.net/tags/ubuntu/ Recent content in Ubuntu on o-unit - ずっと建築中 - Hugo ja Wed, 29 Apr 2026 23:57:03 +0900 https://o-unit.net/homeserver/ Wed, 29 Apr 2026 20:26:14 +0900 https://o-unit.net/homeserver/ https://o-unit.net/homeserver/hugo_install_snap/ Wed, 29 Apr 2026 20:26:14 +0900 https://o-unit.net/homeserver/hugo_install_snap/ <blockquote> <p>当記事はchatGPTの回答をベースに多少の修正を加えて作成されました。</p> </blockquote> <p>自宅サーバのubuntu24.04にspan版のhugoをインストールするまでの手順をメモしました。<br> いわゆる自分用メモです。<br> 今後また自宅サーバのSSDが故障してシステムが全消失した時用。</p> <h2 id="目次">目次</h2> <table> <thead> <tr> <th style="text-align: left"><strong>目次</strong></th> </tr> </thead> <tbody> <tr> <td style="text-align: left">インストール環境の確認</td> </tr> <tr> <td style="text-align: left">snapでHugoをインストール</td> </tr> <tr> <td style="text-align: left">新規サイト作成</td> </tr> <tr> <td style="text-align: left">テーマ導入</td> </tr> <tr> <td style="text-align: left">Hello Worldページ作成</td> </tr> <tr> <td style="text-align: left">ローカルで確認</td> </tr> <tr> <td style="text-align: left">本番ビルド</td> </tr> <tr> <td style="text-align: left">nginxで公開</td> </tr> </tbody> </table> <h3 id="インストール環境の確認">インストール環境の確認</h3> <p>今回インストールする環境は以下の通り。</p> <table> <thead> <tr> <th style="text-align: right"></th> <th></th> </tr> </thead> <tbody> <tr> <td style="text-align: right"><strong>OS</strong></td> <td style="text-align: left">Ubuntu Server 24.04.4 LTS</td> </tr> <tr> <td style="text-align: right"><strong>CPU</strong></td> <td style="text-align: left">Core i7 7700</td> </tr> <tr> <td style="text-align: right"><strong>Memory</strong></td> <td style="text-align: left">32GB</td> </tr> </tbody> </table> <h3 id="snapでhugoをインストール">snapでHugoをインストール</h3> <p>以下のsudo snapコマンドでインストール。<br> インストール後、コマンドが使えるかどうか確認。</p> <div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-text-size-adjust:none;"><code class="language-bash" data-lang="bash"><span style="display:flex;"><span>sudo snap install hugo </span></span><span style="display:flex;"><span>✔ 確認 </span></span><span style="display:flex;"><span>hugo version </span></span><span style="display:flex;"><span>↓こんな感じのメッセージが出てたらOK </span></span><span style="display:flex;"><span>hugo v0.161.0-98d396c16a07b51df06e7673d817a3880da6218d+extended linux/amd64 BuildDate<span style="color:#f92672">=</span>2026-04-28T11:46:32Z VendorInfo<span style="color:#f92672">=</span>snap:0.161.0 </span></span></code></pre></div><blockquote> <p>snap版は通常「extended版」が入るため、SCSSなども使えます。</p> </blockquote> <h3 id="新規サイト作成">新規サイト作成</h3> <p>以下のコマンドでhugoのサイトが新しく作成されます。<br> ホームディレクトリ配下で行うことを推奨。<br> 「my-hugo-newsite」はお好きな文字列でどうぞ。</p> <div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-text-size-adjust:none;"><code class="language-bash" data-lang="bash"><span style="display:flex;"><span><span style="color:#75715e"># (ホームディレクトリ配下で実施)</span> </span></span><span style="display:flex;"><span>hugo new site my-hugo-newsite </span></span><span style="display:flex;"><span>cd my-hugo-newsite </span></span><span style="display:flex;"><span>ls </span></span></code></pre></div><h5 id="-ディレクトリ構成の確認">📂 ディレクトリ構成の確認</h5> <table> <thead> <tr> <th style="text-align: left"></th> <th></th> </tr> </thead> <tbody> <tr> <td style="text-align: left">my-hugo-newsite/</td> <td style="text-align: left"></td> </tr> <tr> <td style="text-align: left">├── archetypes/</td> <td style="text-align: left">記事のテンプレート的なものの場所</td> </tr> <tr> <td style="text-align: left">├── assets/</td> <td style="text-align: left"></td> </tr> <tr> <td style="text-align: left">├── content/</td> <td style="text-align: left">記事を書く場所</td> </tr> <tr> <td style="text-align: left">├── layouts/</td> <td style="text-align: left">自分でテーマに手を加えるときの場所</td> </tr> <tr> <td style="text-align: left">├── static/</td> <td style="text-align: left">画像・CSSなど</td> </tr> <tr> <td style="text-align: left">├── themes/</td> <td style="text-align: left">配布されているテーマを格納する場所</td> </tr> <tr> <td style="text-align: left">└── hugo.toml</td> <td style="text-align: left">設定ファイル</td> </tr> </tbody> </table> <h3 id="テーマ導入">テーマ導入</h3> <p>Hugoはテーマがないと見た目がほぼ空です。<br> ここではシンプルなテーマ「Ananke」を使います。</p>