# Cloudflare Workersを使ってラップタイマー共有サービスを作る macopy a.k.a @mackee_w --- ## 何を作ったか * 「ラップタイマー」を複数デバイスで共有するサービス * 「ラップタイム」ではない * 計時しているラップタイマーを他の端末に共有しつつ、リアルタイムで状態を共有する --- ## デモ https://lapshare.triplepoint.workers.dev/ --- ## 動機 * ミニ四駆大会を社内で開催している * 元はと言えば自社サービスのドッグフーディング目的 * コースが短いので、同時に走らせるのではなくラップタイムで競っている --- # 動機 * ラップタイマーをスマホアプリにしていたが、その間スマホが使えなくて不便 * ラップタイマーを作ろう（ハードウェア） * => 画面が小さいからインターネット経由で同期してでかい画面で見れるようにしよう --- ## 構成 * Cloudflare Workers * 同期のためにWebSocketを使用 * データストアはDurable Objects * フレームワーク: Hono * フロントエンド: preact --- ## SWR * 当初はAPIで`@vercel/swr`使用していた * 5秒毎にポーリング * これでもだいぶ実用 --- ## Workers KVとDurable Objects * Workers KV: エッジに分散されているKV * 全然同期されなくて困った * 仕組み考えると当たり前 * ローカルのwranglerだと同期される * $5払ってDurable Objectsを使うようにした * 雑にいうとActor Modelみたいなやつ * ちゃんと同期取れるようになった ---