For Pablo — Tier 2 upgrade: Cloudflare Workers + KV (shared live state)
Currently the board saves state into the URL hash. To upgrade to a proper shared live board (one URL, auto-saves, both users see the same state in real time), the recommended approach is a Cloudflare Worker with KV storage. Estimated setup time: 30–45 mins.
Steps:
1. In the Cloudflare dashboard, create a KV namespace called
CBA_BOARD.
2. Create a new Worker with the following code:
export default {
async fetch(req, env) {
const cors = {
'Access-Control-Allow-Origin': '*',
'Access-Control-Allow-Methods': 'GET, POST, OPTIONS',
'Access-Control-Allow-Headers': 'Content-Type',
};
if (req.method === 'OPTIONS') return new Response(null, { headers: cors });
const url = new URL(req.url);
const key = 'board_state';
if (req.method === 'POST') {
const body = await req.text();
await env.CBA_BOARD.put(key, body);
return new Response('ok', { headers: cors });
}
const state = await env.CBA_BOARD.get(key);
return new Response(state || '{}', {
headers: { ...cors, 'Content-Type': 'application/json' }
});
}
};
3. Bind
CBA_BOARD KV namespace to the Worker (in Worker settings → Variables → KV Namespace Bindings).
4. Replace the
saveState() and
loadState() functions in this HTML file with
fetch() calls to the Worker URL.
5. Add a 30-second
setInterval poll on
loadState() so both users auto-refresh.
Security: Add a shared secret header check in the Worker if you don’t want the endpoint publicly writable.