Cloudflare on じるラボ

家計簿アプリを作る #15：再デプロイと最新月の自動選択

Mon, 15 Jun 2026 00:00:00 +0900

家計簿アプリ作成シリーズの第15回です。ここまでの実装を Cloudflare Pages に再デプロイし、あわせてログイン直後に最新月が自動選択される UX 改善を実装します。

家計簿アプリを作る #9：Cloudflare Pages へのデプロイ

Tue, 09 Jun 2026 00:00:00 +0900

家計簿アプリ作成シリーズの第9回です。今回は Cloudflare Pages へのデプロイを行います。ハマりポイントが多かったので詳しくまとめます。

家計簿アプリを作る #8：ログイン・ログアウトの実装

Mon, 08 Jun 2026 01:00:00 +0900

家計簿アプリ作成シリーズの第8回（後編）です。前回に引き続き、ログイン・ログアウトを実装します。

家計簿アプリを作る #7：Better Auth のセットアップ + サインアップ実装

Mon, 08 Jun 2026 00:00:00 +0900

家計簿アプリ作成シリーズの第7回（前編）です。今回は Better Auth を使った認証の土台を作り、サインアップまでを実装します。

家計簿アプリを作る #6：収支の編集を実装する

Wed, 03 Jun 2026 02:00:00 +0900

家計簿アプリ作成シリーズの第6回です。今回は登録済みの収支データを編集できるようにします。

家計簿アプリを作る #5：収支の削除を実装する

Wed, 03 Jun 2026 01:00:00 +0900

家計簿アプリ作成シリーズの第5回です。今回は一覧をテーブル表示に変更し、各行に削除ボタンを追加します。

家計簿アプリを作る #4：収支の登録フォームを実装する

Wed, 03 Jun 2026 00:00:00 +0900

家計簿アプリ作成シリーズの第4回です。今回は SvelteKit の Form Actions を使って収支の登録フォームを実装します。

家計簿アプリを作る #3：D1 への接続 + 収支一覧の表示

Tue, 02 Jun 2026 00:00:00 +0900

家計簿アプリ作成シリーズの第3回です。今回は Drizzle ORM 経由で D1 に接続し、収支データをトップページに一覧表示するところまでを実装しました。

家計簿アプリを作る #2：Drizzle でスキーマ設計 + D1 マイグレーション

Mon, 01 Jun 2026 00:00:00 +0900

家計簿アプリ作成シリーズの第2回です。今回は Drizzle ORM でスキーマを定義し、Cloudflare D1 にマイグレーションを適用するところまでを記録します。ハマりポイントが多かったので詳しくまとめます。

家計簿アプリを作る #1：SvelteKit × Cloudflare D1 × Drizzle の環境構築

Sun, 31 May 2026 01:00:00 +0900

SvelteKit + Cloudflare Workers（D1 + Drizzle ORM）を使って家計簿アプリを作っていきます。この記事はその第1回で、プロジェクトの環境構築をまとめます。

GitHub ActionsでSvelteKitをCloudflare Workersに自動デプロイした話

Sun, 31 May 2026 00:00:00 +0900

GitHub Actionsを使うと、mainブランチへのプッシュで自動的にCloudflare Workersへデプロイできます。手動での wrangler deploy が不要になります。

Drizzle ORMのリレーションでテーブルを結合して取得した話

Sat, 30 May 2026 01:00:00 +0900

Drizzle ORMの relations を使うと、テーブル間の関係を定義してシンプルなコードで結合データを取得できます。posts と comments を例に実装しました。

SvelteKit × Cloudflare WorkersでWebSocketを実装した話

Sat, 30 May 2026 00:00:00 +0900

WebSocketを使うと、一度接続したら切断するまで双方向にリアルタイムで通信し続けられます。SvelteKit + Cloudflare Workersでエコーサーバーを実装しました。

DrizzleでマイグレーションとSeedを実装した話

Fri, 29 May 2026 03:00:00 +0900

drizzle-kitを使ってマイグレーションを生成し、Cloudflare D1に適用する方法と、seed.sqlで初期データを流し込む方法をまとめます。

SvelteKit × Cloudflare D1にDrizzle ORMを導入した話

Fri, 29 May 2026 02:00:00 +0900

Drizzle ORMはTypeScript向けの軽量ORMです。platform.env.DB.prepare('SELECT ...') と書いていた生SQLを、型安全なTypeScriptのコードに置き換えられます。今回は既存のCloudflare D1テーブルに対してDrizzleを導入しました。

Cloudflare QueuesのプロデューサーをSvelteKitで実装した話

Fri, 29 May 2026 01:00:00 +0900

Cloudflare Queuesを使うと、処理を非同期でバックグラウンド実行できます。重い処理をQueueに投げることで、ユーザーを待たせずにレスポンスを返せます。

Cloudflare Workers AIをSvelteKitで使った話

Tue, 26 May 2026 01:00:00 +0900

Cloudflare Workers AIを使うと、Cloudflareのエッジネットワーク上でAIモデルを直接実行できます。外部のAI APIを別途契約しなくても、Cloudflareアカウントだけで利用できます。

