- 250
- 523 505
lihautan
Singapore
เข้าร่วมเมื่อ 16 ก.ย. 2017
Hi 👋 , I am lihautan (full name Tan Li Hau) a frontend engineer at Shopee Singapore.
5 things about me 😎
1️⃣ I grew up in Penang, Malaysia (a place with great food 🤤 )
2️⃣ I am a core maintainer of Svelte github.com/sveltejs/svelte
3️⃣ I love frontend technologies 😍
4️⃣ I love sharing tips on Svelte, React, CSS
5️⃣ I love explaining things one layer of abstraction below
🥰 If you like what I am doing, consider buying me a coffee www.buymeacoffee.com/lihautan
5 things about me 😎
1️⃣ I grew up in Penang, Malaysia (a place with great food 🤤 )
2️⃣ I am a core maintainer of Svelte github.com/sveltejs/svelte
3️⃣ I love frontend technologies 😍
4️⃣ I love sharing tips on Svelte, React, CSS
5️⃣ I love explaining things one layer of abstraction below
🥰 If you like what I am doing, consider buying me a coffee www.buymeacoffee.com/lihautan
Preparing Svelte Frontend Interview
Tips on preparing for Frontend Interview in Svelte, and live coding interview demo.
Sign up GreatFrontEnd www.greatfrontend.com/prepare?fpr=li-hau97 to prepare for frontend interviews
00:00:00 Introduction
00:01:41 Tip 1: Familiar with the process
00:04:33 Tip 2: Practice practice practice
00:06:59 Tip 3: Have a study plan
00:07:52 Demo: Build a digital clock
00:11:53 Ask clarifying questions
00:14:15 Breakdown the problem
00:26:17 Test frequently
00:32:52 Name your variable well
01:00:55 Summary
Svelte Jobs sveltejobs.com/?
Front End Interview Guidebook www.greatfrontend.com/front-end-interview-guidebook?fpr=li-hau97
Digital Clock in Svelte www.greatfrontend.com/questions/user-interface/digital-clock/svelte?fpr=li-hau97
------
VS Code Theme: Dracula at night marketplace.visualstudio.com/items?itemName=bceskavich.theme-dracula-at-night
ZSH Theme: bullet-train github.com/caiogondim/bullet-train.zsh
🥰 Support me www.buymeacoffee.com/lihautan
🔗 Want to learn more from me? Check out these links:
📚 My new book: packt.link/Z4hXD
Twitter: lihautan
Blog: lihautan.com/
Newsletter: lihautan.com/newsletter
Discord: discord.gg/RbtgYvExVJ
Thanks for watching 🥰 -- with love, Li Hau
Sign up GreatFrontEnd www.greatfrontend.com/prepare?fpr=li-hau97 to prepare for frontend interviews
00:00:00 Introduction
00:01:41 Tip 1: Familiar with the process
00:04:33 Tip 2: Practice practice practice
00:06:59 Tip 3: Have a study plan
00:07:52 Demo: Build a digital clock
00:11:53 Ask clarifying questions
00:14:15 Breakdown the problem
00:26:17 Test frequently
00:32:52 Name your variable well
01:00:55 Summary
Svelte Jobs sveltejobs.com/?
Front End Interview Guidebook www.greatfrontend.com/front-end-interview-guidebook?fpr=li-hau97
Digital Clock in Svelte www.greatfrontend.com/questions/user-interface/digital-clock/svelte?fpr=li-hau97
------
VS Code Theme: Dracula at night marketplace.visualstudio.com/items?itemName=bceskavich.theme-dracula-at-night
ZSH Theme: bullet-train github.com/caiogondim/bullet-train.zsh
🥰 Support me www.buymeacoffee.com/lihautan
🔗 Want to learn more from me? Check out these links:
📚 My new book: packt.link/Z4hXD
Twitter: lihautan
Blog: lihautan.com/
Newsletter: lihautan.com/newsletter
Discord: discord.gg/RbtgYvExVJ
Thanks for watching 🥰 -- with love, Li Hau
มุมมอง: 974
วีดีโอ
Building a Advent of TypeScript clone with SvelteKit, Svelte 5, monaco editor, Tailwind CSS
มุมมอง 2.6K6 หลายเดือนก่อน
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...
Advent of Typescript 2023 - Solution Walkthrough
มุมมอง 9347 หลายเดือนก่อน
typehero.dev/aot-2023 Solution: github.com/tanhauhau/advent-of-typescript-2023-solution 00:00:00 Introduction 00:02:35 Day 1 00:04:02 Day 2 00:05:19 Day 3 00:06:22 Day 4 00:08:30 Day 5 00:11:29 Day 6 00:13:35 Day 7 00:18:28 Day 8 00:21:42 Day 9 00:27:04 Day 10 00:29:19 Day 11 00:34:42 Day 12 00:41:45 Day 13 00:52:25 Day 14 00:55:14 Day 15 01:02:45 Day 16 01:12:10 Day 17 01:16:24 Day 18 01:20:49...
SvelteKit 路由 - 剩余参数,可选参数,参数匹配
มุมมอง 49410 หลายเดือนก่อน
📚 我的新书 《Real-world Svelte》packt.link/Z4hXD 🇬🇧 English Tutorials th-cam.com/play/PLoKaNN3BjQX0Ch8C6XHjG4K1Q75ugf6yG.html 🎧 SvelteKit 新手入门 th-cam.com/play/PLoKaNN3BjQX0JMB5ehfQgx0pF28oxWBEJ.html 🎧 Svelte Tutorial for Beginners th-cam.com/play/PLoKaNN3BjQX3mxDEVG3oGJx2ByXnue_gR.html 📚 SvelteKit kit.svelte.dev 📚 Svelte svelte.dev VS Code 主题: Dracula at night marketplace.visualstudio.com/items?itemN...
SvelteKit 路由 - 文件即路由,动态参数
มุมมอง 29410 หลายเดือนก่อน
📚 我的新书 《Real-world Svelte》packt.link/Z4hXD 🇬🇧 English Tutorials th-cam.com/play/PLoKaNN3BjQX0Ch8C6XHjG4K1Q75ugf6yG.html 00:00 介绍 01:06 真实世界中的路由 03:49 SvelteKit文件即路由 09:27 动态参数 14:15 总结,订阅和关注! 🎧 SvelteKit 新手入门 th-cam.com/play/PLoKaNN3BjQX0JMB5ehfQgx0pF28oxWBEJ.html 🎧 Svelte Tutorial for Beginners th-cam.com/play/PLoKaNN3BjQX3mxDEVG3oGJx2ByXnue_gR.html 📚 SvelteKit kit.svelte.dev 📚 Svelte svelte.d...
SvelteKit Routing - Rest parameters, Optional parameters, and Params matchers
มุมมอง 1K11 หลายเดือนก่อน
00:00 Introduction 01:56 Sneak peak: Getting the param value using $page.params 03:43 Rest parameters 08:37 New book: Real-World Svelte packt.link/Z4hXD 08:57 Optional parameters 15:22 Params matcher 23:39 Subscribe and stay tune! 24:20 Advanced Svelte workshop london.cityjsconf.org/buytickets/ 🎧 SvelteKit Tutorial For Beginners th-cam.com/play/PLoKaNN3BjQX0Ch8C6XHjG4K1Q75ugf6yG.html 🎧 Svelte T...
SvelteKit Routing - the +page.svelte component and dynamic parameters
มุมมอง 1.1K11 หลายเดือนก่อน
00:00 Introduction 00:15 Route patterns from real world 05:04 New book: Real-World Svelte packt.link/Z4hXD 05:23 SvelteKit Routing with page.svelte 09:39 Dynamic Parameters 13:59 Subscribe and stay tune! 15:10 Advanced Svelte workshop london.cityjsconf.org/buytickets/ 🎧 SvelteKit Tutorial For Beginners th-cam.com/play/PLoKaNN3BjQX0Ch8C6XHjG4K1Q75ugf6yG.html 🎧 Svelte Tutorial for Beginners th-ca...
初始化 SvelteKit 项目
มุมมอง 26411 หลายเดือนก่อน
📚 我的新书 《Real-world Svelte》packt.link/Z4hXD 🇬🇧 English Tutorials th-cam.com/play/PLoKaNN3BjQX0Ch8C6XHjG4K1Q75ugf6yG.html 🎧 SvelteKit 新手入门 th-cam.com/play/PLoKaNN3BjQX0JMB5ehfQgx0pF28oxWBEJ.html 🎧 Svelte Tutorial for Beginners th-cam.com/play/PLoKaNN3BjQX3mxDEVG3oGJx2ByXnue_gR.html 📚 SvelteKit kit.svelte.dev 📚 Svelte svelte.dev VS Code 主题: Dracula at night marketplace.visualstudio.com/items?itemN...
客户端渲染 vs 服务端渲染
มุมมอง 32911 หลายเดือนก่อน
📚 我的新书 《Real-world Svelte》packt.link/Z4hXD 🇬🇧 English Tutorials th-cam.com/play/PLoKaNN3BjQX0Ch8C6XHjG4K1Q75ugf6yG.html 🎧 SvelteKit 新手入门 th-cam.com/play/PLoKaNN3BjQX0JMB5ehfQgx0pF28oxWBEJ.html 🎧 Svelte Tutorial for Beginners th-cam.com/play/PLoKaNN3BjQX3mxDEVG3oGJx2ByXnue_gR.html 📚 SvelteKit kit.svelte.dev 📚 Svelte svelte.dev VS Code 主题: Dracula at night marketplace.visualstudio.com/items?itemN...
Creating a SvelteKit Project
มุมมอง 1.4K11 หลายเดือนก่อน
00:00 Introduction 00:15 npm create svelte@latest 03:38 New book: Real-World Svelte packt.link/Z4hXD 03:58 Starting dev server 07:32 Project tour 13:53 Subscribe and stay tune! 14:27 Advanced Svelte workshop london.cityjsconf.org/buytickets/ 🎧 SvelteKit Tutorial For Beginners th-cam.com/play/PLoKaNN3BjQX0Ch8C6XHjG4K1Q75ugf6yG.html 🎧 Svelte Tutorial for Beginners th-cam.com/play/PLoKaNN3BjQX3mxD...
SvelteKit 介绍
มุมมอง 54311 หลายเดือนก่อน
📚 我的新书 《Real-world Svelte》packt.link/Z4hXD 🎧 SvelteKit 新手入门 th-cam.com/play/PLoKaNN3BjQX0JMB5ehfQgx0pF28oxWBEJ.html 🎧 Svelte Tutorial for Beginners th-cam.com/play/PLoKaNN3BjQX3mxDEVG3oGJx2ByXnue_gR.html 📚 SvelteKit kit.svelte.dev 📚 Svelte svelte.dev VS Code 主题: Dracula at night marketplace.visualstudio.com/items?itemName=bceskavich.theme-dracula-at-night ZSH 主题: bullet-train github.com/caiogon...
Introduction to SvelteKit
มุมมอง 1.8K11 หลายเดือนก่อน
00:00 Introduction to SvelteKit 02:04 New book: Real-World Svelte packt.link/Z4hXD 02:03 Subscribe and stay tune! 02:38 Advanced Svelte workshop london.cityjsconf.org/buytickets/ 🎧 SvelteKit Tutorial For Beginners th-cam.com/play/PLoKaNN3BjQX0Ch8C6XHjG4K1Q75ugf6yG.html 🎧 Svelte Tutorial for Beginners th-cam.com/play/PLoKaNN3BjQX3mxDEVG3oGJx2ByXnue_gR.html 📚 SvelteKit kit.svelte.dev 📚 Svelte sve...
Photo Album SvelteKit with shallow routing, Cloudinary, Tailwind CSS
มุมมอง 2.6K11 หลายเดือนก่อน
Be sure to checkout cloudinary cld.media/lihautanphotoapp Learn how to build a full stack app using cloudinary, sveltekit, and tailwind css. This entire project was build without using a database; instead, we use all of the built in cloudinary functionality for viewing images, uploading images, auto-tagging, auto-captioning and apply filters. Link to code github.com/tanhauhau/cloudinary-photo-a...
Advent of Code 2023 - Day 17 Clumsy Crucible
มุมมอง 17411 หลายเดือนก่อน
Advent of Code 2023 - Day 17 - Clumsy Crucible adventofcode.com/2023 Solution: github.com/tanhauhau/advent-of-code-2023/ Illustrations generated via ChatGPT with the paragraphs as prompt #adventofcode2023 🔗 Want to learn more from me? Check out these links: Twitter: lihautan/ Blog: lihautan.com/
Advent of Code 2023 - Day 16 - The Floor Will Be Lava
มุมมอง 18211 หลายเดือนก่อน
Advent of Code 2023 - Day 16 - The Floor Will Be Lava adventofcode.com/2023 Solution: github.com/tanhauhau/advent-of-code-2023/ Illustrations generated via ChatGPT with the paragraphs as prompt #adventofcode2023 🔗 Want to learn more from me? Check out these links: Twitter: lihautan/ Blog: lihautan.com/
Advent of Code 2023 - Day 15 Lens Library
มุมมอง 12311 หลายเดือนก่อน
Advent of Code 2023 - Day 15 Lens Library
I spent the entire afternoon trying to reimplement Playwright Component Tests
มุมมอง 1.2Kปีที่แล้ว
I spent the entire afternoon trying to reimplement Playwright Component Tests
Advent of Code 2023 - Day 14 Parabolic Reflector Dish
มุมมอง 166ปีที่แล้ว
Advent of Code 2023 - Day 14 Parabolic Reflector Dish
Advent of Code 2023 - Day 13 Point of Incidence
มุมมอง 161ปีที่แล้ว
Advent of Code 2023 - Day 13 Point of Incidence
Advent of Code 2023 - Day 12 Hot Springs
มุมมอง 174ปีที่แล้ว
Advent of Code 2023 - Day 12 Hot Springs
Advent of Code 2023 - Day 11 Cosmic Expansion
มุมมอง 149ปีที่แล้ว
Advent of Code 2023 - Day 11 Cosmic Expansion
Advent of Code 2023 - Day 9 Mirage Maintenance
มุมมอง 137ปีที่แล้ว
Advent of Code 2023 - Day 9 Mirage Maintenance
Advent of Code 2023 - Day 8 Haunted Wasteland
มุมมอง 145ปีที่แล้ว
Advent of Code 2023 - Day 8 Haunted Wasteland
Advent of Code 2023 - Day 6 - Wait For It
มุมมอง 149ปีที่แล้ว
Advent of Code 2023 - Day 6 - Wait For It
Advent of Code 2023 - Day 5 - If You Give A Seed A Fertilizer
มุมมอง 174ปีที่แล้ว
Advent of Code 2023 - Day 5 - If You Give A Seed A Fertilizer
Advent of Code 2023 - Day 4 - Scratchcards
มุมมอง 158ปีที่แล้ว
Advent of Code 2023 - Day 4 - Scratchcards
Advent of Code 2023 - Day 3 - Gear Ratios
มุมมอง 219ปีที่แล้ว
Advent of Code 2023 - Day 3 - Gear Ratios
Advent of Code 2023 Day 2 - Cube Conundrum
มุมมอง 215ปีที่แล้ว
Advent of Code 2023 Day 2 - Cube Conundrum
Thanks bro! the name of these tools: webpack , rollup, vite and snowpack
Great🤗😁😁
Lihautan i would love to see the 2024 one!
please reduce the background music
oh man.. you are great
Amazing thanks
Thanks Lihau
Thanks Lihau
missing lihautan 😥😥😥
nice addition of the background music
Great video! Thank you very much 🙏
Thanks you so much 😁
This video is awesome, your content is awesome, just let the backgorund music to be lower in the next one and it would be perfect
still commenting on your videos which are great for the begginers as well as for the intermedieat people 👌👌
top notch quality of the videos thanks li for this awesome tutorial on svelte hope you make also for the javascript
Bro, please continue this series
Thank you so much! And please remove the background music, it’s very disturbing.
Nice explanation. Please avoid music and fillers.
Hi Li Hau! I wanna know your age Please🙏
Please making this playlist in a English
dude, cut the music please
i just love every single video from Lihautan thanks a lott ...i have been learning a lot from you
Is there any reason why Svelte chose to use the : directive over say, camel case? Especially now that event handler names are no longer using said directive. "onclick" just sounds wrong to me
When these video was made what was the svelte version?
svelte 3
This has been resolved in the latest svelte 4 and 5 right? cause i am doing it right now and not getting such functional errors
when i cant tell the difference between "can" and "can't" when he's speaking, there's a 50/50 chance im either following on the right track or im veering off to get my nutsaq stuck in the cd tray
I am new to Web development, and I have learned some JavaScript. Unfortunately, I don't want to learn React. So I am learning Svelte and SvelteKit. Now, when I wanted to start learning about Web development, I was advised that I should have a project in mind. Based on that advice, I have settled on the project I want to build: I want to build a Social Media Application like Facebook, but I don't know where and how to start. Please, can you do a TH-cam series that can teach us to build massive Projects with Svelte and SvelteKit -- when you do find the time for it. WHAT WOULD I WANT? Here ( th-cam.com/video/z1UMKqMN3VQ/w-d-xo.html ) is a series on building a Facebook clone with the MERN Stack (MongoDB, Express, React and Node) I will need you to do the same thing that this person did (Facebook clone), using Svelte, Sveltekit, Postgres Database, and Drizzle ORM. Regards.
great tuts broooooo. thank you from indonesia
Hey, Thank you so much <3
awesome. Thank you!
thanks man, this is great
Hi Lihau, thanks for the video. Can I do this inside a svelte action? Because +page.server.ts is server side, and store values are client side data
hello hello
Amazing!
Awesome🎉
I request you dont change syntax in svelte 5 😢
i love it, the video i didnt think i needed but so desperately did. the music though.. XD if you ever think about a reupload. that be awesome if it didnt include the music ;) overall great
The music is so distracting
Great video! Thanks for the useful information!
Glad it was helpful!
Awesome video Li Hau! Thanks for featuring GreatFrontEnd 🎉
Thank you too!
Huge Thumbs up 👍 for such a valuable tips. Thanks brother for your kind sharing. ❤
who is even hiring for svelte???
you can find a list of svelte jobs here: sveltejobs.com/
@@lihautan lol There are relatively low or few jobs as compared to other frameworks
@@noobgamer7034 They are still great jobs. I got an opportunity to interview, from a company i found on Svelte jobs, but I didn';t get the job. SO now Lihau wants to show me how I can pass it, Thanks Lihau
thanks a lotttt
We miss you man!
Thanks keep uploading good stuff.
Another great video. Thanks!
Please continue this series
huge thumbs up bro
loved it
Great video. 👍 Thanksss😘