React 是一個用來製作 UI（User Interface, 使用者介面）的 JavaScript 函式庫，旨在用更簡易快速的方式建構前端應用。以 MVC（Modal-View-Controller）的模式來講，React 是一個專精在處理 View 部分的函式庫（非框架），它有以下幾個特點：
React 使用 宣告式（Declarative）的方式來建構 UI。
換句話說就是開發者只要定義好每個時間點 UI 與 UI 狀態就可以建構整個畫面，不需如 JQuery 一樣一步一步流程式的操作 DOM 來控制畫面最後呈現的結果。當改變 UI 狀態資料時，React 就會依據狀態的改變自動更新畫面。
再更簡單的講一點，宣告式定義畫面相當於 資料即畫面 的功能。操作 資料 即能更新 畫面，讓開發者避免掉每次更新畫面都需要操作 DOM 的複雜流程，進而大大的減少開發成本。隨著畫面越複雜度越高，資料即畫面能為開發者減輕的負擔就越多。
元件化開發是 React 重要的設計理念之一。所謂的元件化開發的概念來自 Atomic Design，意思就是把畫面上的小單元都視為一個獨立的元件來看待，並以 bottom-up 的方式把這些小元件堆疊成更大的區塊或頁面。利用這種開發方式，我們就可以提升元件的重用性，並有效的達到設計的一致性與提升開發的效率。
雖說現代框架幾乎都可以做到元件化開發這件事，但 React 不同的地方是，其設計理念認為樣板（Template, e.g. HTML）與邏輯（Logic）是不可分割的一體，與其拆分成樣板與邏輯，不如把他們當作一個高內聚力的單元來對待。
為了達成將樣板與邏輯視為一體這件事，React 使用了 JSX 以支援在 JavaScript 中加入 HTML/XML like 的語法來把樣版與邏輯都融合在 JavaScript 中，而 JSX 也因此成為開發 React 的一大特點。
React 另一項的主打是可以學習一次概念，就可以在各種平台上寫。
目前 React 的這套概念各種平台上，包括 Server side rendering 上、手機應用程式上（React Native）上、以及桌上型應用程式上（React Native for Windows & React Native for MacOS）。有了這些的豐富的生態系，React 的開發者就能用同樣的思路跨平台的開發，以大量減少學習成本。
有很多方式可以使用 React，根據不同的情境，React 提供各種不同的工具來快速 setup 對應的環境：
其中 線上嘗試網頁是最能夠快速開始嘗試使用 React 的方式，但如果想要把 React 環境在 local 端快速建立好的話，Create React App 還是最佳首選。另外他也是官方支援開發的，因此十分值得信任。
基於這個理由，以下將介紹如何使用 Create React App 建立全新 React 專案。
在使用 Create React App (CRA) 建立 React 環境之前，需要先安裝好 npm 5.2 以上的版本。
npm 安裝方式可參考 npm 官網說明。
開啟 terminal
輸入指令以建立 create-react-app 專案
輸入指令後即可建立出新的 React SPA 專案，指令中的 [your-project-name] 部分請改成自己要的專案名字
npx create-react-app [your-project-name]
cd [your-project-name]
執行 create-react-app 專案
輸入以下指令把建立好的環境在 local 中跑起來，等他跑好後就可以到 http://localhost:3000/ 看你的全新 React 專案了！
npm start
恭喜，做完以上三步驟後，我們已經準備好一個全新的 React 環境了！
如上面所述，Create React App 是一個建置全新 React 環境非常好的工具，但當想要加入自定義的 Eslint、Stylelint 到 webpack loader 中，或是想加入 Storybook 之類的 package 時就會需要額外的功夫去修改相關的設定檔。
筆者剛接觸 Create React App 也有遇到這個問題。為了解決這個問題，筆者把 Create React App 產出的專案加入了一些套件並修改設定檔，並將整個專案放到了 GitHub 的 Repository：armed-react-app 上。armed-react-app 可支援 TypeScript、Storybook、Linter、Prettier 等常用功能，如果讀者有興趣的話也可以 clone 下來直接開始使用。
在這章節中，我們學到了 React 的幾個特點：
根據不同的需求，我們可以使用不同的工具創建 React 專案，其中以 Create React App 為大宗。
下章節中，我們將開始介紹 React 的核心語法：JSX。
iThome鐵人賽
看影片追技術