Skip to content

Commit 6a11d0e

Browse files
committed
[svelte] Updates
1 parent 0d727a3 commit 6a11d0e

File tree

5 files changed

+19
-11
lines changed

5 files changed

+19
-11
lines changed

README.md

Lines changed: 17 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,8 @@ A CLI tool to scaffold a new TinyBase application with full synchronization and
44
local-first capabilities.
55

66
Build a todo list, a drawing app, a chat app, or a tic-tac-toe game using
7-
TypeScript or JavaScript, with React or Vanilla JS - in just a matter of
8-
seconds.
7+
TypeScript or JavaScript, with React, Svelte, or Vanilla JS - in just a matter
8+
of seconds.
99

1010
## Usage
1111

@@ -19,7 +19,7 @@ This will prompt you with questions to configure your new TinyBase app:
1919

2020
- **Project name** - Name of your project directory
2121
- **Language** - TypeScript or JavaScript
22-
- **Framework** - React or Vanilla JS
22+
- **Framework** - Vanilla JS, React, or Svelte
2323
- **App type** - Todo app, Chat app, Drawing app, or Tic-tac-toe game
2424
- **Store schemas** - TypeScript type safety for stores (TypeScript only)
2525
- **Synchronization** - None, remote demo server, local Node server, or local Durable Objects server
@@ -107,19 +107,26 @@ are the details of what each option entails:
107107

108108
### Framework Choice
109109

110+
**Vanilla JS** offers:
111+
112+
- No framework dependencies
113+
- Smallest bundle size
114+
- Direct DOM manipulation
115+
- Manual listener-based updates
116+
110117
**React** provides:
111118

112119
- Component-based architecture
113120
- React hooks for TinyBase stores
114121
- Automatic re-rendering on store updates
115122
- Full ecosystem support
116123

117-
**Vanilla JS** offers:
124+
**Svelte** provides:
118125

119-
- No framework dependencies
120-
- Smaller bundle size
121-
- Direct DOM manipulation
122-
- Manual listener-based updates
126+
- Component-based architecture with compiled output
127+
- Reactive declarations for TinyBase stores
128+
- No virtual DOM - smaller runtime overhead
129+
- `.svelte` single-file components
123130

124131
### App Types
125132

@@ -258,7 +265,7 @@ my-tinybase-app/
258265
│ ├── index.html # Entry HTML
259266
│ ├── public/ # Static assets
260267
│ └── src/ # Source code
261-
│ ├── App.tsx # Main app component
268+
│ ├── App.tsx # Main app component (React/Svelte)
262269
│ ├── Store.tsx # TinyBase store setup
263270
│ └── ... # App-specific components
264271
└── server/ # Server code (optional)
@@ -273,6 +280,7 @@ my-tinybase-app/
273280
- [TinyBase GitHub](https://github.com/tinyplex/tinybase)
274281
- [Synchronization Guide](https://tinybase.org/guides/synchronization)
275282
- [React Integration](https://tinybase.org/guides/building-uis/using-react)
283+
- [Svelte Integration](https://tinybase.org/guides/building-uis/using-svelte)
276284

277285
## License
278286

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "create-tinybase",
3-
"version": "1.2.0",
3+
"version": "1.2.1",
44
"author": "jamesgpearce",
55
"repository": {
66
"type": "git",

screenshots/chat.png

39 Bytes
Loading

screenshots/drawing.png

3 Bytes
Loading

src/cli.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -60,8 +60,8 @@ const config = {
6060
name: 'framework',
6161
message: 'Framework:',
6262
choices: [
63-
{title: 'React', value: 'react'},
6463
{title: 'Vanilla', value: 'vanilla'},
64+
{title: 'React', value: 'react'},
6565
{title: 'Svelte', value: 'svelte'},
6666
],
6767
initial: 0,

0 commit comments

Comments
 (0)