Croatia
- Tweets 2,326
- Following 348
- Followers 6,098
- Likes 7,090
Pinned Tweet
I'm excited to release the Svelte 5 course aimed at new and existing Svelte developers! 🔥
Learn how to make blazing fast web apps with Svelte and understand how it works with hands-on experience.
piped.video/B2MhkPtBWs4
19
64
384
27,995
I love the 62.5% font size trick in CSS because it makes working with rems easier.
49
196
2,684
328,653
You can do blobs with CSS filter but it only works as black or white as far as I know but you can use SVGs to achieve the result you want.
27
156
1,728
290,707
If you partake in the dark arts of JavaScript DOM manipulation use `Object.assign()` to create an element in one go. 🔥
45
98
1,233
193,067
You can prevent layout shift from numbers by using tabular numbers in CSS which uses numbers of the same size supported by most fonts. 🔥
10
107
975
105,788
You don't need an extension for renaming HTML tags in VS Code if you enable linked editing. 🔥
21
102
773
102,028
Here's a summary of Svelte 5: The Bonkers Fast Edition changes in a thread. 🧵
1) Runes are new way to declare reactive state in your Svelte apps backed by signals for fine-grained reactivity (@Rich_Harris swears it's bonkers fast).
18
50
520
188,414
There's a new `<enhanced:img />` tag in Svelte for optimizing images available today. 🔥
kit.svelte.dev/docs/images
11
34
333
65,178
I'm excited to release the best SvelteKit course I could make for everyone! 🔥
Aimed to give you confidence and understanding of web fundamentals — learn why SvelteKit is the Swiss army knife of web frameworks and how to build modern web apps.
🍿 piped.video/MoGkX4RvZ38
16
42
305
31,927
I'm only starting to understand how powerful JavaScript generators are.
Every example is either basic or complicated but one great use I found for them is describing an animation which gives you complete control.
10
21
297
36,108
To celebrate the release of Svelte 5 I have a new video up with 7 GUI tasks you can use for practice! 🎉
⬩ Counter
⬩ Temperature Converter
⬩ Flight Booker
⬩ Timer
⬩ CRUD
⬩ Circle Drawer
⬩ Cells
piped.video/afLUZz_7ySc
5
25
268
9,846
The new Svelte site looks gorgeous!
It's a long needed update and I love how it's organized and the docs are more fleshed out.
It's not released yet but here's the preview svelte-dev-2-8ma5lqjfc-svelt….
12
23
228
22,519
After a day of exploration I came up with an actual declarative SVG animation timeline in Svelte I might love. 😍
7
20
225
22,086
Svelte just released an improved version of actions named attachments which are element-level lifecycle functions you can use to work with the DOM directly. 🔥
17
13
224
11,992
I'm honored to be appointed as a Svelte ambassador. 🙇
Besides showing how to make cool things with Svelte I love explaining how it works because you're not a <framework> developer but a developer and Svelte gets out of the way to learn fundamentals.
svelte.dev/blog/whats-new-in…
17
9
191
8,205
I'm excited to release Animotion! 🪄
Animotion is a presentational framework for creating beautiful slides and visualizing ideas with code using Svelte.
🌟 piped.video/dBfZjv-lt2k
7
33
202
20,716
In Svelte 5 you can dynamically render a component without using `<svelte:component>` as long as the value is capitalized. 🔥
8
14
200
20,256
I made a Svelte 5 playlist that has everything from a visual guide explaining the move to signals-based reactivity to in-depth videos about runes and snippets for creating inline components. 🍿
piped.video/playlist?list=PL…
7
32
197
10,689
working on the svelte runes videos where I also show and explain the shortcomings of svelte to understand what problems runes solve
2
10
200
10,751
The Svelte 5 guide has everything from reactivity and how it works, when to use and avoid effects, events, bindings, components and composition, transitions and animations to using third party libraries and making external systems reactive. 🔥
13
8
203
10,810
I'm close to finishing recording the Svelte course after so much time — only a few sections left and more editing to achieve absolute cinema. 😤
7
6
203
5,691
I wanted to implement search for my posts so I reverse-engineered how the svelte.dev search works and it's awesome.
It's blazingly fast because it uses `flexsearch` to index a JSON file and they also use a web worker for instant updates and zero network requests.
12
15
191
17,156
Bits UI 1.0 is out if you need flexible, unstyled, and accessible components for Svelte 5. 🔥
bits-ui.com/
6
25
191
5,958
Svelte's built-in transitions are going to be buttery smooth using the Web Animations API.
6
8
186
8,769
Async Svelte PR merged and you can try it under an experimental flag. Now I'm definitely making an updated Svelte video! ❤️
4
11
187
4,586
In SvelteKit you might reach for `onMount` to use third-party libraries in the browser context because components run on the server and client — instead use reusable Svelte actions that don't run on the server but only when an element is created. 🔥
6
17
169
22,024
If you know React learn Svelte in 30 minutes by watching the Svelte guide for React developers where I show the same React examples in Svelte:
- Components
- Logic
- Events
- Side effects
- Derived state
- Composition
- Global state
- Animations
piped.video/uWDBEUkTRGk
2
18
166
9,254
I'm updating the Svelte UI libraries list and I want to know what other libraries you think deserve to be included on the list? 📝
✅ Bits UI
✅ Flowbite Svelte
✅ Grail UI
✅ Melt UI
✅ Skeleton UI
✅ Svelte UX
✅ shadcn-svelte
18
16
164
15,320
Svelte Flow is a wonderful library for node-based UIs.
I thought it used canvas but it's regular ass HTML using transforms and SVG paths so it's easy to create custom nodes and it's butter.
I only wish you could animate the nodes but maybe it's a skill issue.
2
8
166
8,951
Astro + Svelte 🤝
ikea.com now on Astro.
Heard it was as easy to build as my bookshelf 🇸🇪
4
7
158
5,255
I made a short video explaining the recent Svelte changes which covers runes, fine-grained reactivity, events, and snippets. 🔥
piped.video/gGwnF-lxS_Q
5
28
155
9,777
They fixed Svelte!
Let's look at the new proxied state in Svelte and why it's one of the best changes to Svelte in years. 🔥
piped.video/R615rlP8Bvs
8
12
154
3,779
I released a video on using one magical line of CSS to achieve a responsive CSS grid layout. 🪄
piped.video/b9N1qLTVhvs
3
13
158
112,934
Let's explore and make a todo app using Svelte 5 runes to understand how magical they are! 🔥
piped.video/uOI77E8Y95Q
4
24
150
11,181
Svelte added native TypeScript support which means you can use types in your Svelte markup. 🔥
piped.video/hHB7Zd2F-nU
6
16
152
10,127
I'm working hard on a video explaining the upcoming Svelte changes and I'm so excited how much simpler things are.
19
1
149
9,275
I'm excited to release how to create beautiful presentations with Svelte using the HTML presentation framework Reveal.js and Tailwind CSS.
🍿 piped.video/67lqa5kTQkA
✍️ joyofcode.xyz/beautiful-pres…
3
16
145
14,981
I released a new video on how to add auth, database, i18n and more integrations using the Svelte CLI! 🔥
piped.video/ckF2J5JkUuw
4
13
144
3,650
I also learned that while it behaves like a getter and setter the value is a writable data property defined by ECMAScript
4
139
25,745
Check out the new `$inspect` Svelte rune!
You can log when a value updates, use a callback, or find the origin of the change, and it only works in development.
svelte-5-preview.vercel.app/…
14
19
142
9,466
Grail UI is an interesting headless component library for Svelte.
Instead of components it uses Svelte actions to attach the necessary behavior to elements which gives you absolute control over the markup and styles.
grail-ui.vercel.app/
6
21
143
16,749
It looks like Svelte remote functions got even better since the initial proposal and it's even easier to do optimistic UI updates when the actual PR lands.
11
5
147
7,204
TypeScript in your Svelte template? 👀
github.com/sveltejs/svelte/p…
12
10
144
17,297
In the talk Rich shared a concept for SvelteKit remote functions that might become an alternative to `load` functions. 🔥
Rich Harris' talk from this month's Svelte Summit is now freely available on our YouTube channel. The other videos will follow: piped.video/watch?v=1dATE70w…
20
9
145
15,853
I love the idea of state machines but I don't want to use a library because I need something simpler most of the time. You can take the best ideas from state machines and do this in Svelte.
9
6
135
25,289
Rich reveals an idea for streaming real-time data from the server exploring Server-Sent Events and WebSockets in SvelteKit.
9
6
145
5,728
I'm honored to be included in the video creators list for the State of JavaScript 2024 survey. ❤️
9
2
138
3,560
If you want to learn how to make a compiler framework like Svelte @lihautan has a great YouTube series you should check out because the best way to learn about something is to implement it yourself. 🔥
📺 piped.video/playlist?list=PL…
📜 github.com/tanhauhau/mini-sv…
3
17
133
8,215
I love the web and humanity of people working on improving it on this blue rock hurtling through space.
In case anyone missed the wonderful performance from @Rich_Harris at @thejsnation. 👏
2
21
136
In Svelte 5 state is deeply reactive and can be changed upwards on accident from another component so props are readonly by default unless you're explicit and make them bindable.
4
14
130
21,204
Consistent vertical text spacing in CSS is now easy thanks to the `text-box-trim` property or its shorthand `text-box` — design tools like Figma also support it.
5
3
137
4,830
I released a Svelte runes explainer video!
Svelte 5 introduces a new fine-grained universal reactivity system named runes which uses signals. Learn how to use magical incantations to imbue your Svelte app with powerful reactivity and reduce complexity.
piped.video/tErKyuUTzsM
1
20
124
3,645
There's a new video up comparing the changes between Svelte 4 and Svelte 5. 👏
piped.video/tC9KSwnczxQ
6
8
126
4,687
Fine-grained smoothly animated code blocks are coming to Animotion thanks to Shiki Magic Move. 🪄
4
6
128
5,620
The Svelte ecosystem covers the entire JavaScript ecosystem because using JavaScript libraries with Svelte is easy since Svelte gives you control over the DOM without requiring any glue code. 🔥
📺 piped.video/N9OjaQ0XtKQ
✍️ joyofcode.xyz/using-javascri…
2
16
123
11,644
Remix is breaking up with React.
In the early days of Remix they talked about having a framework agnostic solution so I'm curious to see where they go from here.
github.com/kayac-chang/remix…
7
4
130
9,870
Reminder that you should enable the Svelte inspector so you're able to open the code under your cursor from the browser at that location in the editor.
2
4
119
7,401
people always ask for Svelte projects so in the next video I'm doing every task from a counter to a spreadsheet app from the 7GUIs challenge 🔥
3
4
116
9,749
The new release of @threlte is a great example of what's possible with Svelte @SvelteSociety! 👏
Instead of being a wrapper around @threejs it extends it using a preprocessor in a transition towards rendering.
Give a follow to nitter.app/threlte for updates. 🙏
2
12
119
If you have a promise in Svelte you want to resolve client-side you can await the promise in your template and pass the prop. 🪄
6
8
120
10,163
Instead of using a SEO component in SvelteKit return SEO data from a page `load` function and access the data from `$page.data` inside the root layout.
9
9
117
12,839
Do you know you can use Markdown to document Svelte components in the editor using the `@component` tag?
3
12
117
5,808
Svelte actions are the most underrated and powerful feature of Svelte which sets it apart from other JavaScript frameworks — in this guide we go from simple to progressively harder examples to master Svelte actions. 🔥
📺 piped.video/LGOqg0Y7sAc
✍️ joyofcode.xyz/svelte-actions…
5
13
122
9,922
I thought this would take a week and it's a month later but it's done! 👏
The Svelte video is going to be absolute cinema with a runtime to match. I'm also looking for sponsors if anyone is interested hit me up — I can even read your poetry.
I cooked on this one chat 😤
2
3
124
3,625
Don't sleep on the Svelte inspector if you want to quickly find a component you're looking for in your editor. 🔥
5
17
105
6,591
🍋 Enjoy this freshly squeezed post on how to make a blazing fast search in SvelteKit at no cost but electricity and maybe one network request.
joyofcode.xyz/blazing-fast-s…
9
113
3,837
You can try the Svelte 5 alpha today with `npm i svelte@next`. There's also a SvelteLab template you can try. Rich said it's not ready for production, so that means ship it.
sveltelab.dev/?t=five
2
12
115
7,544
The next Svelte adventure in which I'm going to show you how to make beautiful presentations with ease looms on the horizon. 🪄
4
4
114
5,815
The SvelteKit Enterprise Stack had some upgrades:
- ⚡️ Supercharged forms that make working with forms easy
- 💵 Stripe payments to meet revenue goals
- 💌 Beautiful and consistent icons
github.com/joysofcode/enterp…
6
10
117
8,323
I'm excited to release the video where we build a SVG animation library inspired by Motion Canvas using Svelte stores! 🔥
📺 piped.video/_jWnyJRKOvU
✍️ joyofcode.xyz/svg-animation-…
4
19
121
8,976