學習用TypeScript | React | TailwildCSS 跟JayLin一起做待辦事項 App

更新於 2024/05/17閱讀時間約 1 分鐘
Todo App是一個很好學習程式語言的專案開始,JayLin來帶大家手把手用TypeScript | React | TailwildCSS 來做一個小專案

學習重點

  • 學習如何架構程式專案
  • 用React 來製作Resuable 組建Component
  • Model 是一個Todo 資料結構
  • Input Event 在TypeScript如何使用

影片教學

總結

  • 上完課程後你可以學到基礎TypeScript和React如何運用
  • 可以當作軟體工程師的作品集
  • 你可以加入自己其他邏輯,讓Todo App 變得不一樣

額外資源教學

如何用FIgma製作個人作品集教學 - https://vocus.cc/article/645c733dfd89780001ffe890
學習如何設計好產品 - 使用者經驗設計 | 易用性 | 通用設計 - https://vocus.cc/article/64637f74fd8978000175c0f8
前端教學架設TodoApp
學習如何用HMTL5和CSS3,跟JayLin一起做一個NFT卡片完整課程 - https://vocus.cc/article/64637f74fd8978000175c0f8

更多相關教學文章

即將進入廣告,捲動後可繼續閱讀
為什麼會看到廣告
avatar-img
12會員
33內容數
設計 + 程式,是一個出版對設計和程式的學習影片和教學文章,目的是為了讓大家能加快學習最新技術以及設計相關題目去思考如何改變產品的設計體驗。 請追蹤JayLinXR獲得最新消息: https://www.youtube.com/@jaylinxr
留言0
查看全部
avatar-img
發表第一個留言支持創作者!
JayLinXR 的其他內容
想要知道如何用最新技術來製作一個App嗎? 跟著JayLin用React | Redux Tool Kit | TypeScript | TailwildCSS 來製作一個Drawing App
初次學習程式語言不知道從哪方面以及要如何有效學習程式語言,在這次分享希望可以幫助到你們
介紹編譯器使用以及HTML5 | CSS 初學者學習HTML5和CSS3不知道從哪裡開始,這次Jay帶你來做個NFT卡片,一次完整教學案例來理解HTML5和CSS3
XR 設計如何起步呢?這部影片為大家初步介紹關於VR AR 和 XR,往後會近一步講解如何設計XR 體驗設計呦 😃
介紹區塊鏈有哪些重要概念需要學習 - 內存池 - Proof of Work VS Proof of Stack - SLash
近幾年區塊鏈話題熱絡起來,這一集將簡單介紹區塊鏈基礎知識和所需要的技能,此為2022年,會持續關注區塊鏈的技術以及更新影片 總結 了解區塊鏈運作和專業術語 (Block, Transiation, Hash, DFi, Dapp, IPFS, Smart Contract) 當你選擇每個區塊鏈環境(
想要知道如何用最新技術來製作一個App嗎? 跟著JayLin用React | Redux Tool Kit | TypeScript | TailwildCSS 來製作一個Drawing App
初次學習程式語言不知道從哪方面以及要如何有效學習程式語言,在這次分享希望可以幫助到你們
介紹編譯器使用以及HTML5 | CSS 初學者學習HTML5和CSS3不知道從哪裡開始,這次Jay帶你來做個NFT卡片,一次完整教學案例來理解HTML5和CSS3
XR 設計如何起步呢?這部影片為大家初步介紹關於VR AR 和 XR,往後會近一步講解如何設計XR 體驗設計呦 😃
介紹區塊鏈有哪些重要概念需要學習 - 內存池 - Proof of Work VS Proof of Stack - SLash
近幾年區塊鏈話題熱絡起來,這一集將簡單介紹區塊鏈基礎知識和所需要的技能,此為2022年,會持續關注區塊鏈的技術以及更新影片 總結 了解區塊鏈運作和專業術語 (Block, Transiation, Hash, DFi, Dapp, IPFS, Smart Contract) 當你選擇每個區塊鏈環境(
你可能也想看
Google News 追蹤
Thumbnail
*合作聲明與警語: 本文係由國泰世華銀行邀稿。 證券服務係由國泰世華銀行辦理共同行銷證券經紀開戶業務,定期定額(股)服務由國泰綜合證券提供。   剛出社會的時候,很常在各種 Podcast 或 YouTube 甚至是在朋友間聊天,都會聽到各種市場動態、理財話題,像是:聯準會降息或是近期哪些科
Thumbnail
#連假後的小驚嚇?! 前幾天又接到幼稚園老師的來電, 告知我的女兒在學校因不小心跑太急, 跌倒撞到門邊頭受傷, 當下看了老師傳Line的女兒頭受傷的照片時, 真的會有許多的擔心與想像. 感恩的是,還好是一般的傷口, 經過這幾天的觀察、清潔與敷藥,已慢慢進入結痂階段. 其實每次只要接到
Thumbnail
提供 AI 下指令或提問題的提示(Prompts)範例及介紹相關外掛工具或擴充功能,還有實用的英文句型,讓你跟 ChatGPT 沉浸式練習視訊會議情境英語會話。
Thumbnail
提供 AI 下指令或提問題的提示(Prompts)範例及介紹相關外掛工具或擴充功能,還有實用的英文句型,讓你跟 ChatGPT 沉浸式練習求職面試情境英語會話。
Thumbnail
提供 AI 下指令或提問題的提示(Prompts)範例及介紹相關外掛工具或擴充功能,還有實用的英文句型,讓你跟 ChatGPT 沉浸式練習海關情境英語會話。
我不願開書店只是孤芳自賞,也不願書店只是一手交錢一手交貨的營業場所。透過空間裡物件乘載的內容與社會溝通,是我希望書店具備功能。關於和社會溝通,我認為可以從一部叫好叫座的電影取經。
Thumbnail
30歲前的我,在都市工作,大樓人口稠密,彼此關係冷漠,人與人間的感覺早已麻痺,陌生人見面不打招呼,每月往返兩岸當空中飛人,拚高鐵上車時剛好關門,急匆匆拎著快餐盒,用手機邊吃飯邊排行程,網站分頁總是20個,旅行運動還要陪伴家人,但是,是誰讓我變得那麼忙?那麼忙的我,究竟要去哪裡?
Thumbnail
聯強總裁杜書伍在「深思考的鍛鍊」這本書上提到他在聯強建立月報的制度來識人,用它來對部屬「聽其言、觀其行、理其思」,他認為月報是了解人、積極輔導人很重要的制度。他藉由月報來判斷部屬是否有以下六大能力「觀察、思考」、「系統、結構」、「整理、分析」。
Thumbnail
「啊!!!!!」我和朋友在走廊上大聲尖叫,肯定有人朝我們看來,但在我們已經衝破腦袋的焦躁面前,那一點都不重要了。 剛升上高二的日子,因為接下了太多的社團幹部,忙碌到幾乎將課業荒廢,一邊焦慮於做不完的工作,一邊看著佈滿字跡的黑板恐慌著——因為積累太多書沒讀的我,什麼都看不懂。
Thumbnail
「有哪些好用的學習資源呢?」 「網路上的學習資源好多,我該如何選擇呢?」 歡迎來到Kangaroo的blog! 由於我們這個世代是個跨領域的世代,也是個斜槓的世代,自主學習已經成為我們一生中必要的學習課題。因此我將介紹我們團隊製作與整理的平台-島島阿學學習資源平台,供大家一同來使用!
Thumbnail
*合作聲明與警語: 本文係由國泰世華銀行邀稿。 證券服務係由國泰世華銀行辦理共同行銷證券經紀開戶業務,定期定額(股)服務由國泰綜合證券提供。   剛出社會的時候,很常在各種 Podcast 或 YouTube 甚至是在朋友間聊天,都會聽到各種市場動態、理財話題,像是:聯準會降息或是近期哪些科
Thumbnail
#連假後的小驚嚇?! 前幾天又接到幼稚園老師的來電, 告知我的女兒在學校因不小心跑太急, 跌倒撞到門邊頭受傷, 當下看了老師傳Line的女兒頭受傷的照片時, 真的會有許多的擔心與想像. 感恩的是,還好是一般的傷口, 經過這幾天的觀察、清潔與敷藥,已慢慢進入結痂階段. 其實每次只要接到
Thumbnail
提供 AI 下指令或提問題的提示(Prompts)範例及介紹相關外掛工具或擴充功能,還有實用的英文句型,讓你跟 ChatGPT 沉浸式練習視訊會議情境英語會話。
Thumbnail
提供 AI 下指令或提問題的提示(Prompts)範例及介紹相關外掛工具或擴充功能,還有實用的英文句型,讓你跟 ChatGPT 沉浸式練習求職面試情境英語會話。
Thumbnail
提供 AI 下指令或提問題的提示(Prompts)範例及介紹相關外掛工具或擴充功能,還有實用的英文句型,讓你跟 ChatGPT 沉浸式練習海關情境英語會話。
我不願開書店只是孤芳自賞,也不願書店只是一手交錢一手交貨的營業場所。透過空間裡物件乘載的內容與社會溝通,是我希望書店具備功能。關於和社會溝通,我認為可以從一部叫好叫座的電影取經。
Thumbnail
30歲前的我,在都市工作,大樓人口稠密,彼此關係冷漠,人與人間的感覺早已麻痺,陌生人見面不打招呼,每月往返兩岸當空中飛人,拚高鐵上車時剛好關門,急匆匆拎著快餐盒,用手機邊吃飯邊排行程,網站分頁總是20個,旅行運動還要陪伴家人,但是,是誰讓我變得那麼忙?那麼忙的我,究竟要去哪裡?
Thumbnail
聯強總裁杜書伍在「深思考的鍛鍊」這本書上提到他在聯強建立月報的制度來識人,用它來對部屬「聽其言、觀其行、理其思」,他認為月報是了解人、積極輔導人很重要的制度。他藉由月報來判斷部屬是否有以下六大能力「觀察、思考」、「系統、結構」、「整理、分析」。
Thumbnail
「啊!!!!!」我和朋友在走廊上大聲尖叫,肯定有人朝我們看來,但在我們已經衝破腦袋的焦躁面前,那一點都不重要了。 剛升上高二的日子,因為接下了太多的社團幹部,忙碌到幾乎將課業荒廢,一邊焦慮於做不完的工作,一邊看著佈滿字跡的黑板恐慌著——因為積累太多書沒讀的我,什麼都看不懂。
Thumbnail
「有哪些好用的學習資源呢?」 「網路上的學習資源好多,我該如何選擇呢?」 歡迎來到Kangaroo的blog! 由於我們這個世代是個跨領域的世代,也是個斜槓的世代,自主學習已經成為我們一生中必要的學習課題。因此我將介紹我們團隊製作與整理的平台-島島阿學學習資源平台,供大家一同來使用!