Vue3+D3.js アプリを Nuxt3 に移植して Netlify にデプロイしてみた
「Vue 3 と D3.js で作る可視化アプリ」の記事では、D3.js を使った可視化のための簡単な Web アプリを Vue3 の SPA で作成しました。 Nuxt3 への移植 # Vue3 がなんとなく分かった気がしたので、次に Nuxt3 への移植にトライしました。 --> Information豆蔵デベロッパーサイトには Nuxt3 の充実した入門記事があります。以下のインデックスページからどうぞ...
記事を読むNuxt3で導入されたハイブリッドレンダリングとNuxt版ISG/ISRを試してみる
これは、豆蔵デベロッパーサイトアドベントカレンダー2022第18日目の記事です。 今年春にRCバージョンとなったNuxt3は、先月(2022-11-16)ようやく安定バージョンとなりました。 Announcing Nuxt 3.0 stable Nuxt3の目玉機能の1つとしてハイブリッドレンダリングがあります。 以下公式ドキュメントからの引用と機械翻訳結果です...
記事を読むNetlify Split TestingでGitブランチベースのA/Bテストをする
不特定多数のユーザーに公開するWebサイトでは、UI/UXの改善がエンゲージメントやコンバージョン等の指標に良い影響があるのかは、実際に公開してみないと分からないことが多いかと思います。 ここでよく利用されるリリース戦略はA/Bテストです。 運用中のバージョン(Aパターン)に加えて、変更後のサイト(Bパターン)を同一ドメインで並行して公開し、Cookie等の値を利用して一定の割合でBパターンにもリクエストを振り向けます...
記事を読むNetlifyのLighthouseプラグインでWebサイトのメトリクスを継続的に評価する
Webサイトはそのローンチ後も続々と機能追加やデザイン適用が実施され、変化していくのが一般的です。 変更の中にはパフォーマンスやアクセシビリティの低下を招くものもあるかもしれません。 このような状況にならないよう、様々な側面からWebサイトを最適な状態に維持・改善していくことは重要なテーマです。 Webサイトを定量的に評価するサービスは多くありますが、無料で使えるLighthouseは多くのプロジェクトで採用されていると思います...
記事を読むEleventyで生成したサイトでNetlify Edge Functionsを使ってみる
一般的にサイトジェネレータで作成したサイトは、特定の場所に静的リソースを配置し、CDN経由で配信することが多いかと思います。 昨今はNext.jsやNuxt等のハイブリッドフレームワークを使って、サーバーサイド側でページを生成するSSR（Server Side Rendering）も増えてきていますが、やはり静的リソースのみを配置するスタイルは何かと開発・運用しやすいと思います...
記事を読むNetlify Identityを使ってNetlify CMSのユーザー認証をする
以前に以下の記事でNetlify CMSを使ったコンテンツ管理をご紹介しました。 Netlify CMSのワークフローでコンテンツ管理をする この記事ではGitHubのOAuth認証を使用して、ユーザーがブログ投稿をできるようにしました。 当サイトにおいても、記事の投稿をNetlify CMSでも作成、公開できるようにしました。この記事自体もNetlify CMSを使って作成しています。 CMSを使うのはいいですが、これを操作して誰でも投稿できる状態は望ましくありません...
記事を読むNetlify CMSのワークフローでコンテンツ管理をする
当サイトも記事数が180を超え、執筆者も増えてきました。 現状はGitHubをNetlifyと連携させることで、プルリクエスト経由で記事公開をしてきました。 これでも問題はないのですが、そろそろCMS的な仕組みでGitに不慣れな人でも簡単に記事作成やサイト自体の設定変更ができないかなと思い始めました。 世の中的には、ヘッドレスCMSが流行っていると思います。 ヘッドレスCMSはWordPressのようにフロントエンド向けのUIを提供せずに、単純なコンテンツ管理機能のみを提供します...
記事を読むDeno Deploy を基盤とする Netlify Edge Functions を試す
Netlify では、AWS Lambda を利用したサーバーレス機能 Functions が従来から提供されていました。 Functions overview 今年の4月 Netlify Edge Functions ベータ版についての発表が Netlify と Deno からありました...
記事を読む
