- ReactJS 教程
- ReactJS - 首頁
- ReactJS - 簡介
- ReactJS - 路線圖
- ReactJS - 安裝
- ReactJS - 特性
- ReactJS - 優點與缺點
- ReactJS - 架構
- ReactJS - 建立 React 應用
- ReactJS - JSX
- ReactJS - 元件
- ReactJS - 巢狀元件
- ReactJS - 使用新建立的元件
- ReactJS - 元件集合
- ReactJS - 樣式
- ReactJS - 屬性 (props)
- ReactJS - 使用屬性建立元件
- ReactJS - props 驗證
- ReactJS - 建構函式
- ReactJS - 元件生命週期
- ReactJS - 事件管理
- ReactJS - 建立一個事件感知元件
- ReactJS - 在 Expense Manager 應用中引入事件
- ReactJS - 狀態管理
- ReactJS - 狀態管理 API
- ReactJS - 無狀態元件
- ReactJS - 使用 React Hooks 進行狀態管理
- ReactJS - 使用 React Hooks 進行元件生命週期管理
- ReactJS - 佈局元件
- ReactJS - 分頁
- ReactJS - Material UI
- ReactJS - Http 客戶端程式設計
- ReactJS - 表單程式設計
- ReactJS - 受控元件
- ReactJS - 非受控元件
- ReactJS - Formik
- ReactJS - 條件渲染
- ReactJS - 列表
- ReactJS - Keys
- ReactJS - 路由
- ReactJS - Redux
- ReactJS - 動畫
- ReactJS - Bootstrap
- ReactJS - Map
- ReactJS - 表格
- ReactJS - 使用 Flux 管理狀態
- ReactJS - 測試
- ReactJS - CLI 命令
- ReactJS - 構建和部署
- ReactJS - 示例
- Hooks
- ReactJS - Hooks 簡介
- ReactJS - 使用 useState
- ReactJS - 使用 useEffect
- ReactJS - 使用 useContext
- ReactJS - 使用 useRef
- ReactJS - 使用 useReducer
- ReactJS - 使用 useCallback
- ReactJS - 使用 useMemo
- ReactJS - 自定義 Hooks
- ReactJS 高階
- ReactJS - 可訪問性
- ReactJS - 程式碼分割
- ReactJS - Context
- ReactJS - 錯誤邊界
- ReactJS - 轉發 Refs
- ReactJS - Fragments
- ReactJS - 高階元件
- ReactJS - 與其他庫整合
- ReactJS - 效能最佳化
- ReactJS - Profiler API
- ReactJS - Portals
- ReactJS - 不使用 ES6 ECMAScript 的 React
- ReactJS - 不使用 JSX 的 React
- ReactJS - 調和
- ReactJS - Refs 和 DOM
- ReactJS - Render Props
- ReactJS - 靜態型別檢查
- ReactJS - Strict Mode
- ReactJS - Web Components
- 其他概念
- ReactJS - 日期選擇器
- ReactJS - Helmet
- ReactJS - 內聯樣式
- ReactJS - PropTypes
- ReactJS - BrowserRouter
- ReactJS - DOM
- ReactJS - 走馬燈
- ReactJS - 圖示
- ReactJS - 表單元件
- ReactJS - 參考 API
- ReactJS 有用資源
- ReactJS - 快速指南
- ReactJS - 有用資源
- ReactJS - 討論
ReactJS - 簡介
ReactJS 是一個免費且開源的前端 JavaScript 庫，用於開發各種互動式使用者介面。它是一個簡單、功能豐富且基於元件的 UI 庫。當我們說基於元件時，我們的意思是 React 透過建立各種可重用和獨立的程式碼來開發應用程式。因此，這個 UI 庫廣泛用於 Web 開發。
ReactJS 可用於開發小型應用程式以及大型複雜應用程式。ReactJS 提供了最少且可靠的功能集來啟動 Web 應用程式。React 社群透過提供大量現成的元件來補充 React 庫，以便在創紀錄的時間內開發 Web 應用程式。React 社群還在 React 庫之上提供了狀態管理、路由等高階概念。
React 版本
Reactjs 庫由 Facebook 的軟體工程師 Jordan Walke 於 2011 年建立。然後，React 的初始版本 0.3.0 於 2013 年 5 月釋出，最新版本 17.0.1 於 2020 年 10 月釋出。主要版本引入了重大更改，次要版本引入了新功能而不會破壞現有功能。根據需要釋出錯誤修復。React 遵循語義版本控制 (semver) 原則。
為什麼需要 ReactJS？
儘管有各種庫提供開發使用者介面的媒介，但 ReactJS 在受歡迎程度方面仍然很高。原因如下：
基於元件 - ReactJS 使用多個元件來構建應用程式。這些元件是獨立的，並具有自己的邏輯，這使得它們在整個開發過程中都可以重用。這將大大減少應用程式的開發時間。
更好更快的效能 - ReactJS 使用虛擬 DOM。虛擬 DOM 將應用程式元件的先前狀態與當前狀態進行比較，並且僅更新真實 DOM 中的更改。而傳統的 Web 應用程式會再次更新所有元件。這有助於 ReactJS 更快地建立 Web 應用程式。
極其靈活 - React 允許開發人員和團隊設定他們認為最合適的約定並根據自己的意願實現它，因為 React 中沒有嚴格的程式碼約定規則。
輕鬆建立動態應用程式 - 動態 Web 應用程式需要更少的程式碼，同時提供更多功能。因此，ReactJS 可以輕鬆建立它們。
也可以開發移動應用程式 - React 不僅可以開發 Web 應用程式，還可以使用 React Native 開發移動應用程式。React Native 是一個開源的 UI 軟體框架，它源自 React 本身。它使用 React 框架為 Android、macOS、Web、Windows 等開發應用程式。
除錯很容易 - React 中的資料流是單向的，即在使用 React 設計應用程式時，子元件巢狀在父元件中。由於資料流是單向的，因此更容易除錯錯誤並發現 bug。
應用
下面列出了一些由React 庫支援的流行網站：
- Facebook，流行的社交媒體應用程式 - React 最初是在 Facebook（或 Meta）開發的，因此它們使用它來執行其應用程式是很自然的。至於他們的移動應用程式，它使用 React Native 來顯示 Android 和 iOS 元件，而不是 DOM。Facebook 的程式碼庫現在包含超過 20,000 個元件，並使用公開的 React 版本。
- Instagram，流行的圖片分享應用程式 - Instagram 也完全基於 React，因為它也由 Meta 提供支援。顯示其用法的主要功能包括地理位置、主題標籤、Google 地圖 API 等。
- Netflix，流行的媒體流應用程式 - Netflix 於 2015 年轉向 React。影響此決定的主要因素是 1) 啟動速度，以減少渲染主頁的處理時間並啟用 UI 中的動態元素，2) 模組化，以允許必須與控制體驗共存的各種功能，以及 3) 執行時效能，以實現高效的 UI 渲染。
- Code Academy，流行的線上培訓應用程式 - Code Academy 使用 React 作為“指令碼經過實戰檢驗，易於思考，易於 SEO，並且與遺留程式碼相容，並且足夠靈活以適應未來”。
- Reddit，流行的內容分享應用程式 - Reddit 也是從頭開始使用 React 開發的。
正如您所看到的，每個領域的 most popular application 都是由React 庫開發的。