LBRY Block Explorer

LBRY Claims • 27.-實作簡易-svelte（2）-加入-if

671ad01bf7ede9f1162099b583a777cec520bad4

Published By
@愷開寫程式
Created On
27 Mar 2021 01:36:20 UTC
Transaction ID
b6be3d53ae7ab5851442ca34ec0549c89a6d2a009a5d0cff9ee7b4ab2542794b
Cost
Safe for Work
Free
Yes
27. 實作簡易 Svelte（2）- 加入 If Block、Each Block | 30 天從 0 到 1 學 Svelte | 第 12 屆 IT 鐵人賽
第 12 屆 IT 鐵人賽影片教學 — 30 天從 0 到 1 學 Svelte

◼︎ 本集內容
昨天我們實作了一個簡單的 HTML 解析器，可以解析簡單的 HTML 語法，今天我們會加入 Svelte 的語法：If Block 與 Each Block 這兩個功能，讓這些語法也能產生對應的語法樹。

這樣一來我們就可以準備做程式碼生成還有搭配 Runtime 程式碼！

◼︎ 相關連結：

・Svelte 官網 https://svelte.dev
・Github Repo https://github.com/kjj6198/tiny-svelte
・本日實作線上測試：https://kjj6198.github.io/tiny-svelte/
...
https://www.youtube.com/watch?v=OSJcGhht2C8
Author
Content Type
Unspecified
video/mp4
Language
Open in LBRY

More from the publisher

