Back
Version 36
4/7/2024
/** @jsxImportSource https://esm.sh/react */
import ReactDom from "https://esm.sh/react-dom";
import { createStore } from "https://esm.sh/tinybase";
import { createRemotePersister } from "https://esm.sh/tinybase/persisters/persister-remote";
import { Provider, useValue } from "https://esm.sh/tinybase/ui-react";
// initialize the store
const store = createStore();
const persister = createRemotePersister(store, `${window.location.origin}/load`, `${window.location.origin}/save`);
await persister.startAutoLoad({}, {
count: 0,
});
await persister.startAutoSave();
function Counter() {
const count = useValue("count");
return (
<div>
<h1>{count}</h1>
<button
onClick={() => {
store.setValue("count", count + 1);
}}
>
-
</button>
<button
onClick={() => {
store.setValue("count", count - 1);
}}
>
+
</button>
</div>
);
}
Updated: April 7, 2024