Piniaを使ってNuxtアプリの状態を共有をする
全てのアプリケーションに当てはまるものではありませんが、規模の大きなアプリケーションではどこからでもアクセスできる中央集権的なストアがほしくなってきます。 今回はNuxtを使って、Vueの状態管理ライブラリとして推奨されているPiniaの使い方を簡単に紹介したいと思います...
記事を読むLume入門(第4回) - ページ部品をコンポーネント化して再利用する
前回は、Lumeのタグ管理を使ってページの検索性を高める方法をご紹介しました。 ここでは、SearchプラグインやPaginateプラグインを使ってタグの一覧ページを作成しました。 今回はUIの部品化と再利用がテーマです...
記事を読むLume入門(第3回) - ページをタグ管理して検索性を高める
前回はLumeのテンプレートエンジンとしてJSX/MDXプラグインを使用する方法を見てきました。 サイト運営が順調でページが増えてくると、目的のページを探すのが辛くなってきます。 こんなときは、ページにタグ(目印)を付けて検索性を高める手法がよく使われますね...
記事を読むLume入門(第2回) - テンプレートエンジンとしてJSXとMDXを使う
前回はLumeの基本的な使い方を見てきました。 ここではテンプレート言語として、ビルトインで使えるマークダウンとMozillaのNunjucksを使いました。 ただ、マークダウンとは違い、Nunjucksはあまり世の中に浸透しているとは言えず(たいしたことはないですが)学習コストも発生します...
記事を読むLume入門(第1回) - Denoベースの静的サイトジェネレーターLumeで静的サイトを手早く作る
当サイトもそろそろ開設から2年になろうとしています。 これを機(?)に、ページ生成に使っていた静的サイトジェネレーター(SSG)をLumeに変更しました。 以前はサイトの生成にEleventy(11ty)を使っていました...
記事を読むAWS LambdaでAWS AppConfigのフィーチャーフラグを使う
アプリケーションの機能リリースでフィーチャーフラグ(またはフィーチャートグル)を使うことは結構多いかと思います。 このフィーチャーフラグの実装方法としては、単純に環境変数やパラメータで指定するものから専用のマネージドサービスを使うものまで幅広い選択肢があります...
記事を読むVue3ベースのバリデーションフレームワークVeeValidate(v4)を使う
Vue2ユーザーの皆さん、Vue3への移行はお済みでしょうか?[1] 今回はこの移行で悩ましいバリデーションフレームワークのお話です。 Vueで代表的なバリデーションフレームワークと言えばVeeValidateがあります...
記事を読むTypeScript v5.2で導入されるusing宣言とDecorator Metadataを使ってみる
少し前にTypeScript v5.2のベータバージョンがリリースされました。 Announcing TypeScript 5.2 Beta いくつか注目機能の導入がありましたので、試してみた結果をご紹介します...
記事を読むGitHub Actions を AWS CodeBuild で実行する
代表的なCI/CDサービスの1つになったGitHub Actionsですが、その大きな強みの1つにエコシステムの充実度があげられます。 GitHub マーケットプレイスを覗くと、数多くのActionsが公開されており、様々なツール・サービスとの統合が簡単にできるようになっています...
記事を読むNuxt版のServer Componentsでサーバー環境限定でレンダリングする
Server Componentsと言えば、React[1]やNext.jsのApp Router[2]を思い浮かべる方が多いと思います。 特に、Next.jsのApp RouterはデフォルトでServer Componentsが適用されるので、今後目にするケースが増えていくことと思います...
記事を読む