Creating an Animated Tier List Component with Svelte
My Svelte & SvelteKit Course: https://www.udemy.com/course/svelte-a...
Follow me on X: https://x.com/alialaa
Follow me on Bluesky: https://bsky.app/profile/alialaa.dev
Final Code: https://github.com/alialaa/svelte-tie...
Branch for starting point: https://github.com/alialaa/svelte-tie...
FLIP Animation: https://aerotwist.com/blog/flip-your-...
00:00:00 Demo
00:01:12 Project Setup
00:02:59 Displaying the Tiers (Commit: https://github.com/alialaa/svelte-tie...)
00:18:41 Adding and Displaying Images (Commit: https://github.com/alialaa/svelte-tie...)
00:28:13 The Image Tiers Popover (Commit: https://github.com/alialaa/svelte-tie...)
00:35:48 Adding Images to Tiers (Commit: https://github.com/alialaa/svelte-tie...)
00:43:24 Swapping, Adding and Deleting Tiers (Commit: https://github.com/alialaa/svelte-tie...)
00:51:59 Adding Transitions and Animations (Commit: https://github.com/alialaa/svelte-tie...)
01:03:40 The Crossfade Transition (Commit: https://github.com/alialaa/svelte-tie...)