[ CATEGORY / Astro ]

MATCHED_ITEMS: 17
[Astro #17] Astro DB と Actions でサイバーな動的コメント欄を構築
[2026/4/11]

[Astro #17] Astro DB と Actions でサイバーな動的コメント欄を構築

静的な Astro ブログに Astro DB (Turso) と Actions を組み合わせ、訪問者が足跡を残せる動的な BBS コンポーネントを実装しました。415エラーの解決やレイアウトの最適化も解説。
[Astro #16] WebサイトをPWA化してデスクトップアプリ（NAVI）として実在させる
[2026/4/11]

[Astro #16] WebサイトをPWA化してデスクトップアプリ（NAVI）として実在させる

Webサイトを「独立したアプリ」に進化させるPWA化。Astro環境下での vite-plugin-pwa の設定から、手動での Service Worker 登録、エラー解決までの手順と引っかかりやすいポイントを解説します。
[Astro #15] Copland OS： SVG clock 無段階サイズ変更と、SPA特有のバグを攻略
[2026/4/11]

[Astro #15] Copland OS： SVG clock 無段階サイズ変更と、SPA特有のバグを攻略

AstroとNext.jsの混在環境で発生するSPA特有のイベントリスナー重複や、requestAnimationFrameの停止処理など、実戦的なデバッグ手法をまとめました。
[Astro #14] Copland OS風UIの極北：カスタムアナログ時計とコンテキストメニューの実装
[2026/4/10]

[Astro #14] Copland OS風UIの極北：カスタムアナログ時計とコンテキストメニューの実装

Astroプロジェクトに、Copland OSライクなSVGカスタムアナログ時計と右クリック（長押し）メニューを追加。filterプロパティの罠や、localStorageを使った状態保存、シーン切り替え時の表示制御について解説します。
[Astro #13] Astro SSR × Resend × JWT で作るDB不要の「マジックリンク認証」
[2026/4/9]

[Astro #13] Astro SSR × Resend × JWT で作るDB不要の「マジックリンク認証」

総当たり攻撃の脅威から個人ダッシュボードを守るため、AstroとResendを組み合わせてパスワードレス認証（マジックリンク）を導入する具体的な実装手順とハマりどころを解説します。
[Astro #12] 完全自動化！YouTube Data APIで動画リストを取得し、Astroでギャラリーを自動生成する
[2026/4/9]

[Astro #12] 完全自動化！YouTube Data APIで動画リストを取得し、Astroでギャラリーを自動生成する

毎回手動で動画を追加するのは面倒！npm run dev（またはbuild）のタイミングでYouTube APIを叩き、最新の動画リストをJSON化してAstroで表示する自動化ワークフローの備忘録です。
[Astro #11] 自作ダッシュボードへの道：Search Console APIの鍵取得とデータ取得テスト
[2026/4/9]

[Astro #11] 自作ダッシュボードへの道：Search Console APIの鍵取得とデータ取得テスト

Google Search Console APIをAstroから叩くための準備（GCPプロジェクト作成、サービスアカウント発行、GSC連携）と、googleapisを使った最小構成のテストページ実装方法を初心者向けに解説します。
[Astro #10] 5分でBingにインデックス - Webmaster Tools連携とサイトマップ自動生成
[2026/4/9]

[Astro #10] 5分でBingにインデックス - Webmaster Tools連携とサイトマップ自動生成

Google Search Console連携によるBing Webmaster Toolsへの一括登録と、Astroでの自動サイトマップ生成（sitemap-index.xml）の手順を解説します。
[Astro #09] AstroにおけるCSS設計：グローバルCSSの基本とサイバーパンク・スタイリングの実践
[2026/4/9]

[Astro #09] AstroにおけるCSS設計：グローバルCSSの基本とサイバーパンク・スタイリングの実践

Astro初心者〜中級者向けに、CSSのスコープやグローバル化の手順を解説。実際にプロジェクトで使用しているCSSファイルを元に、実践的なスタイリング手法を紹介します。
[Astro #08] Shader パラメータ計算機：静的なブログに 動き を吹き込む
[2026/4/7]

[Astro #08] Shader パラメータ計算機：静的なブログに 動き を吹き込む

Astro と React を組み合わせ、MDX 内で動作する Gerstner Wave パラメータ計算機を構築。client:visible ディレクティブによるパフォーマンス最適化と、サイバーパンク風の UI カスタマイズについて詳しく紹介します。
[Astro #07] HugoからAstroへの移行とビルド最適化・クローリング検証
[2026/4/5]

[Astro #07] HugoからAstroへの移行とビルド最適化・クローリング検証

HugoからAstro + React + MDX環境への移行記録。旧環境からのリポジトリ軽量化、SSGビルド時のOOMエラー対応、MDXパーサーの仕様対応、および移行後のクローリング状況についてまとめる。
[Astro #06] R3Fで構築する3Dサイバーアーカイブの実装録と最適化
[2026/4/1]

[Astro #06] R3Fで構築する3Dサイバーアーカイブの実装録と最適化

R3Fベースの3D動画アーカイブの実装記録。iframeのブラウザプロセス上限対策、MeshReflectorMaterialによる「データの澱み」の表現、およびDOMとWebGLの微小レイヤー構造について解説。
[Astro #05] 一子相伝の「120px」—極限のレスポンシブで最後に笑うのは固定値だった
[2026/3/31]

[Astro #05] 一子相伝の「120px」—極限のレスポンシブで最後に笑うのは固定値だった

Astro移行記第5回。外部CSSの干渉（!important）との戦いと、不完全な「Ver. 0.0.1」で公開に踏み切る開発哲学について。
[Astro #04] レスポンシブの深淵と dvh による画面固定
[2026/3/30]

[Astro #04] レスポンシブの深淵と dvh による画面固定

Astroへの移行中に直面した、モバイル環境特有の表示不具合（アドレスバーの影響や要素の重なり）に対する具体的なCSS解決策と構築のポイントをまとめました。
[Astro #03] Pagefind検索と動的目次（TOC）の実装
[2026/3/28]

[Astro #03] Pagefind検索と動的目次（TOC）の実装

HugoからAstroへの移行最終局面。全記事のビルドエラーを解消し、クライアントサイド検索と自動目次生成機能を導入した開発記録。
[Astro #02] 530件の記事移行とトラブル対処：カテゴリー統合とMDXエラー
[2026/3/27]

[Astro #02] 530件の記事移行とトラブル対処：カテゴリー統合とMDXエラー

532件の全アーカイブをAstroへ最適化。カテゴリー統合、波括弧のエスケープ、そしてUIのレスポンシブ調整までの全工程。
[Astro #01] 環境構築・トラブルシューティングのメモ
[2026/3/26]

[Astro #01] 環境構築・トラブルシューティングのメモ

Windows 環境での Astro 導入時に直面したパス解決エラーや、Hugo 資産移行時に発生した Shiki のパースエラー、ファイル名問題への対処法をまとめました。