Uploaded April 2024 | Updated September 2026, 1 week ago

---

Using Shiki Magic Move to animate code blocks.

🔴 Patreon: patreon.com/joyofcode
𝕏 Twitter: twitter.com/joyofcodedev
💬 Discord: discord.com/invite/k6ZpwAKwwZ
🔥 Uses: https://www.joyofcode.xyz/uses

🔗 Animated Code Blocks Using Shiki: https://joyofcode.xyz/animated-code-blocks-using-shiki
🔗 Shiki Magic Move: https://shiki-magic-move.netlify.app/
🔗 The Magic In Shiki Magic Move: antfu.me/posts/shiki-magic-move
🔗 Playlist: youtube.com/playlist?list=PLA9WiRZ-IS_y2-ZbmGRKNaeEULXKK_WJE&si=lKlYv11pQUGJjNzN

🔖 Timestamps

0:00 Intro
2:27 Project Setup
6:11 Creating The Shiki Highlighter
8:35 Shiki Magic Move Component
16:52 Shiki Magic Move Renderer Component
24:00 Shiki Magic Move Options
24:48 Outro

#joyofcode #sveltekit #svelte