すべての記事

Untitled

GitHubにプッシュするだけのブログ量産システム

Qiita/Zenn統合、自動サイトマップ、インタラクティブHTML──30時間で構築した自動化基盤


なぜこのシステムが必要だったのか

私は17年間、製造業でエンタープライズPMとして「技術的に完成したPoC」を「安定稼働するProduction」に移行させる仕事をしてきた。 そこで学んだ最も重要な原則は、「個人の努力に依存しない構造を作る」ということだ。

コンテンツ発信の構造的課題

  • プラットフォームが分散:Qiita、Zenn、個人ブログ、note...
  • 転載の手間:複数サイトにコピペ
  • SEO効果の分散
  • 運用負荷:サイトマップ更新、インデックス管理、デザイン調整...
「技術ブログを始めよう!」→ WordPressセットアップ → プラグイン設定に2日 → デザイン調整に3日 → 疲れて記事を書かない → 放置

私が求めていたのは、「思考から公開まで」の摩擦をゼロにするシステムだった。


理想のフロー:
アイデア → HTML作成 → GitHub push → 2-3分で公開完了
                        ↑
                   摩擦がほぼゼロ
    

アイデアの核心:3つの設計思想

1. 外部プラットフォームを「読み込む」発想

「記事を書く場所」ではなく「記事を集約する場所」を作る。
QiitaやZennの記事を自動取得して統合。プラットフォーム追加も容易。
従来このシステム
記事インデックスの更新HTMLファイルを置くだけで自動検出
サイトマップ生成ビルド時に自動生成
外部記事の転載prebuildで自動取得・統合
デプロイ作業GitHub push → Vercel自動デプロイ
メタデータ設定Frontmatterに書くだけ

2. 記事管理の自動化

記事は「ファイルを置くだけ」。管理コストはゼロ。


/content
  ├── 2026-01-20-web-components-guide.html
  ├── 2026-01-15-redis-lock-guide.html
  └── ...
    

3. サイトマップ自動生成


export default async function sitemap() {
  const posts = await getAllPosts();
  const external = await getExternalArticles();
  return [...];
}
    

4. インタラクティブHTMLコンポーネント

  • FadeIn
  • CalloutBox
  • PoCTimeline
  • DecisionFlow
  • ComparisonCard
  • InteractiveChecklist

得られた価値:投資対効果

開発コスト vs 得られた価値

指標従来このシステム
記事公開までの時間数時間〜数日2-3分
プラットフォーム横断作業手動転載自動統合
サイトマップ更新手動自動
SEO管理分散一元化
運用コスト継続発生ほぼゼロ

技術的な学び

  • App Router採用は正解
  • prebuild cacheでAPI制約回避
  • HTMLで表現力確保
  • CSS Modulesで安定化

このシステムの本質的価値

これは「思考の外部化と発信を最小限の摩擦で実現するプラットフォーム」だ。

  1. 個人依存を排除
  2. 自動化できるものは全て自動化
  3. 摩擦を最小化

今後の拡張可能性

  • タグフィルタ
  • 全文検索
  • コメント
  • アナリティクス

まとめ:アイデアから生まれた価値

  • 外部プラットフォームを読み込む
  • 全自動化
  • インタラクティブ性
「書く」ことに100%集中できる環境を手に入れた。