Node.js
Node.js 是執行 JavaScript 伺服器端的伺服器端 JavaScript 執行階段環境。|
React
React 是前端架構,用來建立 UI。
npm
npm 是 Node.js 的預設套件管理員。 套件管理員可讓程式設計人員能夠發佈並共用 Node.js 程式庫的原始程式碼,其設計目的是為了簡化程式庫的安裝、更新及解除安裝。
Step 1: 建置環境(npm, nodejs, react)
# Ubuntu
sudo apt install npm
sudo apt install nodejs
不要使用 sudo npm
做任何事情
npm config set prefix ~/.npm
在 .bashrc
裡面加上 export PATH=~/.npm/bin:$PATH
npm install -g create-react-app
Step 2: 使用 create-react-app
使用 create-react-app 創建一個 React app,網頁的檔案會被放在 helloworld 這個資料夾裡面
npx create-react-app helloworld
進入 helloworld 資料夾後,使用 npm start,就會開始執行網頁伺服器
cd helloworld
npm start
Step 3: 成功!瀏覽 helloworld 網頁
應該會看到以下的文字顯示 :
伺服器會執行在本機端的3000 port
只需要到瀏覽器(Google Chrome, Firefox 等等) 打上 locahost:3000 即可看到你的網頁,看到以下畫面代表成功執行網頁伺服器。完成你的網頁 helloworld