iT邦幫忙

第 11 屆 iThome 鐵人賽

DAY 1
1
Modern Web

React.js 從 【0】 到【1】推坑計畫 系列 第 1

【Day 1】前情提要 && 教學大綱

大家好!
我是老莫,今天是 30 天中的第 1 天,主要是講一下未來 29 天的內容規劃:

關於分享主題

相信大家也是看了主題 "React從0到1" 才點進來的,一定多少對 React 這個框架有點了解或興趣。這次給自己的目標除了從 React 的基礎到更進階的應用例如 Redux 都要涵蓋外,另外給自己的一個小期許是盡量使用 React 在 16.7版推出的 React Hooks,以往需要對 component 做比較深入的 state 操作都需要以 class 的形式去建構,在 hooks 推出後 functional 的 component 可以做到以往只有 class based component 才能做到的事,寫法上也更為簡單直觀。個人認為 hooks 將會越來越流行,因此會盡量以 hooks 的方式去介紹。除了介紹獨立概念與該概念的解說程式碼以外,我也希望最後能完成一個小小小(真的很小所以說三次)作品,能夠將所學的概念直接應用在實際作品中,我覺得這是一個避免學什麼忘什麼的最佳解法。

https://ithelp.ithome.com.tw/upload/images/20190905/20113277VDmLrV6SGw.png

主題大綱

這邊列出一些預計會涵蓋到的主題:

  • React 基礎
  • Class based component 與 Functional component 的差別
  • React Router
  • React hooks
  • Redux
  • React 渲染機制與效能優化
  • Styled component (css in JS)

今日結語

今天主要是行前通知的感覺,明天開始就要正式開始我們的旅程囉!
希望藉由這個機會能夠學會分享,也在分享的過程讓自己的基礎練的更為扎實。

如果你已經學過 React ,那你可以當作複習。
如果你會寫 React 但很久沒有跟上新的 Feature 了,那麼你可以當這是讓你追上潮流的大補丸。
如果你沒有接觸過 React ,你可以當作是你踏入 React 世界的第一哩路。
如果你沒有學過 JavaScript ,那還是建議你先了解 JS 比較好(被打)
更重要的是,如果你對我的文章有興趣,記得訂閱我的文章喔,我會好好努力的!

※9/7補充:
自己找時間列了一下未來20幾天的分享主題,有興趣的話記得關注喔!

Day4 JSX && virtual DOM
Day5 Stat && useState
Day6 Child Component && Props
Day7 propsTypes
Day8 class component 與 functional component 差別
Day9 class component lifecycle
Day10 React hooks - useEffect
Day11 CSS && Inline Style
Day12 Conditional render
Day13 Event in React
Day14 React Forms
Day15 React-router
Day16 Redux概念
Day17 Redux實作(theme)-hooks way
Day18 React hooks - useReducer
Day19 React hooks - contextAPI
Day20 React 渲染機制
Day21 React hooks - React.memo useMemo 效能優化
Day22 Lazy loading && Code splitting
Day23 專案實作
Day24 專案實作
Day25 專案實作
Day26 專案實作
Day27 專案實作
Day28 GraphQL初探(一)
Day29 GraphQL初探(二)
Day30 基礎之後


下一篇
【Day 2】React.js介紹 && 第一個 React 程式
系列文
React.js 從 【0】 到【1】推坑計畫 30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言