Lala Code

Lala 的前端大補帖,歡迎一起鑽研前端技術😊

0%

【DAY 1】 React 的歷史時間軸

react-blue.jpg

第一次參加 IT 邦鐵人賽,接下來會發一系列鐵人賽的文章,希望可以堅持到最後,一起加油吧!

[ 前情提要 ]

要學習 React 就要有開一間餐廳的決心,你說這有什麼關係?
這過程其實大同小異,兩者都需要學習且消耗時間成本,才有機會成功!
現在「」就是餐廳的老闆,即將營業一間「React 熱炒店」,
請了特級廚師 小當家 當御用主廚,而 解師傅 也是股東之一,我們抱著堅持下去的決心一起前進吧!

解師傅:老闆~請多多指教囉!
小當家:我們一起把 React 熱炒店 做大吧~~~🤩


前言

React 的出現,讓開發者享受到組件重用的便利,優化使用者介面

早期都是用 Class Component,但在 React 16.8 之後出了 「Hook」,可以單純使用函式組件,讓你不需要用複雜的 class,就能使用更多 React 的功能,因此整篇,我們都會使用 Hook 的方式來開發

不過 React 是誰發明的?又是怎麼出現的呢?在操作 React 之前,先來簡單了解一下 React 的背景吧!



🕓 回顧 React 的時間軸



fb.jpg

💠 2010 年前後

Facebook 快速成長,相信你我對 Facebook 一定都不陌生,隨著團隊的擴張讓代碼的維護變得越來越困難,FB 認為現行技術已無法滿足擴展需求,如果繼續用舊有的代碼維護頁面,系統的複雜就成級數的增長,使代碼變得脆弱且不可預測




fax.jpg

💠 2011 年

為了解決這個問題,一位 Facebook 工程師 Jordan Walke ,便開發出 FaxJs,也就是 React 的原型,於是 React 先被應用在 Facebook 的 News Feed (動態消息)




ig.jpg

💠 2012 年

Facebook 將 React 分離出來,讓 React 可以在不同專案運行,Facebook 收購 Instagram,將 React 部署在 Instagram

Facebook 的 CEO Mark Zuckerberg 表示:我們最大的錯誤就是壓太多寶在 HTML5 上了




💠 2013年

在 JSCONF US 峰會,Jordan Walke 發表 React 的 Open Source,起初的聽眾對 React 抱持懷疑的態度,多數人覺得 React 是一種退步,這讓 Facebook 團隊決定加強宣傳在勇於創新的族群上




netflix.jpg

💠 2014年

經過團隊的推廣,React 逐漸獲得聲譽,開始有大量公司將 React 用在專案上,包含了 Netflix




redux.jpg

💠 2015年

React Native、Redux 問世

React Native 讓網頁開發人員能用 React 的方式以 JavaScript 撰寫 App

Redux 可以讓不同的組件,使用到共用的資料和方法,統一集中管理共用的狀態




💠 2016年

React 成為主流框架之一,版本進入到正式版號 React 15 穩定版




💠 2017年

React 16 發佈




💠 2018年

在 React Conf 2018,Sophie Alpert 和 Dan Abramov 介紹了 Hook,接著 Ryan Florence 展示了如何用它們來重構應用程式




hook.jpg

💠 2019年

React 16.8 公眾發布。React Hooks 可以在穩定版中使用,不必寫 class 就能使用 state,更好管理有狀態的邏輯,也降低了學習成本




💠 2020年

React 17 引入漸進式升級




💠 2022年至今

React18 正式版發布




結語

回溯的部分就差不多寫到這裡,雖然你完全可以不用知道這些過去,還是可以學好 React ,但回過頭來看了這些過去會發現,這其實是個很勵志的故事,也還滿有趣的!今天就到這裡囉~我們明天繼續吧!


本文為 IT 鐵人賽系列文 你 React 了嗎? 30 天解鎖 React 技能




Hey!想學習更多前端知識嗎?

最近 Lala 開了前端課程 👉【實地掌握RWD - 12小時新手實戰班】👈
無論您是 0 基礎新手,又或是想學 RWD 的初學者,
我們將帶你從零開始,深入了解並掌握 RWD 響應式網頁設計的核心技術,快來一起看看吧 😊



🚀線上課程分享

線上課程可以加速學習的時間,省去了不少看文件的時間XD,以下是我推薦的一些課程
想學習更多關於前後端的線上課程,可以參考看看。

Hahow

Hahow 有各式各樣類型的課程,而且是無限次數觀看,對學生或上班族而言,不用擔心被時間綁住



六角學院

如果你是初學者,非常推薦六角學院哦!
剛開始轉職也是上了六角的課,非常的淺顯易懂,最重要的是,隨時還有線上的助教幫你解決問題!


Udemy

Udemy 裡的課程非常的多,品質普遍不錯,且價格都滿實惠的,CP值很高!
也是很多工程師推薦的線上課程網站。
❤️