Controlling
VIDEO
你
你好世界，一起來學程式吧～
lbry://@愷開寫程式/你好世界，一起來學程式吧～
在科技進步的現代，每個人都幾乎擁有一台電腦，甚至在手機上也可以撰寫程式了！蘋果創辦人賈伯斯也曾說，每個人都應該學習如何寫程式，因為它能夠教你如何思考。 在這個程式已經遍佈在生活周遭的時代，學習有關程式的基本觀念，除了幫助你更了解世界之外，也能夠簡化以及提高我們的工作效率，這集我們來介紹程式以及程式語言的關係，還有電腦是怎麼運行我們所寫的程式。 --- 我在這個頻道會持續分享關於程式的知識，以及軟體開發的日常，如果喜歡的話歡迎訂閱分享！ ... https://www.youtube.com/watch?v=6Rwzv6R4W9k
Transaction
Created
1 year ago
Content Type
Language
video/mp4
zh
Controlling
VIDEO
19. U
19.-ui-實戰篇：通知佇列-30
lbry://@愷開寫程式/19.-ui-實戰篇：通知佇列-30
第 12 屆 IT 鐵人賽影片教學 — 30 天從 0 到 1 學 Svelte ◼︎ 本集內容：用 Svelte 實作通知佇列 UI 並且在跨元件之間溝通 ◼︎ 相關連結： ・Svelte 官網 https://svelte.dev ... https://www.youtube.com/watch?v=oc9PXj4HhbU
Transaction
Created
1 year ago
Content Type
Language
video/mp4
zh
Controlling
VIDEO
[DESK
desk-tour-在日軟體工程師遠端工作桌面環境分享！
lbry://@愷開寫程式/desk-tour-在日軟體工程師遠端工作桌面環境分享！
因為疫情的關係從去年開始了遠端工作，趁著前幾個禮拜搬新家把自己的桌面環境重新整理了一遍，希望可以幫助到其他同樣也要遠端工作或是想要準備一個舒適環境的你們。 物品詳細資訊：（2021/02/23） 大部分在亞馬遜日本購入，實際價格依照官網為準。 ■ 桌板 HANDSMAN ■ FLEXISPOT 升降桌 E3W ￥45,000 https://www.amazon.co.jp/gp/product/B076CGYVBC/ ■ ITOKI YL7-BK-AEL 辦公椅 ￥34,900 https://www.amazon.co.jp/gp/product/B0874W412Y ■ 擴香 Dr. Vranjes ￥9,500 https://www.amazon.co.jp/gp/product/B00P24C9C6 ■ NITORI 木櫃 ￥34,900 https://www.nitori-net.jp/ec/product/8791368s/ ■ 螢幕 BenQ 27inch HDR EW2780 ￥24,877 Dell 27inch 4K U2720QM ￥59,800 ■ 筆記型電腦 Macbook Pro 13 吋 ■ Logi HD Pro Webcam C920 ￥7,480 https://www.amazon.co.jp/dp/B07QQR6G5N/ ■ Blue Yeti 麥克風 ￥17,100 https://www.amazon.co.jp/dp/B0822PMBTZ/ ■ FILCO MINILA Air 67 鍵 JP￥14,457 https://www.amazon.co.jp/-/zh/dp/B00F3V81VG/ ■ Logi MX ERGO 滑鼠 JP￥11,273 https://www.amazon.co.jp/-/zh/gp/product/B074Z71C2M ■ iPad Pro 12.9 inch NT$32,900 https://www.apple.com/tw/shop/buy-ipad/ipad-pro ■ Sony SD Card Reader JP¥2,970 https://www.amazon.co.jp/-/zh/dp/B06XZX3M5F ■ WD Elements 4TB 外接硬碟 JP¥9,480 https://www.amazon.co.jp/dp/B07DY13WHP ■ 充電器 Anker PowerPort JP¥3,499 https://www.amazon.co.jp/-/zh/dp/B072KBG9W4 ■ 面紙盒 山崎產業 JP¥1,540 https://www.amazon.co.jp/gp/product/B0849221W3 ■ SwitchBot Hub Mini JP¥3,580 https://www.amazon.co.jp/gp/product/B07TTH5TMW/ ■ Google Nest Wifi JP¥19,800 https://www.amazon.co.jp/-/zh/dp/B084ZCV6M5 ■ ORICO USB Hub USB3.0 JP¥2,288 https://www.amazon.co.jp/-/zh/dp/B07SSS7BZD/ ■ SOULWIT Cable Holder JP¥699 https://www.amazon.co.jp/SOULWIT-%E3%82%B3%E3%83%B3%E3%83%94%E3%83%A5%E3%83%BC%E3%82%BF%E3%83%87%E3%82%B9%E3%82%AF-USB%E3%83%87%E3%83%BC%E3%82%BF%E3%82%B1%E3%83%BC%E3%83%96%E3%83%AB-%E3%83%98%E3%83%83%E3%83%89%E3%83%95%E3%82%A9%E3%83%B3%E3%82%B1%E3%83%BC%E3%83%96%E3%83%AB%E3%81%AE%E6%95%B4%E7%90%86%E3%81%AB%E9%81%A9%E3%81%97-%E9%AB%98%E5%93%81%E8%B3%AA3M%E4%B8%A1%E9%9D%A2%E3%83%86%E3%83%BC%E3%83%97/dp/B07ZYSS78W?th=1 ■ Music Adventures by A Himitsu https://www.youtube.com/channel/UCgFwu-j5-xNJml2FtTrrB3A Creative Commons — Attribution 3.0 Unported — CC BY 3.0 Music released by Argofox https://youtu.be/8BXNwnxaVQE Music provided by Audio Library Steps by Roa https://soundcloud.com/roa_music1031​ Creative Commons — Attribution 3.0 Unported — CC BY 3.0 Free Download / Stream: https://bit.ly/steps-roa​ Music promoted by Audio Library https://youtu.be/-DLn9wFw3Ew ... https://www.youtube.com/watch?v=rbsOcejO2RQ
Transaction
Created
1 year ago
Content Type
Language
video/mp4
English
Controlling
VIDEO
29.
29.-自製簡易-svelte（4）：解析
lbry://@愷開寫程式/29.-自製簡易-svelte（4）：解析
第 12 屆 IT 鐵人賽影片教學 — 30 天從 0 到 1 學 Svelte ◼︎ 本集內容：昨天我們實作了將 HTML 變成對應的 JavaScript 程式碼，今天我們會開始實作解析 JavaScript 的部分，為接下來的 Svelte Component 做準備。 ◼︎ 相關連結： ・Svelte 官網 https://svelte.dev ... https://www.youtube.com/watch?v=6VKaHlUXS74
Transaction
Created
1 year ago
Content Type
Language
video/mp4
zh
Controlling
VIDEO
7. SV
7.-svelte-當中的-motion-互動
lbry://@愷開寫程式/7.-svelte-當中的-motion-互動
第 12 屆 IT 鐵人賽影片教學 — 30 天從 0 到 1 學 Svelte ◼︎ 本集內容 在 React 當中往往需要透過 react-spring 的輔助才能做到比較細膩的動畫，不過在 Svelte 當中的有內建 motion 有 spring 跟 tween 兩個功能，可以幫助提升使用者體驗。 ◼︎ 簡報連結：https://speakerdeck.com/kjj6198/day7-svelte-dang-zhong-de-motion-spring-yu-tweened ◼︎ 相關連結： ・Svelte 官網 https://svelte.dev ・倒數計時器範例：https://svelte.dev/repl/86690cfb378e4f3f98cd1a67197a3e42?version=3.25.1 ... https://www.youtube.com/watch?v=bG_p7JSLe_M
Transaction
Created
1 year ago
Content Type
Language
video/mp4
zh
Controlling
VIDEO
用
用程式碼也能寫音樂！-sonic-2
lbry://@愷開寫程式/用程式碼也能寫音樂！-sonic-2
向好和弦與 Sam Aaron（Sonic Pi 作者） 致敬 | 用 Sonic Pi 寫音樂！ 簡報連結：https://speakerdeck.com/kjj6198/sonic-pi-jiao-xue-1 這次的簡報是用最近 justfont 推出的粉圓體！完全免費而且開源，大家趕快來用用看！(https://github.com/justfont/open-huninn-font) 這部影片的靈感是來自好和弦在前幾週的直播，如果沒看過的話可以趕快到資訊卡裡頭看看！好和弦一直是我很喜歡的 YouTube 頻道之一，甚至連我開頭音樂都是用好和弦推薦的 PixiTracker 做出來的。 雖然關於音樂的部分還是沒有甚麼長進，但是從好和弦身上學到許多！ （可能好和弦也會有 Sonic Pi 相關的教學影片唷） ◼︎ Sonic Pi 官方網站：http://sonic-pi.net/ 精美教學：http://sonic-pi.net/tutorial.html ◼︎ 為什麼要用程式碼寫音樂？ 可能你是本科系的人，透過程式碼這個媒介，讓創作的元素變得更加豐富；如果不是本科系，透過音樂這種大家都喜歡的領域來學習，反饋的速度比較快，也會更想要學習更多！ ◼︎ 背景音樂 - How 哥射了之歌 作者：官大為（Wiwi Kuan ） 好和弦的 YouTube 頻道：https://www.youtube.com/channel/UCVXstWyJeO6No3jYELxYrjg ... https://www.youtube.com/watch?v=aTA5wWhvKAQ
Transaction
Created
1 year ago
Content Type
Language
video/mp4
zh
Controlling
VIDEO
8. TR
8.-transition-機制-30-天從-0-到-1
lbry://@愷開寫程式/8.-transition-機制-30-天從-0-到-1
第 12 屆 IT 鐵人賽影片教學 — 30 天從 0 到 1 學 Svelte ◼︎ 本集內容：Svelte 當中的 Transition 機制 Svelte 內建有相當豐富的 transition 機制，可以透過簡單的語法來達到不錯的 UI 互動。 ◼︎ 簡報連結：https://speakerdeck.com/kjj6198/day8-svelte-zhong-de-transition-ji-zhi ... https://www.youtube.com/watch?v=XIlbEwzR6SY
Transaction
Created
1 year ago
Content Type
Language
video/mp4
zh
Controlling
VIDEO
用
用程式碼也能寫音樂！-sonic-pi
lbry://@愷開寫程式/用程式碼也能寫音樂！-sonic-pi
◼︎ Sonic Pi 教學第一集：https://youtu.be/aTA5wWhvKAQ ◼︎ 簡報連結：https://speakerdeck.com/kjj6198/yong-cheng-shi-ma-xie-yin-le-sonic-pi-jiao-xue-2 ◼︎ Sonic Pi 網站：http://sonic-pi.net/tutorial ◼︎ 輾轉相除法產生節奏：http://cgm.cs.mcgill.ca/~godfried/publications/banff.pdf 這部影片的靈感是來自好和弦在前幾週的直播，如果沒看過的話可以趕快到資訊卡裡頭看看！好和弦一直是我很喜歡的 YouTube 頻道之一，甚至連我開頭音樂都是用好和弦推薦的 PixiTracker 做出來的。 Sonic Pi 是由 Sam Aaron 與 Raspberry Pi Foundation 協作開發的軟體，可以透過 live coding 的方式來做音樂，最初用在教學音樂課跟程式理論上，不過隨著功能越來越多，你甚至可以用它來做現場演奏。而且為了讓初學者可以快速上手，這個軟體在語法上以及環境上下了非常大的功夫，所以寫起來也相當直覺，馬上就可以看到成果。 【背景音樂】How 哥射了之歌 作者：官大為（Wiwi Kuan） 好和弦 YouTube 頻道：https://www.youtube.com/channel/UCVXstWyJeO6No3jYELxYrjg ... https://www.youtube.com/watch?v=0kccvDX9lqQ
Transaction
Created
1 year ago
Content Type
Language
video/mp4
zh
Controlling
VIDEO
【
【用程式玩音樂】shape-of-you
lbry://@愷開寫程式/【用程式玩音樂】shape-of-you
一起用 Sonic Pi 玩音樂吧～ 還不知道 Sonic Pi 的話可以到這兩集參考： 1. https://youtu.be/aTA5wWhvKAQ 2. https://youtu.be/0kccvDX9lqQ ... https://www.youtube.com/watch?v=GUKgrUjnppk
Transaction
Created
1 year ago
Content Type
Language
video/mp4
zh