複数ソースから集めて作る自分サイト

複数ソースから集めて作る自分サイト Daisuke KONISHI Me too Astro #1

Daisuke KONISHI エンジニアリングマネージャー Web エンジニアコーヒーとラーメンでできています @skd_nw

自分のサイト持ってますか • ポートフォリオ • ブログとかとか

何で作ってますか？ • Astro • WordPress • STUDIO • Notion •
何かしらのフレームワーク • その他

これまで色々経由して作ってきました 1. HTML/CSS/JavaScript 2. WordPress 3. Hugo (たしかやった) 4. Next.js
(SSG) 5. Astro

「静的サイトの形で配信したい」にたどり着いている • あまり内容の更新がない • なるべく面倒を見なくていい状態にしたい • 未来で乗り換える可能性はあるのでデータは別で持っていたい • 自分がある程度書けてメンテ出来そうなものにしておきたい A.
Astroで。

1.技術ブログを書いているのでその内容を取得・表示 2.個人開発したものを取得・表示経歴を取得・表示 (今は見せ方の再検討中で閉じてます)

1.ブログ記事

1.ブログ記事の取得記事本文は不要で、タイトルとリンクだけあればOK • ブログは別途Next.jsで実装しています • 記事データはmicroCMSで管理していますが、Next.jsを経由して取得するようにしています • Next.jsからRSSを配信してAstroはこれを取得・パースして表示している

1.自サイト側でのブログ記事の更新どうするか • 今は… ◦ 気が向いた時のビルド ◦ 定期的に行っているパッケージアップデートを反映するタイミングでビルド • そこまで高頻度で更新しているわけではないので、ある程度ラグがあって
もOK

1.自サイト側でのブログ記事の更新どうするかなるべくリアルタイムで更新するなら... • microCMSのWebhookを利用する • AstroでSSRする • Astro IslandでReactなどを活用してCSRする

2.個人開発したものを取得・表示 • 個人開発の実績データはmicroCMSで管理しています • こちらは特に捻り無くAstroから取得しています

基本的にはSSGにしている • なるべく管理したくないので。 • 各所からデータ取得を行っているが、シークレットやデータ取得量の問題をあまり気にしなくて良くなるのが大きい • ビルドで処理が終わっているので、とても早くページを届けられる (早いは正義)

Astroでやるのって結局どうなのか • 運用し始めてからは、考えることがぐっと減って良い • Node.jsの豊富なエコシステムを使えるので、何かしようと思ったときに楽 • ちょっとJSを書こうと思うとちょっと気持ちのハードルがあがる

まぁやってみようよ

複数ソースから集めて作る自分サイト

複数ソースから集めて作る自分サイト

Daisuke Konishi

More Decks by Daisuke Konishi

Other Decks in Programming

Featured

Transcript