Building a Advent of TypeScript clone with SvelteKit, Svelte 5, monaco editor, Tailwind CSS
After working through Advent of TypeScript, I began to wonder how this code challenge platform was built. Join me on this coding journey as I attempt to build a clone of it.
00:00:00 Introduction
00:01:36 Demo
00:02:42 Proof of Concept
00:33:11 Building the layout
01:14:35 Building the API
01:50:40 Adding monaco editor into the layout
02:18:02 Fixing the monaco marker
02:36:41 Summary
Advent of TypeScript https://typehero.dev/aot-2023
Advent of Typescript 2023 - Solution Walkthrough • Advent of Typescript 2023 - Solution ...
Source code https://github.com/tanhauhau/advent-o...
Tailwind CSS https://tailwindcss.com/
Monaco Editor https://microsoft.github.io/monaco-ed...
Marked https://github.com/markedjs/marked
SvelteKit https://kit.svelte.dev/
------
VS Code Theme: Dracula at night https://marketplace.visualstudio.com/...
ZSH Theme: bullet-train https://github.com/caiogondim/bullet-...
🥰 Support me https://www.buymeacoffee.com/lihautan
🔗 Want to learn more from me? Check out these links:
📚 My new book: https://packt.link/Z4hXD
Twitter: / lihautan
Blog: https://lihautan.com/
Newsletter: https://lihautan.com/newsletter
Discord: / discord
Thanks for watching 🥰 -- with love, Li Hau
