はじめに
WordPressで運営していたブログをAstro + Cloudflare Pagesに移行しました。本記事では、技術スタック、選定理由、コンテンツ管理方法、運用コストなどをまとめています。
対象者
この記事は下記のような人を対象にしています。
- WordPressからの移行を検討している方
- 静的サイトジェネレーターに興味がある方
- ブログの運用コストを抑えたい方
- 技術ブログを運営しているエンジニアの方
なぜ移行したのか
WordPressは長年使ってきましたが、いくつかの課題を感じていました。
- セキュリティ: プラグインの脆弱性対応が煩雑
- 運用コスト: サーバー代が毎月かかる
- カスタマイズ性: テーマの制約でデザインが限定的
ブログを一時休止していた期間があり、再開するタイミングで根本から見直すことにしました。
技術スタック
Astro（静的サイトジェネレーター）
選定理由:
- パフォーマンス: JavaScriptを最小限に抑えた静的HTML生成
- コンテンツファースト: Markdownでの記事執筆に最適化
- 柔軟性: React/Vue/Svelteなど好きなUIフレームワークを部分的に使える
- 開発体験: ホットリロードが速く、ビルドも高速
Astroは「コンテンツ重視のサイト」に特化しており、ブログとの相性が良いですね。デフォルトでJavaScriptをゼロにできるため、表示速度が圧倒的に速いです。
Cloudflare Pages（ホスティング）
選定理由:
- 無料枠が充実: 月500ビルド、帯域無制限
- グローバルCDN: 世界中のエッジサーバーから配信
- 自動デプロイ: GitHubにpushするだけで公開
- SSL自動設定: カスタムドメインでも無料でHTTPS化
Vercel、Netlifyも候補でしたが、Cloudflareは無料枠の制限が緩く、CDNの性能も高いため選択しました。
GitHub（ソースコード管理）
選定理由:
- バージョン管理: 記事の変更履歴を追跡可能
- バックアップ: コードとコンテンツが自動的にクラウドに保存
- CI/CD連携: Cloudflare Pagesとの自動デプロイ
コンテンツ管理
Markdownファイルで記事を管理
src/content/blog/
├── 20260121.md ← この記事
├── 20260118.md
├── 20260110.md
└── ...
各記事はMarkdownファイルとして管理しています。frontmatterでタイトル、日付、カテゴリなどのメタ情報を記述します。
---
title: "記事タイトル"
description: "記事の説明"
pubDate: "2026-01-21T12:00:00+09:00"
heroImage: "/images/example.jpg"
categories: ["IT"]
---
本文をMarkdownで記述...
ローカルでの執筆フロー
npm run devで開発サーバー起動- Markdownファイルを作成・編集
- ブラウザでリアルタイムプレビュー
git pushでCloudflare Pagesに自動デプロイ
エディタはVS Codeを使用しています。Markdown Preview Enhancedなどの拡張機能で執筆体験が向上しますね。
この構成のメリット
1. 表示速度が圧倒的に速い
静的HTMLを配信するため、サーバーサイドの処理が不要です。Cloudflare CDNで世界中のエッジから配信されるため、どこからアクセスしても高速ですね。
2. セキュリティリスクが低い
データベースもサーバーサイドのコードもないため、攻撃対象となる脆弱性が少ないです。WordPressのようにプラグインのアップデートを気にする必要がありません。
3. 自分でデザインを完全にコントロールできる
Astroのコンポーネントシステムを使って、サイトのデザインを一から構築できます。テーマの制約に縛られず、好きなUIライブラリやCSSフレームワークを組み合わせられますね。
今回は自分でレイアウトやスタイルを設計し、ブログのブランディングに合わせたデザインを実現しました。
4. 運用コストがほぼゼロ
静的サイトなのでサーバーが不要です。Cloudflare Pagesの無料枠で十分運用できます。
5. 記事がテキストファイルとして残る
Markdownファイルなので、将来別のプラットフォームに移行する際もデータの移植が容易です。ロックインされない安心感がありますね。
6. Gitでバージョン管理
記事の変更履歴が残り、いつでも過去の状態に戻せます。誤って記事を消しても復元可能です。
月額コスト比較
| 項目 | WordPress（以前） | Astro + Cloudflare（現在） |
|---|---|---|
| サーバー代 | 約1,000円/月 | 0円 |
| ドメイン代 | 約1,500円/年 | 約1,500円/年 |
| SSL証明書 | サーバー込み | 無料（Cloudflare） |
| CDN | なし or 有料 | 無料（Cloudflare） |
| 月額合計 | 約1,100円 | 約125円（ドメインのみ） |
ドメイン代以外はすべて無料で運用できています。年間で約12,000円の節約になりました。
移行時の注意点
URLの変更
WordPressのパーマリンク構造（/archives/123など）からシンプルなパス（/blog/20260121）に変更しました。旧URLからのリダイレクトは必要に応じて設定します。
画像の移行
WordPressのメディアライブラリから画像をエクスポートし、パスを調整する作業が必要でした。
コメント機能
静的サイトにはコメント機能がないため、必要であればDisqusなどの外部サービスを検討します。今回は不要と判断して省略しました。
おわりに
本記事では、WordPressからAstro + Cloudflare Pagesへの移行について、技術スタック、選定理由、コンテンツ管理方法、運用コストなどをまとめました。
移行により、表示速度、セキュリティ、運用コストが大幅に改善されました。自分でデザインをコントロールできる点も大きなメリットですね。
技術ブログを運営するエンジニアにとって、この構成はおすすめできます。Markdownで記事を書く習慣があれば、移行のハードルも低いです。
この記事がどなたかの参考になれば幸いです。
技術スタック:
- Astro 4.x
- Cloudflare Pages
- GitHub