3 ms·

I've been using Svelte as my main framework for the past two years. I'm still very happy with it and will continue to use it. It has many advantages but the ma

by pier25 5y ago

I've been using Svelte as my main framework for the past two years. I'm still very happy with it and will continue to use it. It has many advantages but the main reason for me is that it simplifies your front end code. It's not perfect by any means, but overall its cons are worth it IMO.

newsbinator 5y ago
What do you use for UI components? I recently built my first SvelteKit project and using Tailwind to compose UI components vs. Vue+Vuetify was like writing binary by hand instead of using an expressive modern language that abstracts away 99% of plumbing. What takes 10 seconds and 20 chars in Vuetify takes 10~100 minutes and multiple components/sub-components written by hand in Tailwind in Svelte. Of course talking about Tailwind isn't Svelte/SvelteKit specific: I just couldn't find a remotely comparable UI library for Svelte so I gave up and stuck with Tailwind to get the project done.
- pier25 5y ago
  That's one of the issues with Svelte. It's a newcomer so the ecosystem is minuscule. Personally I'm happy using Bulma with Svelte. I find most UI libraries tend to add too much bloat so I'd rather have something that only adds configurable CSS and just add as much JS as I need/want. I used Vue+Vuetify some years ago. I wasn't very happy with it, but I agree Svelte needs something similar. There are a couple of projects out there that add Svelte components for Bootstrap, Material, or IBM Carbon you could check. https://sveltematerialui.com/ https://sveltematerialui.com/ https://github.com/bestguy/sveltestrap https://github.com/bestguy/sveltestrap https://github.com/carbon-design-system/carbon-components-svelte https://github.com/carbon-design-system/carbon-components-sv... There are also a couple of projects about headless (no CSS) components for Svelte although I only seem to be able to find this one (not public yet) https://svelteui.com/ https://svelteui.com/
- newlisp 5y ago
  Wouldn't https://tailwindui.com/ https://tailwindui.com/ solve your problem?
  - pier25 5y ago
    I think GP meant components that require JS like data tables which TailwindUI doesn't solve. I guess something like Tailwind Headless (only available for React and Vue): https://headlessui.dev/ https://headlessui.dev/
    - ryangossiaux 5y ago
      I ported this library to Svelte recently: https://github.com/rgossiaux/svelte-headlessui https://github.com/rgossiaux/svelte-headlessui As a side note, Tailwind UI does include some components that require JS--that's what the Headless UI library is for. But it's also true that it's not a comprehensive component library; still missing things like a combobox or a date picker.
newlisp 5y ago
What does it simplifies in contrast to React?
- pier25 5y ago
  Pretty much everything except that the ecosystem is very young. Other than greatly simplifying components, Svelte includes reactive primitives to build your models/stores with. No need for MobX, Redux, etc. It also includes animation tools which again would require third-party deps.

by pier25 5y ago

newsbinator 5y ago

What do you use for UI components? I recently built my first SvelteKit project and using Tailwind to compose UI components vs. Vue+Vuetify was like writing binary by hand instead of using an expressive modern language that abstracts away 99% of plumbing. What takes 10 seconds and 20 chars in Vuetify takes 10~100 minutes and multiple components/sub-components written by hand in Tailwind in Svelte. Of course talking about Tailwind isn't Svelte/SvelteKit specific: I just couldn't find a remotely comparable UI library for Svelte so I gave up and stuck with Tailwind to get the project done.

pier25 5y ago
That's one of the issues with Svelte. It's a newcomer so the ecosystem is minuscule. Personally I'm happy using Bulma with Svelte. I find most UI libraries tend to add too much bloat so I'd rather have something that only adds configurable CSS and just add as much JS as I need/want. I used Vue+Vuetify some years ago. I wasn't very happy with it, but I agree Svelte needs something similar. There are a couple of projects out there that add Svelte components for Bootstrap, Material, or IBM Carbon you could check. https://sveltematerialui.com/ https://sveltematerialui.com/ https://github.com/bestguy/sveltestrap https://github.com/bestguy/sveltestrap https://github.com/carbon-design-system/carbon-components-svelte https://github.com/carbon-design-system/carbon-components-sv... There are also a couple of projects about headless (no CSS) components for Svelte although I only seem to be able to find this one (not public yet) https://svelteui.com/ https://svelteui.com/
newlisp 5y ago
Wouldn't https://tailwindui.com/ https://tailwindui.com/ solve your problem?
- pier25 5y ago
  I think GP meant components that require JS like data tables which TailwindUI doesn't solve. I guess something like Tailwind Headless (only available for React and Vue): https://headlessui.dev/ https://headlessui.dev/
  - ryangossiaux 5y ago
    I ported this library to Svelte recently: https://github.com/rgossiaux/svelte-headlessui https://github.com/rgossiaux/svelte-headlessui As a side note, Tailwind UI does include some components that require JS--that's what the Headless UI library is for. But it's also true that it's not a comprehensive component library; still missing things like a combobox or a date picker.

newlisp 5y ago

What does it simplifies in contrast to React?

pier25 5y ago
Pretty much everything except that the ecosystem is very young. Other than greatly simplifying components, Svelte includes reactive primitives to build your models/stores with. No need for MobX, Redux, etc. It also includes animation tools which again would require third-party deps.