大家好，我是Echa。
好消息，在2023年3月16號 react 官方全新文檔正式上線了。距離上一次 React 新文檔的 Beta 版（2022年3月22）上線，文檔重寫耗時359天。可以想像一下，react 團隊對文檔的重視程度。與此同時，react 全新文檔已啟用新的域名：https://react.dev/。react 的粉絲們學習React 看文檔，別跑錯地方了。由於時間的關係，react 官方全新文檔還沒有推出中文版，小編推測中文版可能會在一個月之後才會上線，到時候 react 中文版本上線了，會第一時間發文告訴大家的。
react 官方為了考慮到開發者們找不到最新文檔網址：https://react.dev/， 當訪問 Beta 版文檔（https://beta.reactjs.org/）和英文文檔（https://reactjs.org/）時，都會重定向到新域名（https://react.dev/）。如果部分粉絲們英文看不懂，別著急那繼續直接訪問React 中文文檔 BETA 版 （https://react.bootcss.com/ ） 或者訪問 （https://react.docschina.org/）
下面跟著小編的步伐一起天天React 全新文檔有哪些特色內容。
全文大綱
- React 介紹
- 全面擁抱 React Hooks
- 如何學習 React
- 詳細介紹新的 React API Reference
- React 未來規劃
React 介紹
官網：https://react.dev/
Github：https://github.com/Facebook/react
React是用於構建用戶界面的JavaScript庫， 起源於Facebook的內部項目，該公司對市場上所有 JavaScript MVC框架都不滿意，決定自行開發一套，用於架設Instagram的網站。於2013年5月開源，發展到現在差2個月就十周年了。
- React是Facebook開發的一款JS庫。
- React一般被用來作為MVC中的V層，它不依賴其他任何的庫，因此開發中，可以與任何其他的庫集成使用，包括Jquery、Backbone等。
- 它可以在瀏覽器端運行，也可以通過nodejs在服務端渲染。
- React的思想非常獨特，性能出眾，可以寫出重複代碼少，邏輯清晰的前端代碼。
- React的語法是jsx，通過使用這種語法，可以在react代碼中直接混合使用js和html來編寫代碼，這樣代碼的邏輯就非常清晰，當然也意味著，需要將jsx代碼編譯成普通的javascript代碼，才能在瀏覽器中運行，這個過程根據實際項目情況，可以選擇多種不同的思路，或者在伺服器端通過webpack進行編譯。
特點：
- react 是一個【視圖層框架】：聲明式設計 -React採用聲明方式，可以輕鬆描述應用。
- 以組建的方式開發
- 特殊的語法【JSX】：使用特殊的jsx（JavaScript XML）語法。
- 【虛擬DOM】：高效 -React通過對DOM的模擬使用了虛擬DOM，最大限度地減少與DOM的交互。
如下圖：
全面擁抱 React Hooks
當官網在2018年發布React Hooks時，Hooks文檔假設讀者熟悉類組件。這開發者們幫助社區很快採用了Hooks，但過了一段時間，舊的文檔無法為新的讀者提供服務。新讀者必須學習兩次React：先學習類組件，再學習 Hooks。
而新文檔全面擁抱 React Hooks，從開始就教授如何使用 Hooks 來學習 React。文檔分為兩個主要部分：
- Learn React：一個自學課程，從零開始教授React。
Learn React 地址：https://react.dev/learn
- API Reference：提供了每個 React API 的詳細信息和使用示例。
API Reference 地址：https://react.dev/reference
注意：仍然有一些罕見的類組件用例還沒有基於Hook的實現用例。類組件仍然得到支持，並記錄在新站點的舊版API部分中。Legacy API：https://react.dev/reference/react/legacy
如何學習 React
學習React 總體包含兩個部分：快速學習（Quick Start）和深入學習 （Learn React）。
快速學習（Quick Start）
「學習」部分從「快速入門」頁面開始。React 學習教程的入門部分，介紹了 React 的基本概念和語法，它介紹了組件、屬性和狀態等概念的語法，但沒有詳細介紹如何使用它們。
如果你喜歡邊做邊學，我們建議你下一步去看井字棋教程。它會引導您使用React構建一個小遊戲，並教授了一些開發技能。這是一個在線交互式教程，可以自己嘗試修改：
除了井字棋教程之外，這一部分還包含了一個 Thinking in React 教程，幫助用戶更深刻的理解 React。
上面的井字棋沙箱只是新文檔眾多示例的其中之一，整個網站添加了超過 600 個沙箱！可以編輯任何沙箱，或在右上角按「Fork」將其在一個單獨的選項卡中打開。
深入學習 （Learn React）
快速學習（Quick Start） 部分並沒有詳細介紹如何使用 React。可以在 深入學習（Learn React ）部分一步步學習 如何使用 React。該部分包含四個模塊：
- Describing the UI：如何用組件顯示信息
- Adding Interactivity：如何響應用戶輸入更新屏幕
- Managing State：如何在應用變得越來越複雜時組織邏輯
- Escape Hatches：如何「走出」React，以及什麼時候這樣做最有意義
Learn 部分的大多數頁面都以一些挑戰結尾，以檢查理解程度。例如，以下是有關條件渲染頁面的挑戰：
在每個挑戰的左下角都有一個 Show solution 按鈕，可以點擊查看挑戰的解決方案。
在教程中，通過了很多更直觀的圖表，以幫助快速快速理解。例如，這是 Preserving and Resetting State 中的一張圖表：
我們還可以在新文檔中看到一些插圖，下面是繪製屏幕的瀏覽器：
官方已經與瀏覽器提供商確認，這一描述在科學上是100%準確的。
詳細介紹新的 React API Reference
在 API Reference 中，每個 React API 現在都有一個專用的頁面。這包括各種 API：
- 內置 Hooks，如 useState。
- 內置組件，如 <Suspense>。
- 內置瀏覽器組件，如 <input>。
- 面向框架的 API，例如 renderToPipeableStream。
- 其他 React API，例如 memo。
每個 API 頁面都至少分為兩個部分：
- Reference：通過列出其參數和返回值來描述 API 的簽名。
- Usage：顯示了為什麼以及如何在實踐中使用此 API。它顯示了 React 團隊如何使用每個 API 的典型場景。
除此之外，一些 API 頁面還包括故障排除（針對常見問題）和備選方案（針對已棄用的 API）。希望這種方法將使 API Reference 不僅作為一種查找參數的方式，而且作為一種方式來查看可以使用任何給定的 API 執行的所有不同的事情——以及它如何連接到其他 API。
React 社區
React 擁有一個由數百萬開發人員組成的社區，React 社區 部分包含了一些可以加入的 React 相關社區。除此之外，還包含了React 會議、React 視頻、React 聚會、React 團隊、React 文檔貢獻者、致謝以及版本控制策略。
React 未來規劃
React 官方團隊花了將近一年的時間才發布新文檔。希望保持 React 社區應得的高質量標準。在編寫這些文檔和創建所有示例時，React 團隊發現了自己的一些解釋中的錯誤、React 中的錯誤，甚至現在正在努力解決的 React 設計中的漏洞。希望新文檔能幫助 React 團隊在未來將 React 提升到一個更高的標準。
社區中還有許多對擴展網站內容和功能的要求，例如：
- 為所有示例提供 TypeScript 版本；
- 創建更新的性能、測試和可訪問性指南；
- 獨立於支持它們的框架記錄 React 服務端組件；
- 與國際社區合作翻譯新文檔；
- 向新網站添加缺少的功能（例如，博客的 RSS）。
現在新文檔已經發布了，未來 React 團隊的重點就是添加新信息和進一步改進新網站。
小編認為現在是學習React的最佳時機。同時期待React 官網新文檔中文版能儘快上線！
最後
一台電腦,一個鍵盤,盡情揮灑智慧的人生;幾行數字,幾個字母,認真編寫生活的美好;
一 個靈感,一段程序,推動科技進步,促進社會發展。
創作不易，喜歡的老鐵們加個關注，點個讚，打個賞，後面會不定期更新乾貨和技術相關的資訊，速速收藏，謝謝！你們的一個小小舉動就是對小編的認可，更是創作的動力。