上一章 Day 18 - MySQL 使用Annontation設定欄位 (2)

React 並不是一個新的語言, 也不是新的Framework

而是一個由Facebook開發的JS函式庫, 提供許多功能讓我們能輕鬆的撰寫與管理前端UI與架構

React的特色:

1. 使用純JS產生頁面, 速度較以往後端產生html更快
2. 使用虛擬DOM (Virtual DOM), 更快更有效率
3. 使用Component概念, 開發快速, 易於管理

如何使用?

要使用React, 我們需要 Node.js 跟 npm

npm 全名 Node Package Manager, 是一套以Node.js撰寫的套件管理系統

首先到官網下載Node.js (裡面就會包含npm了)

https://nodejs.org/en/download/

安裝完後, 在Visual Studio Code 按CTRL + ` 打開Terminal, 切換到你要建立專案的資料夾 (例:C:\VSCode)

輸入以下指令 (npm版本需6+以上)

npm init react-app frontend

這指令不止會自動初始化, 還會自動幫你安裝需要的Package, 非常方便

看到Happy hacking! 就代表安裝完成了

可以在專案資料夾frontend下看到package.json檔案

安裝過的package跟版本號都在這裡

另外有兩個很好用的擴充推薦給大家

Debugger for Chrome

可以在程式上下斷點, 直接在瀏覽器上Debug

ESLint

ESLint是一個Javascript Linter

可以找出語法錯誤, 自訂義規範, 統一Codeing Style

下一章會介紹我們開發所需要用到的package

Day 20 - React 安裝與導入需要的package