Build an offline-first note app

In this tutorial you'll build a note app that keeps working on a dropping connection and reconciles when it comes back.

1. Scaffold

npm create gomani@latest notes && cd notes && npm install

2. A local-first store

import { createStore, createFetchTransport } from '@gomani/data/client';

export const store = createStore({
  collections: { notes: {} },
  transport: createFetchTransport('/_gomani/sync'),
});

3. An island that writes optimistically

import { island } from '@gomani/core';
import { store } from '../data';

export default island(function Composer() {
  return (
    <form onSubmit={(e) => { e.preventDefault(); store.notes.put({ id: crypto.randomUUID(), text: e.target.text.value }); }}>
      <input name="text" aria-label="New note" />
      <button>Save</button>
    </form>
  );
});

Ship it, throttle your network to 3G, and watch it stay usable.