Cloudflare Workersのシークレット管理を整理した話

Tue, 26 May 2026 00:00:00 +0900

Cloudflare Workersでシークレット（APIキーなど秘密の値）を扱う方法を整理します。ローカルと本番で管理方法が異なります。

Cloudflare KVをSvelteKitで使った話

Sat, 23 May 2026 03:00:00 +0900

Cloudflare KV（Key-Value Storage）はシンプルなキーと値のペアを保存するストレージです。D1のようなSQLクエリは不要で、get / put / delete だけで操作できます。

SvelteKit × Cloudflare R2 でファイルアップロードを実装した話

Fri, 22 May 2026 00:00:00 +0900

SvelteKit + Cloudflare Workers の構成でCloudflare R2を使ったファイルアップロード機能を実装しました。

SvelteKit + GitHub OAuthをCloudflare Workersにデプロイした話（躓きポイントまとめ）

Fri, 15 May 2026 08:00:00 +0900

ローカルで動作確認済みのGitHub OAuth認証をCloudflare Workersにデプロイする際、環境変数まわりで複数の躓きポイントがありました。同じ構成（SvelteKit + adapter-cloudflare + wrangler deploy）を使う場合の参考になるようにまとめます。

SvelteKitでGitHub OAuthログインを実装した話

Fri, 15 May 2026 06:00:00 +0900

固定パスワードによる簡易認証をGitHub OAuthを使った本格的な認証に置き換えました。 Arcticライブラリを使ってOAuthの実装をシンプルに保ちつつ、セッション管理にはCloudflare D1を使っています。

SvelteKit + D1をCloudflare Pagesにデプロイした話

Fri, 15 May 2026 05:00:00 +0900

D1（CloudflareのSQLite）を導入したSvelteKitプロジェクトをCloudflare Pagesにデプロイしました。ローカルで動作確認済みでも、デプロイ時にD1まわりでハマりやすい点があるため、手順とトラブルシューティングをまとめます。

SvelteKitにCloudflare D1を導入してDBからデータを取得した話

Fri, 15 May 2026 04:00:00 +0900

$lib/posts.ts に書いていた静的なデータをCloudflare D1（サーバーレスSQLite）に移行しました。この記事ではDB作成からマイグレーション、SvelteKit側でのデータ取得までの手順をまとめます。

SvelteKitアプリをGitHubからCloudflare Workersにデプロイした話

Fri, 15 May 2026 00:00:00 +0900

SvelteKitで作ったアプリをGitHubにプッシュし、Cloudflare Workersにデプロイしました。 Cloudflareのダッシュボードが新UIに変わっており、いくつか躓いたポイントがあったので手順と合わせて残しておきます。

SvelteKitをCloudflare Pagesにデプロイした話

Fri, 15 May 2026 00:00:00 +0900

SvelteKitで作ったTODOアプリを実際に公開するため、Cloudflare Pages へのデプロイ設定を行いました。アダプターの役割と環境変数の扱いを中心に整理します。

XServerのドメインをCloudflareに移管した話

Wed, 13 May 2026 02:00:00 +0900

XServerのWordPressブログをCloudflare Pagesに移行したのに伴い、ドメイン（jiru-labo.com）の登録もXServerからCloudflare Registrarに移管しました。

今回のドメインはXServerの独自ドメイン永久無料特典で取得したものだったため、通常とは異なる手順が必要でした。同じ状況の方の参考になれば幸いです。

HugoサイトにCloudflare WorkersとResendでお問い合わせフォームを実装した話

Tue, 05 May 2026 00:00:00 +0900

Hugoで作った静的サイトにお問い合わせフォームを実装しました。静的サイトはサーバーサイドの処理ができないため、フォームの送信処理には別の仕組みが必要です。今回は Cloudflare Workers（サーバーレス関数）と Resend（メール送信API）を組み合わせた構成にしました。

HugoのMainroadテーマをカスタマイズしてコーポレートサイト風にした話

Tue, 05 May 2026 00:00:00 +0900

XServerのWordPressブログをHugo＋Cloudflare Pagesに移行した後、デフォルトのMainroadテーマのままでは味気なく、コーポレートサイト風のレイアウトに作り直しました。この記事では、その試行錯誤の経緯を記録として残します。

XServerのWordPressブログをCloudflare Pagesに移行した話

Tue, 05 May 2026 00:00:00 +0900

長年XServerでWordPressブログを運営していました（と言っても記事の投稿はすっかり止まってましたが…汗）が、思い切ってHugo＋Cloudflare Pagesに移行しました。表示速度の向上、ランニングコストゼロ、Markdownでの執筆環境など、メリットが多く大満足です。

この記事では、実際に移行した手順とハマったポイントをまとめます。

個人事業用にCloudflareアカウントを新規作成した話

Tue, 05 May 2026 00:00:00 +0900

XServerで運営していたWordPressブログをCloudflare Pagesに移行するにあたり、個人事業用のCloudflareアカウントを新規に作成しました。

Cloudflareは無料プランでも非常に多くの機能が使えます。この記事ではアカウント作成の手順と、実際に使った機能を紹介します。