從元件建立使用者介面
React 讓你以稱為「元件」的獨立部分來建立使用者介面。
你也可以建立自己的 React 元件，例如： Thumbnail、LikeButton和 Video。 接著將它們組合成完整的畫面、頁面與應用程式。
無論你是獨立開發，或與上千名開發者協作，使用 React 的體驗都是一致的。 它的設計讓你能無縫地組合來自個人開發者、團隊或組織的元件。
使用程式碼與標記語法撰寫你的元件
React 元件是使用 JavaScript 函式。
想要依條件顯示內容嗎？使用 if 陳述式；
想要顯示一個列表嗎？試試陣列的 map()。
學習 React，就是在學習程式設計。
這種標記語法稱為 JSX。 它是一種由 React 推廣的 JavaScript 語法擴充。
將 JSX 標記與相關的渲染邏輯放在一起，讓 React 元件更容易建立、維護與刪除。
依據需求增加互動功能
React 元件會接收資料，並回傳要顯示在畫面上的內容。
當使用者與介面互動時，例如在輸入框輸入文字，你可以傳入新的資料。
React 會自動更新畫面，讓內容與最新資料一致。
你不需要用 React 建立整個頁面。
只要將 React 加入現有的 HTML 頁面，
就能在頁面的任何地方渲染互動式的 React 元件。
透過框架
打造全端應用
React 是一個函式庫。
它讓你能將元件組合在一起，但不會規範路由或資料擷取的方式。
若要使用 React 建立完整的應用程式，我們建議使用全端 React 框架，
例如 Next.js 或 React Router.
confs/[slug].js
import { db } from './database.js';
import { Suspense } from 'react';
async function ConferencePage({ slug }) {
const conf = await db.Confs.find({ slug });
return (
<ConferenceLayout conf={conf}>
<Suspense fallback={<TalksLoading />}>
<Talks confId={conf.id} />
</Suspense>
</ConferenceLayout>
);
}
async function Talks({ confId }) {
const talks = await db.Talks.findAll({ confId });
const videos = talks.map(talk => talk.video);
return <SearchableVideoList videos={videos} />;
}
19 Videos
React 同時也是一種架構。
實作該架構的框架允許你在伺服器端，甚至在建置階段，於非同步元件中擷取資料。
你可以從檔案或資料庫讀取資料，並將它傳遞到互動式元件中。
善用各平台的優勢
人們喜歡網頁和原生應用程式的原因不同。
React 讓你能運用相同的技能來開發兩者。
它善用各平台的獨特優勢，讓介面在每個平台上都感覺恰到好處。
忠於網頁
使用者期望網頁應用程式能快速載入。
在伺服器端，React 允許你在仍在擷取資料時就開始串流傳送 HTML，
並在 JavaScript 程式碼載入前逐步填入剩餘內容。 在用戶端，React 可以利用標準的 Web API，
讓你的介面即使在渲染過程中也能保持即時回應。
真正的原生體驗
人們期望原生應用程式在外觀與操作上都能符合各自的平台 React Native 和 Expo 讓你能使用 React 來開發 Android、iOS 以及更多平台的應用程式。
它們在外觀和操作如同原生應用程式，因為它們的使用者介面是真正的原生 UI。 這並非透過網頁開啟，而是React 元件直接渲染出平台所提供的原生 Android 與 iOS 畫面。
使用 React，你可以同時開發網頁與原生應用。
團隊能在維持最佳使用者體驗的前提下，輕鬆跨平台發佈；
組織也能整合平台間的隔閡，打造能完整負責功能開發的團隊。
穩定可靠的升級流程
React 對待變更一向謹慎。
每一次 React 的提交（commit）都會在超過十億使用者的商業關鍵場景中進行測試。
在 Meta 內部超過十萬個 React 元件共同驗證每一次升級策略的可行性。
React 團隊總是不斷搜尋如何改進 React.
有些研究甚至花費數年才能得到成效，
React 對將研究成果轉化為生產環境有著很高的標準。
只有經過驗證的方法才能成為 React 的一部分。
加入數百萬人的社群
你並不孤單。每個月都有200萬開發者從世界各地造訪React的文件，
React 是能讓人與團隊共同認可的選擇。
這正是為什麼 React 不僅僅是一個函式庫、一個框架，甚至不只是個生態系。
React 是一個社群——在這裡，你可以尋求協助、發現機會，甚至結識新朋友。
你會在這裡遇見開發者與設計師、初學者與專家、研究人員與藝術家、老師與學生。
儘管我們的背景各不相同，React 讓我們能夠齊聚一堂，創造出優秀的使用者介面。
