2026-03-02
ポートフォリオにブログ機能を追加しました
ブログ機能の追加
ポートフォリオサイトに, 記事を書いて公開できるブログ機能を追加しました.
これまではWorksやSkillsといった静的な情報だけだったので, 開発で得た知見をアウトプットできる場所が欲しくなり, 記事セクションを作りました.
技術的な仕組み
Markdown → HTML 変換
記事はMarkdownで書き, Pythonスクリプトで静的HTMLに変換しています. 外部パッケージは使わず, Python標準ライブラリのreとosだけで実装しました.
変換処理の流れは以下のとおりです.
- Markdownファイルを読み込み
- フロントマター（YAML形式のメタデータ）をパース
- 本文を正規表現ベースでHTMLに変換
- テンプレートHTMLに埋め込んで記事ページを生成
- トップページの記事一覧を日付降順で更新
フロントマターのパース
各記事ファイルの先頭に --- で囲んだメタデータブロックを記述し, タイトル・日付・概要を管理しています.
---
title: 記事のタイトル
date: 2026-03-02
description: 記事の概要
---
これを正規表現で抽出し, キーと値のペアに分解しています. フォーマットを単純なkey: valueに限定しているので, YAMLパーサーなしでも安全にパースできます.
正規表現ベースのMarkdownパーサー
markdownライブラリなどは使わず, 自前で簡易パーサーを書きました. 対応している記法は見出し（##〜######）, 段落, リスト（-や1.）, コードブロック, インライン要素（太字・斜体・インラインコード・リンク・画像）, 引用です.
処理は1行ずつ走査するステートマシン的なアプローチで, 「今コードブロックの中にいるか」「リストの途中か」といった状態を追跡しながら変換しています.
なぜ自前実装にしたのか
一番の理由は, Pythonさえあればどこでも動くようにしたかったからです. 外部パッケージに依存すると環境構築が面倒になります. もう一つは, 変換ロジックがブラックボックスにならないこと. ブログ記事に使う記法は限られているので, フル機能のパーサーは要りません.
テーブルやネストしたリストには対応していませんが, 今のところ困っていません. 必要になったら拡張します.
今後
まずはこの記事のように技術的な話題から書いていくつもりです.