Svelte + SvelteKit

Oh, so @sveltejs 5 is live now!! Wow! Congrats to @rich_harris and contributors!! https://svelte.dev/

ShifterMesh with @CristianVogel ! Deep into ancient trees *and* frequency shifter networks *and* DSP coding for the web (including #typescript @sveltejs @threlte ) and - making some wild sounds while you're at it. https://cdm.link/2024/07/inside-cristian-vogel-nel-shiftermesh/

This might be of particular interest to any @sveltejs fans 👀
https://mastodon.macstories.net/@johnvoorhees/112434501344349786

Although it’s not released yet, here’s a link to the Svelte 5 online playground so you can get familiar with new features and syntax. Make sure to check out the documentation on that same site for more details.

If you didn’t know, you can also choose to use Svelte 5 when setting up a new svelte project using npm create svelte@latest.

Chat and ask any questions below!

I’m starting to fall in love with #svelte @sveltejs I finally have a change to work with Svelte within real production codebase and it's nothing but a pleasure. For a newbie with long React background this feels like - «OMG, it actually could be just that simple!»

It's still early days, and I'm only scratching the surface but so far it feels really good.

Svelte stores can be a lot more than just writable, readable, and derived!

Hey all!

Let’s chat about Svelte runes to be introduced in the upcoming Svelte 5 update. This is a fairly significant change to Svelte that can give more power and organized code but renders some familiar Svelte syntax useless. Here’s the announcement article for reference and a dev vlog with some of the team for further listening.

• So far, do you like runes or do you hate them?
• What are the pros and cons?
• Do you have any experience with similar syntax in other frameworks or languages?

Title.

I'm going to use svelte and sveltekit. Most likely tailwind. Zod for validation.

Any tips and tricks/ideas, pits to watch for before I commit heavily into falling into them.

This project could potentially be in vue/react but in my opinion svelte is more appealing to me (specially because of stores)

Any thoughts?

Build a SvelteKit app with the new all-in-one toolkit that can replace NodeJS. Anyone have any experience with it so far?

Also check out these two posts on this topic: https://svelte.dev/blog/view-transitions https://developer.chrome.com/docs/web-platform/view-transitions/

According to the Bun blog and changelog, Bun now supports SvelteKit! Bun is an incredibly fast JavaScript runtime, bundler, transpiler, and package manager — all in one. Similar to using npm, here’s how you can start a SvelteKit project with Bun:

$ bunx create-svelte my-app

I'm experienced with React and was just trying out a small Svelte to-do list to get my feet wet with Svelte and see if it's something I'd like to suggest we try out at work.

However, there's one thing I wanted to clarify that wasn't immediately obvious from the documentation (and to just kickstart some discussion since this community is a little quiet).

In React, if I have a large file doing a good amount of logic, like in the to-list example where I have add logic, remove logic, and toggle logic, all of which can be complex in their own ways if you improve them enough, I am able to extract the logic out into it's own file by creating a custom hook. Like so

const useTodoList = () => {
  const [list, setList] = useState([]);

  const addItem = (taskName) => {
    // task creation logic
    setList(l => [...l, newTask]);
  }

  // logic for removeItem and toggleItem

  return { list, addItem, removeItem, toggleItem };
}

Then, I can bring that into my component file by simply doing const { ... } = useTodoList(); and everything should just work. What would the equivalent be in Svelte? It sounds like I would want to leverage the store concept, but that feels odd to me. I go from having pretty simple logic to having to add additional libraries to my logic. It's a lot of overhead for what should really be a pretty straightforward refactor in React.

Any insight you guys can give would be great! Additionally, I'd love to be able to move the style as well, but so far haven't found anything that would be suitable for that quite yet. Svelte seems pretty set on having one large file whenever possible.