什麼是 React ?
React 為 Facebook 公司於 2013 年(現已更名為Meta)所維護並開源的 JavaScript 函式庫(Library)也可稱為前端框架,主要用來優化使用者介面(User Interface)的製作。根據 React 官方資料得知,React 的應用程式是由無數個 Component (組件)所組成,嘗試簡化複雜且大量的代碼使網站的運作效能有所提升。
寫在學習 React 之前
在學習 React 前,建議先具有以下基礎知識:
- 熟悉 HTML、CSS 、JavaScript 基礎語法
- npm 指令的基礎了解
- 對網頁資料傳輸有基本的概念
安裝好以下程式:
- Node.js
- Vscode(Visual Studio Code)
React 的使用方式
主要分為 MPA 複合式應用程式(Multi-Page Application)與 SPA 單頁式應用程式(Single-Page Application)兩種。 MPA 主要為將網頁的部分區塊以 React 完成,反之 SPA 則將整個網頁都由 React 完成,最大的差異來自於資料傳輸的不同。(這就是為什麼建議對網頁資料傳輸有基本了解)。
MPA 類型的網站,每次開啟新的分頁或者在網頁中執行新的動作時,都會重新向資料庫請求一次完整的資料。反之,SPA 類型的網站,第一次開啟網頁時會向資料庫端請求完整資料,後續即透過 React 存取了網頁的大部分資料,大大提升了網頁瀏覽的效能。(更多 MPA 與 SPA 類型網站的比較請參考此連結)