Kinda wish it had DI, coming from Angular and C# it’s so helpful to have stateful services, I know one answer is to just use a global static, but that causes huge issues on the server side and it’s really easy to make mistakes there. It feels like contexts are the answer, but then you can’t use those services in load functions.
I’m curious where do you store the current user data. In a static store? Return it from a load function and access it via the page store? Somewhere else?
Well, I usually fetch and return user data from a top-level +layout.js or +layout.server.js. Then my user data is always available in every layout or page through the data prop (and types are all handle automatically for this too).
I then invalidate and re-fetch that data using invalidate(), invalidateAll(), and depends() if the user data becomes stale.
Any state/data from the user that needs to stay server-side (like tokens) I keep in event.locals which is available in all .server.js files
I really like how with React (and a few others) you can make a quick abstraction in the same file for a repeated chunk of the render. Sometimes something warrants pulling out into a function for reusability but it doesn’t quite pass the bar to justify its own file as a component - I know there’s some template stuff coming in Svelte 5, so hopefully that scratches the itch.
Totally agree, I can definitely say I’ve found myself wishing for that more as I continue to use Svelte. I didn’t see it as necessary at first, but situations that could benefit from that have come up enough now that I’ve used it for a while
I look forward to seeing this discussion - I haven’t had time to look into runes much, but I really like Svelte and I trust Harris & co’s design decisions so far - but I also trust them to listen to the community. I look forward to the vibe check.
If you’re handling any sensitive data, passwords, or private user data, DO NOT use stores. Stores should only be used on the client-side. Use event.locals to pass data around for the user on the server side instead. If you use a store on the server-side, you risk that data being exposed or used in other current users and browser session.
For form validation, check out SvelteKit form actions. Also, I personally find Yup to be easier to use than Zod
I’d try using props for high-level component states (primary, secondary, disabled, loading, online, error, etc.) instead of one-off styles. Then your props will manage a bunch of styles and functionality all at once and you’ll stay a whole lot more organized. You can even have a settings/options prop that changes minor things if you’d like. Then, for one-off or edge-cases related to styling, you can use a css variable
I’ve been watching Bun for a while and it seems to actually be a drop-in replacement for almost everything in my toolchain from the ground up. Haven’t tried it yet, but really excited to with SvelteKit now that it’s at 1.0!
I agree with all above commenters. The svetle site is a must resource. I would add some creators that have some good content like hartenfellerdev and WebJeda to a list with nice content, and SvelteRust for a diffrent backend then node. And last but not least one of the maintainers of svelte lihautan
The main Svelte site is 10/10 for me - it’s really worth spending the time to go through it from front to back.
Carbon Components Svelte is an amazing set of UI components, which uses IBM’s Carbon Design System. Not only does it let you put together really professional-looking UI’s effortlessly (I use it for all my admin areas!), but it is really well made and documented. It’s taught me a lot about how to break things up into discrete, reusable, inter-linking components.
But really, as with most things, it’s setting yourself a goal and learning everything you need to achieve it. For example, I set myself the goal of creating a Virtual Tabletop (VTT). I have no need for it and no intention to release it, but I learnt so much doing it.
EDIT: Also, go and read all the Vite documentation; a lot of what I thought was SvelteKit was actually Vite, and after having spent time learning it SvelteKit is much less of a magic box to me now!
sveltejs
Hot
This magazine is from a federated server and may be incomplete. Browse more on the original instance.