一、Node.js 的誕生
先來聊聊 Node.js 誕生的故事，瞭解一下它最早的定位，以及後來定位的變化。
Node.js 是2009的時候由大神 Ryan Dahl 開發的。Ryan 的本職工作是用 C++ 寫服務器，後來他總結出一個經驗，一個高性能服務器應該是滿足“事件驅動，非阻塞 I/O”模型的。C++ 開發起來比較麻煩，於是 Ryan 就想找一種更高級的語言，以便快速開發。
可以說有兩點促成了 Nodejs 的誕生。首先第一點，Ryan 發現 JS 語言本身的特點就是事件驅動並且是非阻塞 I/O 的，跟他的思路正是絕配。第二點，Chrome 的 JS 引擎，也就是 V8 引擎是開源的，而且性能特別棒。於是 Ryan 就基於 V8 開發了 Node.js ，注意 Node.js 聽名字好像是個 JS 庫，其實不是的，Node.js 是 C++ 開發的，到官網 http://nodejs.org 可以看到
Node.js 是一個基於 Chrome V8 引擎的 Javascript 運行環境
所以說 Node.js 不是庫，是一個運行環境，或者說是一個 JS 語言解釋器。
Node.js 最初的定位是提升 Ryan 自己的日常工作效率，也就是用來寫服務器代碼的，但是後來沒有想到的是 Node.js 在前端領域卻大放異彩。
先說幾句 Node.js 在服務器端的發展。Node.js 的誕生帶給人們的是個大大的驚喜，傳統上 Web 開發者，前端用 JS 寫，但是寫服務器端代碼的時候還必須用另外一種語言，類似 Ruby/Java/PHP 等。但是 Node.js 出現之後，JS 前後通吃了。如果去網上搜 Node.js 的資料，很多都是用 Node.js 去寫服務器代碼的。
但是，Node.js 今天也成爲了 Web 前端開發必不可少的基礎設施。注意，Web 前端的 JS 代碼最終還是運行在瀏覽器中的，所以運行的時候，或者說在產品環境下，不依賴於 Node.js 。但是，Node.js 誕生以後，前端大爆發，類似 React/Vuejs 這樣的前端框架的開發環境變得非常強大和負責，Node.js 是這些開發環境運行的基礎。
這就是關於 Node.js 誕生，以及它如何從純後端發展到前後通吃的故事。
Nodejs 中運行 JS 代碼
接下來，演示一下 Nodejs 中如何運行 JS 代碼。
以前 JS 只能運行在瀏覽器中，Node.js 出現之後，不管是服務器上，還是我們自己的的筆記本上，只要安裝了 Node.js 就可以運行 JS 代碼了。假設，咱們已經安裝好了 Node.js ，那麼進入命令行，
node
執行 node 命令，就可以進入 Node.js 的交互環境。
1 + 1
執行加法操作，回車，就可以看到代碼正確執行了。Ctrl-D 可以退出這個交互環境。
但是更爲常見的一種執行方式，是把把代碼寫入到一個文件中。
app.js
console.log("hello");
然後這樣來在命令行中執行
node app.js
就可以看到 hello 被打印出來了，而這樣過程跟瀏覽器沒有一毛錢關係。
另外有一點是要特別注意的。Node.js 和瀏覽器是不同的環境，是有着很多細小的差異的。首先，二者各自包含的全局變量不同。document 對象是用來操作頁面的，所以只有瀏覽器環境下纔可以直接使用。但是如果是要放到 Node.js 環境下運行代碼，就不要使用 document 。同樣的道理，Node.js 中可以直接拿來使用的 http 對象，在瀏覽器環境下就沒有。其次，Node.js 和瀏覽器對 ES6 新特性的支持程度也是不同的，這一點也要注意。
關於如何在 Node.js 環境下運行 JS 代碼，我們就聊到這裏。
二、npm是個啥
https://blog.csdn.net/qq_37696120/article/details/80507178
三、React腳手架：create-react-app
React 的環境搭建，是比較繁瑣的，有很多的依賴：react、react-dom、babel、webpack ... 需要很多的前置知識，很容易讓人從入門到放棄。
於是就誕生了 腳手架 這種東西，create-react-app 就是一個 React 的腳手架，用它可以很方便的就創建了整個 React 的環境搭建，它解決了所有的依賴問題。
越上層的建築，越方便的工具，也說明了我們對底層的定製性越差。不過對於新手學習的同學，把應用的東西先做起來之後，有必要再去理解底層環境的東西，也是種不錯的學習的路徑。
四、node環境安裝
Node.js 安裝包及源碼下載地址爲：https://nodejs.org/en/download/。下載node完成後，npm也會自行下載完成。
下載後，查看版本。說明下載成功
五、安裝react腳手架
安裝好的npm的源默認是國外的源，會因爲網絡原因導致執行npm操作有延時，我們可以切換npm的源爲淘寶的源鏡像。
執行 npm config set registry https://registry.npm.taobao.org。切換完成後，可通過 npm config get registry 查看。
安裝react腳手架，cmd執行
npm i -g create-react-app
六.創建項目
安裝好 node 和 react腳手架後就可以創建項目啦，cmd切換至指定路徑，執行 create-react-app rproject (rproject爲自定義項目名)，最後出現 happy hacking說明創建成功。
七.啓動項目
在項目所在路徑下cmd執行 npm start。啓動後會自動打開瀏覽器
八、antd安裝
antd是螞蟻金服推出的一款很棒的react ui庫
npm install antd --save