> Udemy課程：[Modern React with Redux [2023 Update]](https://www.udemy.com/course/react-redux/)

`20230715Sat.`

## 1-8. Create the React Project
這裡直接參考[另一堂課](https://hackmd.io/kXiRjRPtTOyNPj2Cb_vzfQ)做得筆記
<div style="background-color: #deeba2; color: #4b570e; margin: 10px 0; padding: 10px 20px; width: fit-content;">
Step 1.
</div>

<div style="border: 1px solid black; margin: 20px; padding: 20px; width: fit-content;">
下載<a href="https://nodejs.org/zh-tw">Node.js</a>
<img src="https://hackmd.io/_uploads/ryIXIoPth.png"> </img>
</div>

<div style="background-color: #deeba2; color: #4b570e; margin: 10px 0; padding: 10px 20px; width: fit-content;">
Step 2.
</div>

<div style="border: 1px solid black; margin: 20px; padding: 20px; width: fit-content;">
接著就可以利用Node.js的套件管理工具npm進行安裝React的環境。首先在電腦桌面打開終端機（terminal）（亦即終端機目前所在檔案位置為桌面），並且於終端機中輸入：
<pre class="lang-js s-code-block">
npx create-react-app my-app
</pre>

此時npm便會幫你安裝且建置好一個React專案"my-app"。
PS "my-app"為專案名稱，可自行改成任意名稱。

<img src="https://hackmd.io/_uploads/r14g5owtn.png"></img>
</div>

<div style="background-color: #deeba2; color: #4b570e; margin: 10px 0; padding: 10px 20px; width: fit-content;">
Step 3.
</div>

<div style="border: 1px solid black; margin: 20px; padding: 20px; width: fit-content;">
利用cd進入到"my-app"的檔案位置。
<pre class="lang-js s-code-block">
cd my-app
</pre>
<img src="https://hackmd.io/_uploads/BkWGciPF3.png"></img>
</div>

<div style="background-color: #deeba2; color: #4b570e; margin: 10px 0; padding: 10px 20px; width: fit-content;">
Step 4.
</div>

<div style="border: 1px solid black; margin: 20px; padding: 20px; width: fit-content;">
最後在終端機打上`npm start`，便可以透過http://localhost:3000（預設為3000）打開"my-app"專案：
<pre class="lang-js s-code-block">
npm start
</pre>

當有跳出React的網頁（如以下畫面）即成功建置React專案！
<img src="https://hackmd.io/_uploads/Bk5t9owKn.png"></img>

<img src="https://hackmd.io/_uploads/Skjt5sDth.png"></img>

PS 若想離開、關掉，則在終端機按下`ctrl`+`c`
</div>

## 1-9. What is Create React App?
### What is JSX?
JSX是個很像HTML的東西，但是JSX並不是有效的JS程式，也就是說我們的瀏覽器是無法執行JSX的。

因此如果想要執行JSX，就必須將JSX轉成JS code：