This design is pretty brilliant because there's no need for a traditional game loop; you're outsourcing that work to Svelte's reactivity and just responding to reactive state events which makes the code extremely easy to reason about. Great work!
Great tutorial that I just finished in one sitting. Only issue I had was my Firefox was not supporting nested CSS and it took me 15 minutes to figure that out lol.
This is great, thank you. Any idea why the emoji on the selected cards are are only displaying when the second card is selected just before they flip back? I've tried to add a new "backface-visibility: visible" to the selected class.
great work bro... can you build it more complex like you said in the end of the video. Maybe Learn Svelte By Making A Matching Game PART 2 Add a Settings Layer and some fancy Animations or so.
I really like Svelte, but their push for SSR is kind of a big turn off if I'm being honest. I don't want or need SSR in most cases. Hell the only time you would really want it is for your marketing platform for SEO purposes. The majority of the time it makes little sense, and no I don't want my front end app and my backend app to be the same. I prefer a microservice architecture because it significantly reduces risk. I can push changes to my backend without pushing my frontend for instance, etc. Separation of concern is also a good pattern to follow. This is truly my biggest gripe with the platform really. I know you can disable and only enable it as needed but, it's really their hardcore push for it that kind of bothers me.
It is the right move. The lack of SSR was an abject failure of framework based development. People are woefully undereducated on how bad that is for SEO. This should absolutely, 100%, be a baked in feature to any web development framework worth a damn. I have never and will never take any web framework seriously without it.
To be honest I think you're looking at it wrong. Nearly everything svelte has to offer you can opt in or out. You don't have to use SSR at all .... and disabling ssr is as easy as 1 +layout.ts file with 1 line of code which would disable SSR everywhere in the app. Don't want your front end and backend to be the same? use the static adapter, but you can still keep the amazing front end routing capabilities for a SPA and you don't need to write your own logic. Hell don't want any backend logic and just a bunch on fetching on the front end, it's easily done. Sveltekit can be adapted very well into anything you want it to.
SSR is very easy to disable in SvelteKit. Svelte (not kit) is just a component framework with no concept of the server. "I don't want or need SSR in most cases... it's really their hardcore push for it that kind of bothers me." SSR by default seems like the correct move to me. Maybe you're just not a typical user, and I don't see why having to opt out of SSR is such a big deal.
This design is pretty brilliant because there's no need for a traditional game loop; you're outsourcing that work to Svelte's reactivity and just responding to reactive state events which makes the code extremely easy to reason about. Great work!
There seems to be a lack of this type of tutorial these days. It's nice to learn through examples.
They take a lot of time and effort but don't have the same amount of interest compared to easier to make content.
Tom is a genius.
JDSL is the successor to Svelte.
@@kollpotato no one is truly ready for that level of power, yet
Tom is a genius.
Have you met Tom? He's a literal genius.
This Tom dude getting roasted 24/7 and has no idea its happening.
Thanks so much! Your content makes me more excited to learn Svelte.
Great video! It covers many aspects of Svelte, and as a bonus, it's a fun project
Tom is a genius
Great tutorial that I just finished in one sitting. Only issue I had was my Firefox was not supporting nested CSS and it took me 15 minutes to figure that out lol.
Sorry! CSS nesting is coming in the next Firefox release: caniuse.com/css-nesting.
@@JoyofCodeDev If you have beta or developer FireFox it should be working.
Cool. It's finally here. Thanks man 👍
Great video, I like your cording style
What os ur using?
Thank you sm for making learning svelte easy ❤
It's in the description.
Thank you@@JoyofCodeDev
Awesome!
My component framework tier list: Svelte: A | React: C | Angular: F. Svelte could be S if a few minor rough edges are worked out.
This is great, thank you. Any idea why the emoji on the selected cards are are only displaying when the second card is selected just before they flip back? I've tried to add a new "backface-visibility: visible" to the selected class.
I support the question, the same problem
what did you use to bring open the emoji panel in vscode?
Do you mean when he did windowskey + . ?
I use Smile which is an emoji picker for Linux.
whatsthe color theme in your code editor?
great work bro...
can you build it more complex like you said in the end of the video.
Maybe Learn Svelte By Making A Matching Game PART 2
Add a Settings Layer and some fancy Animations or so.
I was inspired by github.com/Rich-Harris/ematchi which is a more advanced example and has everything you want.
very cool
which vs code theme is that bro?
Link to what I use is in the description.
noice noice noice noice noice noice noice
Now do it with x-state 😉
I wanted to use XState.
are u latvian bro
🇭🇷
I really like Svelte, but their push for SSR is kind of a big turn off if I'm being honest. I don't want or need SSR in most cases. Hell the only time you would really want it is for your marketing platform for SEO purposes. The majority of the time it makes little sense, and no I don't want my front end app and my backend app to be the same. I prefer a microservice architecture because it significantly reduces risk. I can push changes to my backend without pushing my frontend for instance, etc. Separation of concern is also a good pattern to follow. This is truly my biggest gripe with the platform really. I know you can disable and only enable it as needed but, it's really their hardcore push for it that kind of bothers me.
SvelteKit is more SSR oriented, but SvelteJs should not be, if I am not mistaken.
It is the right move. The lack of SSR was an abject failure of framework based development. People are woefully undereducated on how bad that is for SEO. This should absolutely, 100%, be a baked in feature to any web development framework worth a damn. I have never and will never take any web framework seriously without it.
To be honest I think you're looking at it wrong.
Nearly everything svelte has to offer you can opt in or out.
You don't have to use SSR at all .... and disabling ssr is as easy as 1 +layout.ts file with 1 line of code which would disable SSR everywhere in the app.
Don't want your front end and backend to be the same? use the static adapter, but you can still keep the amazing front end routing capabilities for a SPA and you don't need to write your own logic.
Hell don't want any backend logic and just a bunch on fetching on the front end, it's easily done.
Sveltekit can be adapted very well into anything you want it to.
SSR is very easy to disable in SvelteKit. Svelte (not kit) is just a component framework with no concept of the server. "I don't want or need SSR in most cases... it's really their hardcore push for it that kind of bothers me." SSR by default seems like the correct move to me. Maybe you're just not a typical user, and I don't see why having to opt out of SSR is such a big deal.
u are so bad at that game
I'm a professional gamer.