SvelteKitでi18n(国際化・多言語対応)を実装しました。まずシンプルな実装で概念を理解し、本番向けのアプローチも紹介します。
ブログを書き続けていると、記事が増えてきたときに「あの記事どこだっけ?」となるのが悩みでした。 とくにSvelteKitやCloudflare関連の記事は、シリーズとして順番に読んでほしいものが多く、ブログの新着順一覧では体系がわかりにくい …
Drizzle ORMの relations を使うと、テーブル間の関係を定義してシンプルなコードで結合データを取得できます。posts と comments を例に実装しました。
WebSocketを使うと、一度接続したら切断するまで双方向にリアルタイムで通信し続けられます。SvelteKit + Cloudflare Workersでエコーサーバーを実装しました。
drizzle-kitを使ってマイグレーションを生成し、Cloudflare D1に適用する方法と、seed.sqlで初期データを流し込む方法をまとめます。
Drizzle ORMはTypeScript向けの軽量ORMです。platform.env.DB.prepare('SELECT ...') と書いていた生SQLを、型安全なTypeScriptのコードに置き換えられます。今回は既存 …
Cloudflare Queuesを使うと、処理を非同期でバックグラウンド実行できます。重い処理をQueueに投げることで、ユーザーを待たせずにレスポンスを返せます。
Svelte 5では $state でオブジェクトや配列をリアクティブにできますが、Map や Set は .set() や .add() などの操作では画面が更新されません。これを解決するのが svelte/reactivity のクラス …
Svelte 5の $inspect を使うと、リアクティブな値($state や $derived)が変化するたびに自動でコンソールにログを出力できます。console.log を手動で仕込む必要がなくなります。
ResendはシンプルなAPIでメール送信できるサービスです。無料枠で月3,000通まで送れます。SvelteKit + Cloudflare Workersとの組み合わせでお問い合わせフォームを実装しました。