My friend @pchiwan did a small game with Sveltejs, I read his code and feel curiosity and a bit of motivation to start to play with it, but some questions come to my head. Why do I want to spend my time learning Svelte?
The state of Svelte?
- 88% Satisfaction after using it, #2 winning over Vue.
- 67% Interest for developers, #1 over React, Vue, Angular, and Preact.
- Just 10% of awareness.
These numbers can be read as wherever you want, I know Svelte is a bit new if you want to read the full details you can see more than 45% of developers are not playing with Svelte. - 24.7% never hear about it = not feedback - 22.6% Hear but not interest = not feedback - 44% would like to learn. = people like me 🙂
What is Svelte?
In his official website defines Svelte as a tool to build fast web apps, I can say his focus is building high-performance web apps with his syntax and using ES6.
Why should I need to play or learn Svelte?
I love to have options, every framework solves the problems with a different or similar approach, we have components, routing or state solutions in Angular, Vue, React and now in Svelte.
But Svelte has a focus on performance, today some developers only focus on an easy way to build his apps our create component without care performance cost.
How am I starting with Svelte?
I was reading the official documentation is clear and easy to follow, you can spend maybe 1 hour or 2 in the tutorial to have a full picture of Svelte. https://svelte.dev/tutorial/basics
Read is overrated I’m a video guy?
The official documentation is not complex but if you don’t want to read, I recommend taking these free courses on youtube.
1- Freecodecamp has good svelte tutorial https://www.youtube.com/watch?v=vhGiGqZ78Rs
2- Traversery https://www.youtube.com/watch?v=uK2RnIzrQ0M&t=2s
I want more than a simple todo or hello world.
Svelte has a real-world app with routing, state, authentication, patterns, crud can be used as a guide to building big apps.
Before to start coding
I have a few things to know before start coding with Svelte.
- Use the Svelte Chrome extension. for debug your apps.
Use an editor Syntax highlight
- The Routing is not part of Svelte, “Yet” (29 December 2019)” but here you have few options :
- The CLI , Svelte uses degit to manage the svelte default template.
- npx degit sveltejs/template my-2020-app
- Svelte doesn’t have “yet” typescript support.
- Sapper is a next-js, nuxtjs or gatsby alternative.
I spend 40 minutes reading the documentation, I didn’t finish yet but I build a small app just to learn syntax, create components, use nested components and send data between them and was easy and fun, I hope to explain the code in a future post about syntax and how to create components.
Hopefully, that will give you a bit of a head-start with Svelte, and help you, if you enjoyed this post, share it.
Thanks for reading!