Web SDK quickstart

npm create vite@latest tinycloud-web -- --template vanilla-ts
cd tinycloud-web
npm install
npm install @tinycloud/[email protected]

import { TinyCloudWeb } from '@tinycloud/web-sdk';

document.querySelector<HTMLDivElement>('#app')!.innerHTML = `
  <main>
    <h1>TinyCloud first write</h1>
    <button id="start">Sign in and write</button>
    <pre id="status">Ready</pre>
  </main>
`;

const button = document.querySelector<HTMLButtonElement>('#start')!;
const status = document.querySelector<HTMLPreElement>('#status')!;

button.addEventListener('click', async () => {
  const provider = (window as Window & { ethereum?: unknown }).ethereum;
  if (!provider) {
    status.textContent = 'Install or unlock a browser wallet, then try again.';
    return;
  }

  button.disabled = true;
  status.textContent = 'Waiting for wallet approval…';

  try {
    const tc = new TinyCloudWeb({
      provider,
      tinycloudHosts: ['https://node.tinycloud.xyz'],
      spacePrefix: 'tinycloud-quickstart',
    });

    await tc.signIn();

    const saved = await tc.kv.put('first-record', {
      message: 'Hello from TinyCloud',
      writtenAt: new Date().toISOString(),
    });
    if (!saved.ok) throw new Error(`${saved.error.code}: ${saved.error.message}`);

    const loaded = await tc.kv.get<{ message: string }>('first-record');
    if (!loaded.ok) throw new Error(`${loaded.error.code}: ${loaded.error.message}`);

    status.textContent = JSON.stringify({
      space: tc.spaceId,
      record: loaded.data.data,
    }, null, 2);
  } catch (error) {
    status.textContent = error instanceof Error ? error.message : String(error);
    button.disabled = false;
  }
});

npm run dev

{
  "space": "tinycloud:pkh:eip155:1:0x…:tinycloud-quickstart",
  "record": {
    "message": "Hello from TinyCloud"
  }
}