React 套件簡介

彭彭，React 網頁應用，2017-09-27

React 是由 Facebook 團隊所建構、維護的一款 JavaScript 套件，主要用來做使用者介面的開發。使用 React 套件撰寫網頁應用，很輕易的就能生出乾淨俐落、易於維護的程式碼。

React 適用情境

世界上沒有完美的程式套件，只有因地制宜，各有所長的不同選擇。以下情境，適合考慮用 React 來進行開發：

打算開發一個強大的網頁應用（請參考 Piconion 影像編輯），例如線上影像編輯、圖表繪製、客戶管理、內容管理系統等等。
想在現有網頁中，加入一些小功能，例如切換開關介面、跳出式對話框、可搜尋列表等等。React 能有效包裝元件，在不影響其他設計的情況下，達成使命！
希望透過 JavaScript 開發手機應用程式，那麼 React 是基礎功課！接著，可以用 React Native 完成原生的手機應用程式。

React 不適用情境

承上，總有些時候，我們可能不會選擇用 React 做開發，例如以下情況：

需要緊迫地完成專案，越快越好，時間有限，程式碼的品質暫時不重要。
簡單的、一次性使用的到達網頁（Landing Page），React 太搞剛，殺雞用牛刀。
團隊中，主要成員非工程背景，且無資深工程師協力時。React 不適合由初、中階的技術人員掌舵。

聽說 React 授權有疑慮？

確實，過去 React 授權文字中，有防禦性的專利保護條款。但在開源社群的與論壓力之後，Facebook 已經於 2017 後半年，將 React 改用 MIT 開源授權條款，相當有誠意的解決了眾人的疑慮。這部份，大家可以不用擔心。

到底 React 長什麼樣子？

請參考以下片段的程式碼，若有進一步的興趣，可以參考 React 課程教學。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>React 快速開始</title>
<!-- 載入相關套件 -->
<script src="https://unpkg.com/react@15/dist/react.min.js"></script>
<script src="https://unpkg.com/react-dom@15/dist/react-dom.min.js"></script>
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
<script type="text/babel">
// 快速開始：用 React 建立 <h1> 標題
class MyHead extends React.Component{
    render(){
        return <h1>Hello React</h1>;
    }
}
window.addEventListener("load", ()=>{
    ReactDOM.render(<MyHead/>, document.body);
});
</script>
</head>
<body></body>
</html>

投資 React 有價值嗎？

投資一定有風險，技術投資有賺有賠。很簡單的道理，所以彭彭無法正面回答，只能說，至少我是已經把頭洗下去了 XD

返回前頁

回到上方