Toshiです。 東京でソフトウェアエンジニアをしています。 このブログでは技術、キャリア、プライベートなどジャンルにこだわらず、雑多なものを発信していきたいと思います。 この初めての投稿ではこのブログサイトを作って公開するまでを紹介します。

Astro について

このブログは Astro で作成しました。 Astro を使えば、マークダウンファイルを使って簡単にブログを書くことができます。 このブログでは Blogs というテーマを使っています。

Astro のセットアップ

Install Astro の説明に従って Astro をセットアップします。 --template は自分の好きなものを選んでください。

pnpm create astro@latest --template blog

./src/content/blog にブログのための markdown ファイルがあるので内容を書きます。

pnpm dev でローカル環境を立ち上げて内容を確認します。

Cloudflare Workers に公開する

wrangler をインストールします。

pnpm add -D wrangler

Cloudflare にログインします。

pnpm exec wrangler login

wrangler.jsonc を package.json と同じディレクトリに配置します。

{
    "name": "my-blog",
    "compatibility_date": "2026-01-01",
    "assets": {
        "directory": "./dist"
    },
    "routes": [
        {
            "pattern": "example.com/*",
            "zone_name": "example.com"
        }
    ]
}

Astro のサイトをビルドします。

pnpm build

Cloudflare Workers にデプロイします。

pnpm exec wrangler deploy

これでデプロイ完了です🚀 ブラウザを使ってアクセスしてみましょう。

コマンド 1 つでビルドとデプロイをする

package.json にビルドとデプロイを一つにしたコマンドを登録しておくと、簡単に更新することができます。

{
    "scripts": {
        "deploy": "astro build && wrangler deploy"
    }
}

まとめ

今回は Astro を使ってブログサイトを作り、公開するところまでを紹介しました。 今は非常にシンプルな作りになっていますが、これからデザインのカスタマイズやコメント機能の追加などもやっていきたいと思います。 興味を持っていただけたら、X をフォローしてもらえると嬉しいです。 ありがとうございました。