Last updated on

Astroでブログを作った


Astroとは

Astroは、静的サイトジェネレーターの一つで、パフォーマンスに優れたウェブサイトを簡単に作成できます。

Reactや、ReactベースのSSGのような煩雑さがないので、誰でも始めやすいように思います

Islands architectureが特徴で、一部だけReactを使う(挿入する)ことも簡単に可能です。

そのため拡張性が高く、私は重宝しています。近頃はNext.jsのようなIncremental buildが実験的にサポートされるなどしています。これにより、大規模でより頻繁な更新があるなウェブサイトでもビルドを高速にできるため、期待を寄せています

ブログを作ってみる

公式のチュートリアルが大変充実しているので、始めてAstroやSSGに触れる方はこちらを参照してください。

npm create astro@latest

ディレクトリを作成 -> Blog Templateを選択 -> Install dependenciesは Yes ->Initialaze a new git repoはお好みで

以上で少し待てば、自分の指定したディレクトリにAstroのブログテンプレートが配置されています

cd YOUR_DIRECTORY
npm run dev

で開発サーバーが立ち上がるので、あとはいつもと同じように開発をするだけ。もちろんホットリロードもあります

今後の予定

開発に際して、考えたことや困ったことはここにまとめる習慣を付けたいと思います。

現状、新しい記事を書くときはmdで入稿してGitHubにpushしてサーバーでpullしてnpm run buildをしないといけないので、少しめんどくさいです

暇なときに、以前よりお世話になっているmicroCMSさんでヘッドレスCMSを構築する予定です。

mdで入稿してpushしたらGitHub ActionsやGit Hooksでビルドを自動化してもいいのですが、スマホから記事を書くのがめんどくさいのでmicroCMSを利用します

対応したら、記事にして追記したいと思います。

追記: 移行して書きました -> microCMSをAstroで使う

読んでいただき、ありがとうございました