269 文字
1 分
このサイトの技術構成

概要#

  • Astro製の静的ブログ
  • GitHub Actionsで自動ビルド&デプロイ
  • Cloudflare Pagesで配信

全体像#

masterブランチにpushすると後はGitHub Actionsが自動でビルドとデプロイを行ってくれる。

%%{init: {"flowchart": {"nodeSpacing": 60, "rankSpacing": 70}} }%% flowchart LR yamaemon@{ img: "/images/profile-avatar.png", label: "", pos: "t", h: 72, constraint: "on" } subgraph githubArea["GitHub"] repo[("リポジトリ")] actions["GitHub Actions"] repo -->|workflow 起動| actions end subgraph cloudflareArea["Cloudflare"] pages["Cloudflare Pages"] end visitor(["訪問者"]) yamaemon -->|master push| repo actions -->|自動デプロイ| pages pages -->|配信| visitor classDef actor fill:#e0e7ff,stroke:#6366f1,color:#111827 classDef github fill:#f3f4f6,stroke:#111827,color:#111827 classDef cloudflare fill:#ffedd5,stroke:#f97316,color:#111827 class visitor actor class repo,actions github class pages cloudflare

この構成の利点#

安い#

よほどアクセスが集中しない限りサーバー代は無料なので現状ドメイン代くらいしかかかっていない。
Cloudflareは pages.dev のサブドメインを無料で貸してくれるのでドメイン代すらケチることも可能。

セキュア#

WordPressみたいにウェブ上に管理画面がないので乗っ取られるリスクが少ない。

運用が簡単#

ブログ更新作業は記事を書いて master に push するだけ。
サーバーレスなのでサーバー管理も不要。
Githubに全データが残るのでバックアップも不要。

記事を共有
このサイトの技術構成
https://yamaemon.dev/posts/site-architecture/
作者
やまえもん
公開日
2026-07-04
ライセンス
CC BY-NC-SA 4.0