Ancestors

Written by Matthias Andrasch on 2025-01-05 at 12:58

🧑‍🔧 Updated https://austrian-web-dev-companies.pages.dev/ a bit more, learned how bind:group works with #Svelte v5 $state.

🚉 Next stop: Adding pagination & URL params.

=> More informations about this toot | More toots from mandrasch@social.tchncs.de

Written by Matthias Andrasch on 2025-01-06 at 21:45

After getting help on Svelte Discord, I integrated a rather interesting $effect pattern to load my $state from URL parameters (thx to l3t!) + added pagination ✅ Guess I have to get used to $effect in #Svelte v5. https://github.com/mandrasch/austrian-web-dev-companies/blob/68a4caa8435df0b8e5502501baa6fc153170171f/src/routes/%2Bpage.svelte#L51

🚉 Next stop: Scroll to results div after pagination click.

=> More informations about this toot | More toots from mandrasch@social.tchncs.de

Toot

Written by Matthias Andrasch on 2025-01-07 at 07:27

Got critical feedback on bsky about this: https://bsky.app/profile/paolo.ricciuti.me/post/3lf464y4erc2h

Now I'm a bit undecided if I should $derive from '$page/state' as suggested:

import {page} from '$page/state';

// ...

const selectedTags = $derived(page.url.searchParams.get("tags"));

• or if I should keep the current approach with $effect and bind:group for simplicity. 🤷🤔

[#]Svelte #SvelteKit #JavaScript

=> More informations about this toot | More toots from mandrasch@social.tchncs.de

Descendants

Written by matthiou on 2025-01-07 at 08:18

@mandrasch definitely derive state from URL. Process would thus be

Toggle checkbox > edit URL > derive state from URL

( $effect could toggle checkboxes when a manual edit of the URL is detected to stay nicely synced )

If some parameters are not stored in the URL but in another $state, final state is derived from URL and that other $state

=> More informations about this toot | More toots from matthiou@mastodon.social