前言

此文件概述了成為一位網站開發者的學習路線，目的是為了讓想踏入網站開發領域的人，有清晰的學習目標。當你發現有任何名詞不懂的時候，請善用 Google/ChatGPT 或其他任何你覺得有幫助的工具來輔助你學習。並時刻保持批判性思維，包含在閱讀此文件也是，如果覺得有錯就自己動手把能夠證明你是對的程式寫出來，並跟我分享證明我是錯的吧。最後想告訴所有閱讀這份學習手冊的人，培養自學能力才能走得更遠。那我們開始吧！😁

此份學習手冊主要參考 React 官網 與小部分參考其它各大網站像是 coursera 上 React Basic 的課程、iT邦幫忙、chatGPT、ExplainThis。且整體架構採用React 官方文件 (v18.3.1) 的教學，並經過本人翻譯並重新詮釋精簡而成 (少量新增一些範例讓讀者可以更好理解 React)。目的是為了讓各位讀者可以更快進入網站開發的世界，Happy Coding~

開始學習 React 之前，請先確保以下的知識或工具 ( 相似的工具也行 ) 你已經熟悉了

<aside> 💡 這非常的重要，因爲無論你用什麼框架或套件，你終究最後要編譯成瀏覽器看的懂的語言(CSS, HTML, JavaScript)，所以你需要清楚的知道底層怎麼運作，這對你未來學習 React 會非常有幫助

</aside>

基本知識

• HTML：網頁的基本結構語言。你需要了解標籤（tags）、屬性（attributes）和基本的語義結構。
• CSS：用於設計和佈局網頁。你需要學習選擇器（selectors）、盒模型（box model）、佈局（layout，如 Flexbox 和 Grid）、響應式設計（responsive design）等。
• JavaScript：用於為網頁添加互動性。你需要掌握變量、數據類型、函數、事件、DOM 操作、ES6+ 語法等。
• (選修)瀏覽器的運作原理：瀏覽器是你寫的程式碼運行的環境，不懂說不過去吧～

推薦資源：**freeCodeCamp、W3Schools、MDN Web Docs**

程式碼版本控制

• Git：免費的開源分散式版本控制系統
• GitHub：線上軟體程式碼代管服務平台
• Fork：Git 的 GUI 操作工具

前他資源：Bitbucket (公司內部採用的版控服務)

整合開發環境(IDE)

• Visual Studio Code (vscode)

透過 NVM 管理與安裝 NPM