系列文章
Day 1 - 系列簡介
前言 這是30天的React初學者在沒有學過其他框架的背景下進行的學習過程紀錄，請當作一般的學習筆記來閱讀。預備知識為HTML、CSS以及JavaScript。...
Day 2 - 理解 JSX
今天來學習JSX，主要學習的內容為： 理解JSX是什麼 使用JSX的原因 JSX的運作 如何使用JSX JSX是什麼 在談JSX 前，先談談componen...
Day 3 - JSX的花括號
昨天我們談了基礎的JSX的規則，這次我們來看看JSX當中的花括號是怎麼使用的呢？今天會討論到的議題： 使用花括號的功能 如何理解花括號 double花括號的使...
Day 4 - React 元件初探
今天要來學習元件，要探索的內容有： React component簡介 如何創建component 如何使用component 瀏覽器如何認知 React...
Day 5 - 建立元件之間的聯繫：匯出與引入
上一篇學習了基礎的元件使用，那麼元件之間該如何串聯，一起使用呢？今天要來學習： 匯出與引入如何運作 匯出元件的二種方法 匯出與引入元件 我們可以透過匯出（e...
Day 6 - 傳遞Props
今天進入props的學習，會討論以下的議題： 什麼是props 如何使用props 將JSX作為props傳遞 什麼是props 在 React 中，pro...
Day 7 - 條件式渲染 (Conditional Rendering)
條件式渲染（conditional rendering) 讓我們能夠在特定的條件來動態地渲染不同的元件或內容。譬如在JavaScript 學習過的的 if… e...
Day 8 - 渲染清單
昨天我們透過條件式渲染讓電影清單能夠依據電影名稱顯示相對應的資料，也能直接在object中新增資料來維護，但這還差一點，這還沒有達到毋須修改元件結構自動渲染。今...
Day 9 - key
昨天我們在製作電影卡片元件，雖然畫面看起來沒問題但編輯器跳出了🚨 這個是什麼意思呢？在React中當我們使用到array item時，應該給每一個array i...
Day 10 - 保持元件純淨
今天要來學習在設計元件時有哪些要點，以及如何避免寫出「不乾淨」的元件。 純淨的元件 製作元件時的大重點：保持元件的純淨 (Keeping Components...