Closed SkaterDad closed 2 years ago
Great, thanks @SkaterDad and glad to hear about your experience :)!
Would you be interested in helping out by adding a Svelte example to https://syncedstore.org/docs/? (similar to the React / Vue examples?). This would definitely be useful and maybe we can then share it in the Svelte community to get more people excited
This pull request's base commit is no longer the HEAD commit of its target branch. This means it includes changes from outside the original pull request, including, potentially, unrelated coverage changes.
Totals | |
---|---|
Change from base Build 1646514965: | 0.0% |
Covered Lines: | 497 |
Relevant Lines: | 584 |
Would you be interested in helping out by adding a Svelte example to https://syncedstore.org/docs/? (similar to the React / Vue examples?). This would definitely be useful and maybe we can then share it in the Svelte community to get more people excited
Yes, I should be able to help with that. Same Todo app?
I'm hoping to do more experimentation with complex data, as well. Is this library able to handle nested object updates (trees)? I read it's possible with yjs, but you'd have to define each nested object as a y map?
Yes, I should be able to help with that. Same Todo app?
Yes I think that would be cool! I think most work would be getting the live example (using sandpack) to work. Most of this code is in https://github.com/YousefED/SyncedStore/tree/main/docs/src/theme/CodeBlock. Let me know if you need help to figure this out! (I'm also available on Discord)
The latest version of Sandpack (the live code editor) has a Svelte theme (they just added that), so that should be helpful:
I'm hoping to do more experimentation with complex data, as well. Is this library able to handle nested object updates (trees)? I read it's possible with yjs, but you'd have to define each nested object as a y map?
Yes, this is definitely possible with Yjs. Yjs provides data structures such as Y.Map and Y.Array for this. However, SyncedStore was designed exactly to make this easier; so with SyncedStore you can pass any JSON structure, and it maintains underlying Y.Map (for objects) and Y.Array (for arrays) automatically.
Hi, would you be able to push an updated package to npm for use in the examples?
I spent some time working on the sandpack examples but kept running into strange errors. Was going to give it another try this weekend, though.
Done! Svelte package has been updated: https://www.npmjs.com/package/@syncedstore/svelte
Thanks! Feels like Codesandbox isn't playing well with Svelte. Running into an error just like this one: https://github.com/EmilTholin/svelte-routing/issues/92
The code is all fine, but it doesn't work unless you open the Codesandbox and reinstall the Svelte dependency. Super weird and not a great user experience.
For now I'll just make a PR with some example code, and maybe a Svelte REPL.
Firstly, thanks for this library!
yjs
had me interested, but you've made it so much simpler to use.The combination of SyncedStore and the WebRTC & IndexedDb providers blew me away. Collaborative, offline-capable data in less than 5 minutes of work?
🤯
Description
This PR adds support for Svelte's
bind:value
syntax. The Svelte compiler expects there to be aset
method on the store.Since we're editing the underlying reactive objects directly, the
set
method can just be a simple() => {}
stub.Example
Same code, but with the types removed. https://codesandbox.io/s/svelte-syncedstore-example-lb1g7?file=/App.svelte