🚀 ブログ作成の経緯

こんにちは！この記事では、私がどのようにしてこのブログを作成したのか、その背景と技術的なポイントをご紹介します。

✨ なぜこの方法を選んだのか？

  • サーバー構築の手間をかけずに、無料でブログを作りたい！
  • 記事はシンプルに、普段使っているMarkdownでサクサク書きたい！
  • 普段使っているツール（VSCode）だけでブログを更新したい！

記事のデザインや装飾に時間をかけるよりも、とにかく「素早く書いて、すぐ公開する」ことを目指しました。普段のメモもMarkdownで書いているので、その流れのまま記事を書けるのがとても快適です。

🛠️ 採用した技術たち

  • Pelican 4.11.0 - MarkdownからHTMLを生成してくれる静的サイトジェネレーター。
  • Python 3.10.7 - Pelican を動かすためのエンジン。
  • Google Analytics - ウェブサイトのアクセスを分析するツール。
  • GitHub Pages - 生成したブログを無料でホスティング。
  • Git - GitHubに生成したブログファイルをアップロード。
  • VSCode - 記事の編集と記事の公開操作。

この3つの組み合わせで、シンプルかつ強力なブログ環境が完成しました！

📝 Pelican って何？

Pelicanは、MarkdownファイルからHTMLを自動生成してくれる便利なライブラリです。難しい設定は不要で、簡単なコマンドだけで記事をブログとして公開できます。

📦 インストール

まず、Pythonの仮想環境を作成します。

python -m venv venv
.\venv\Scripts\activate  # Windowsの場合
source venv/bin/activate  # macOS/Linuxの場合

次に、PelicanとMarkdownサポートをインストールします。

python -m pip install "pelican[markdown]"

または、requirements.txtファイルを作成し、以下の内容を追加します。

pelican[markdown]

そして、以下のコマンドでインストールします。

pip install -r requirements.txt

⚡ 記事の生成

Markdownファイルを書いたら、以下のコマンドでHTMLを生成します。

pelican content

これで output フォルダに静的なHTMLファイルが生成されます。あとはこれをGitHubにアップロードするだけ！

🌐 ローカルサーバーでのプレビュー

生成されたHTMLをローカルで確認するために、以下のコマンドを使用してローカルサーバーを起動します。

pelican --listen

これで、ブラウザで http://localhost:8000 にアクセスすると、生成されたブログをプレビューできます。

🎨 テーマのカスタマイズ

ブログの見た目を変えるのも簡単！

  1. テーマの入手: 公式テーマギャラリー から好きなテーマを選びます。
  2. テーマの配置: themes フォルダ内にクローンします。
cd themes
git clone https://github.com/22decembre/dev-random3.git
  1. pelicanconf.py** にテーマを指定:**
THEME = 'themes/dev-random3'

これだけで、ブログの見た目がガラッと変わります！

ただし、所々フランス語だったり文字も見づらかったのでtemplates内にあるCSSやテンプレートのHTMLを少し編集して見た目をカスタマイズしました。

🌐 GitHub Pages での公開

GitHub Pagesを使うことで、サーバー不要＆無料でブログを公開できます。

🚀 手順

  1. GitHubでリポジトリを作成: username.github.io という名前で新規リポジトリを作成します。
    • usernameは自分のGitHubアカウント名
  2. ファイルをプッシュ: 生成したHTMLファイルを gh-pages ブランチにプッシュします。
cd output
git init
git remote add origin https://github.com/username/pakhuncho-blog.git
git add .
git commit -m "Initial blog deployment"
git branch -M gh-pages
git push -u origin gh-pages
  1. GitHub Pagesの設定:
  2. GitHubの「Settings」→「Pages」へ移動。
  3. Source を gh-pages ブランチに設定。

これで、以下のURLでブログが公開されます。

https://username.github.io/pakhuncho-blog/

🎯 まとめ

  • Markdownで素早く記事を書く
  • Pelicanで簡単にHTMLを生成
  • GitHub Pagesで無料公開

このシンプルな流れで、誰でもすぐに自分のブログを持つことができます！