Awesome
vite-tinybase-ts-react-sync
This is a Vite template for a simple TinyBase app, using TypeScript and React, demonstrating the TinyBase ui-react-dom module UI components, and also synchronizing between disparate browser windows.
<img width="847" alt="image" src="https://github.com/user-attachments/assets/c63f2789-94dd-4fd3-a5eb-e929c7b4897c">Instructions
- Make a copy of this template into a new directory:
npx tiged tinyplex/vite-tinybase-ts-react-sync my-tinybase-app
- Go into the client directory:
cd my-tinybase-app/client
- Install the dependencies:
npm install
- Run the application:
npm run dev
- Go the URL shown and enjoy!
Run your own server
This template uses a lightweight socket server on vite.tinybase.org
to
synchronize data between clients. This is fine for a demo but not intended as a
production server for your apps!
If you wish to run your own instance, see the server
directory and start from
there.
The vite.tinybase.org
server is hosted on fly.io and so if you choose to use
that, you can reuse the docker and fly configurations in the server directory.
Just remember to update them to match your machines and required configuration.
You will also have to have your client communicate with the new server by
configuring the SERVER
constant at the top of the client's App.tsx
file.
Other templates
There are eleven templates for TinyBase, of which this is one:
Template | Language | React | Plus | |
---|---|---|---|---|
vite-tinybase | JavaScript | No | ||
vite-tinybase-ts | TypeScript | No | ||
vite-tinybase-react | JavaScript | Yes | ||
vite-tinybase-ts-react | TypeScript | Yes | ||
👉 | vite-tinybase-ts-react-sync | TypeScript | Yes | Synchronization |
vite-tinybase-ts-react-sync-durable-object | TypeScript | Yes | Sync & Durable Objects | |
vite-tinybase-ts-react-pglite | TypeScript | Yes | PGlite | |
vite-tinybase-ts-react-crsqlite | TypeScript | Yes | CR-SQLite | |
tinybase-ts-react-partykit | TypeScript | Yes | PartyKit | |
tinybase-ts-react-electricsql | TypeScript | Yes | ElectricSQL | |
expo/examples/with-tinybase | JavaScript | Yes | React Native & Expo |
License
This template has no license, and so you can use it however you want! TinyBase and Vite themselves are both MIT licensed.