Blog

フォームのバリデーションをif文で手書きすると項目が増えるたびにコードが複雑になります。Zodを使うとスキーマで宣言的に書けます。

PlaywrightはE2Eテスト（End-to-End）のツールです。実際のブラウザを動かしてユーザー操作をシミュレートします。Vitestのユニットテストと組み合わせることで、ロジックから画面全体まで幅広くテストできます。

SvelteKitのリンク先読み機能（preload）を整理します。リンクにカーソルを乗せた瞬間にデータを先読みして、ページ遷移を体感的に速くします。

SvelteKitの hooks.server.ts に書く関数を整理します。認証以外の実用的なユースケースも含めて解説します。

Svelte 5のコンテキストAPI（setContext / getContext）を整理します。propsとstoreに続く3つ目の状態共有の方法で、コンポーネントツリー内だけで状態を共有したいときに使います。

SvelteKit + Svelte 5 の環境に Vitest でテストを導入しました。セットアップ時にいくつか躓きポイントがあったのでまとめます。

SvelteKitでは +server.ts を使うとREST APIのエンドポイントを作れます。load 関数や actions ではカバーできない場面で使います。

SvelteKitの load 関数を深掘りします。+page.ts と +page.server.ts の使い分け、parent() で親のデータを受け取る方法、depends と invalidate によるリロードなしのデータ再取得を …

SvelteKitのフォームはデフォルトでフルページリロードして送信されます。use:enhance を使うとリロードなしで送信できるようになります。仕組みと使い分けを整理します。

SvelteKitで迷いやすい +layout.svelte と +page.svelte の役割の切り分けを整理します。