Svelte is surprisingly easy
HTML-код
- Опубликовано: 20 июн 2022
- A first look at Svelte JS.
💬 Topics:
- The Svelte compiler;
- Reactive statements;
- Routing;
- State management;
- Working with Svelte.
🔥 The "First Impressions" series:
- Svelte Kit - • Svelte Kit is a nice s...
- Fresh - • Fresh JS is worth chec...
- Astro - • Astro JS is here to stay
Boring
Well, all things considered it’s still coding… what do you expect? :))
@@awesome-coding it's frontend so yeah basically just as interesting as a video about low code
Decent things are usually boring. But doing their job perfectly.
said a guy who has a public playlist of 5 hours long video 💀
I honestly wonder who is making these bot users.
RUclips is filled of them, and they're just giving destructive criticism.
I'm sure they're all hate-bots.
I don't often comment, but your video was informative. Keep it up bro you got what it takes.
Thanks for the kind words! I really appreciate it!
I wish Svelte a success. Compiled disappearing frameworks is the next big thing in frontend. Authors got it right.
You are right about that - definitely the direction would be to move more of the workload from the initial load time to the compile time.
Great video! Thanks! I never worked with Svelte before but I will definetely give it a go in the near future. Keep up the awesome work!
Glad it was helpful!
I really like the how Harris took good parts from different stuff.
I love Svelte passionately!!!
It is starting to grow on me as well :)
Your work introducing Svelte is amazing, great job.
About Svelte: I didn't like the syntax style very much, although it doesn't change the DOM it changes a lot the way of writing javascript with its own tokens that require specific learning that is not reused in any other framework.
When a framework is that specific, its syntax must be more elegant and sexy than the others to become a preference, and at least for me that wasn't the feeling.
Keep doing the great job, you're really awesome!
Thank you for the feedback and the kind words! I really appreciate it!
I fell exactly the same. It's very difficult to explain why you need such a different way of doing things when React or solid feel like you are writing plain javascript / typescript.
Svelte is really intuitive and easy to learn I love it
Great video, now I can see why people would recommend Svelte over React.
This is amazing. Thank you so much
You're very welcome and good luck!
Next week I'm releasing a Svelte + Deno full stack app tutorial - maybe you'll find it useful to get started :)
I like this step by step tutorial 😍
svelte is so awesome. makes things fun!
Love this! Great video!
Thank you!!
that was really nice cause you actually showed a lot of code -- way easier to understand this way
Glad you found it useful!
Awesome job. Keep up the good work.
Thanks, will do!
Great video!!
Glad you liked it!
Just a small, not svelte-related sidenote: You appear to use zsh but with a bash prompt, since your terminal showed a \w at the beginning. The zsh equivalent to your prompt is:
PS1='%~ %(?.#.$) '
Thanks!
awesome videos 🚀
Appreciate it!
i dont see the full video yet, but Svelte looks like a mix good parts of Angular and React, i really interested!
You should!
i think its quite different than both of them, because it moves the work into compile step to avoid unused code, and not to mention, it doesnt use vdom, which gives a large performance bonus. also, usually there is 30-40% less code required to create the same component in svelte compared to react
Very clear video
Thank you!
14:37 you don't need to case store type, you can define it using generic parameter like writable([])
Thank you!
@@awesome-coding Great video!
I’d like also see animations, networking, testing, components interaction in svelte.
Thank you for your suggestion!
Nothing better than React. Btw I just started a week ago, gonna make my own framework because nothin fits the bill for me.
If you like React, take a look at SolidJS (www.solidjs.com/). It might be what you are looking for.
Also Fresh (fresh.deno.dev/) just reached version 1.0. It uses Preact under the hood, and it looks like one of the frameworks that'll attract a lot of people on the long term.
Where is that chart at the beginning?
2021.stateofjs.com/en-US/libraries/front-end-frameworks
nice video, bg music?
Thanks!
Caballero - Ofshane (ruclips.net/video/pTOVmsPJIBY/видео.html).
You'll find it in the RUclips music library.
Please try angular too
I'll have a video on Angular fairly soon. It is my default go to framework for any team larger than 4-5 frontend devs.
Personally I don't like script tags or templating. I think JSX and the idea of turning html elements with attributes into functions with arguments was brilliannt.
The kind of flexibility that gives you. Like the things you can do with just JSX is a killer feature for me. Like web components... but good. And far more declarative.
I can understand the draw of Svelte though. Simple reactivity. It's nice. Very similar to Blazor.
The transition back Svelte's templates was the biggest drawback for me as well. Funnily enough, I felt the same way when I first tried JSX :D
JSX is trash, curly braces hell, no if statements, having to use array.map to do a basic loop and fucked up html/css properties name make it way worse than a templating language.
@@awesome-coding I really hope QwikJS becomes a thing. It's in a rough pre-alpha state right now, but Resumability with JSX is a dream.
I don't necesarly find it easy and the main reason is that it uses *yet another set of conventions* which makes it look like a new JavaScriptish language with some PHPish flavours.
I get what you are saying, but I feel like feel like this is pretty much the norm in the frontend space - every few years we are completely rethinking the way in which we are writing apps. While Svelte comes with a lot of new approaches, I think the learning curve is still acceptable, and it is worth it considering the benefits.
Because Svelte is compiler
As much as being a framework Svelte is also a programming language built on top of js, html, and css. It adds some bits that are otherwise absent, and therefore makes some things possible that otherwise would not be. But all js is valid Svelte, so all your existing knowledge carries over. And svelte uses js ideoms for everything, so it's not like it does things is ways that are unusual is js. It just adds some useful stuff that is missing.
Great overview of the benefits!
Wtf, why using .then to modify the variable instead of awaiting the future?? Thats horrible code
Hey! Thanks for the feedback! It's a matter of preference I guess. If there is only one promise I need to handle, and there is no callback hell type of a situation, I usually go with .then instead of async / await. Call it a bad habit maybe :)
@@awesome-coding it definetly looks like something that you would do on React, but not the Svelte way. I love Svelte for its simplicity on side effects, futures,…
I'll keep that in mind - thanks!
Saying it is horrible code is such a stretch.
It would be a horrible code when you have multiple callbacks, depending on each other, callback hell.
If someone uses ".then" it doesn't automatically makes it wrong or horrible, is just that it has the potential to become messy if the pattern keeps going deeper and deeper.
But if it is just one call, it is fine and completely understandable.
Completely understandable if you learnt all about promises of course, if someone only uses async/await without learning what is a promise, that ".then" might look alien.
instead of a ternary operator for your class statements, you should use class:active={task.status === ToDo}. But otherwise, i loved the video
Hey! That's a very good point - thanks!
I also mentioned this briefly at the 14:05 mark, but I should have done it in a bit more detail probably.