電腦環境：需要先安裝好
1. nodejs （官網下載安裝，安裝8.0以上版本， 使用 node --version 查看是否安裝成功）
2. npm （安裝好node時跟着就安裝好了npm，使用 npm -v 查看是否安裝成功）
3. typescript （打開終端命令，輸入 npm install -g typescript ，輸入 tsc -v 查看是否安裝成功）
4. create-react-app （react安裝的腳手架，npm install -g create-react-app）
vscode 中搭建 typeScript+nodejs 開發環境
1. 新建一個空文件夾，比如命名為 ts_add_nodejs
2. 在vscode中打開這個文件夾，注意這時候這個文件夾里面是沒有任何文件
3. 在vscode 終端 terminal 中 輸入命令： npm init -y 然后按下回車，就會看到生成了 package.json 文件
4. 在終端中再輸入命令： tsc --init 然后按下回車，就會看到生成了 tsconfig.json 文件
5. 打開 tsconfig.json 文件，把其中的 “outDir" 和 ”rootDir“ 的注釋打開，然后分別把后面的內容修改成 " ./out " 和 " ./src "，然后就要在左邊的文件欄中創建這兩個文件（out表示輸出文件目錄和src表示寫代碼的資源文件目錄），具體如下圖所示。
（下圖中三個板塊的內容呈現了幾乎以上的所有步驟，大家可以與自己的工程核對下）
6. 在src下創建一個 index.ts 文件， 在里面寫上如下 ts 代碼：
const hello : string = "Hello World!" console.log(hello)
7. 為了運行 index.ts 的代碼，需要修改 package.json 文件中的 "scripts"，即整個文件改成如下：
{ "name": "react_add_ts", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "start": "tsc && node out/index.js" }, "keywords": [], "author": "", "license": "ISC" }
備注：這一步很重要，因為我們修改了 outDir 使得生成的 Index.js 文件放在了我們定義的文件夾中，那么要編譯 typeScript 的代碼，實際上就是要編譯它的 js 代碼文件，所以這里也需要做相應的修改
8. 在終端輸入 npm start 然后按下回車，就可以看到輸出結果了。
(2) vscode 中搭建 react + typeScript 開發環境
在終端中進入你要新建工程項目的文件夾中，然后使用如下命令：
create-react-app project_name --typescript
等待創建成功，再輸入終端命令： cd project_name
接下來再輸入： yarn start 就可以看到如下界面（當然也可以用 vscode 打開新建的這個文件夾，然后在終端輸入 yarn start 命令）：
調試react時 launch.json 的配置
如果你想要通過按下 F5 運行和調試react，那么就要先安裝插件：Debugger for Chrome ，然后再配置 launch.json 如下所示：
{ // Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0", "configurations": [ { "type": "chrome", "request": "launch", "name": "Launch Chrome against localhost", "url": "http://localhost:3000", "webRoot": "${workspaceFolder}" } ] }
本人剛入前端，發現前端的知識比起算法開發多了許多相互交錯的內容，讓剛入前端的人覺得無從入手，學習了一段時間后才有點感覺，並且覺得前端的內容相對固定不變，所以只要掌握了那么多和龐大的前端知識就可以應付自然，而算法開發的靈活性則體現的更大。無論是開發還是算法研究，都需要我們不斷的學習和研究，我還有太多需要學習的東西，大家一起加油加油！！！
因為初入前端，所以這些內容都是本人在 B站 上看視頻學習來的，參考鏈接如下：
https://www.bilibili.com/video/BV1fV411d7Ka?p=150
https://www.bilibili.com/video/BV1z4411W7wa?p=2