heroku react deploy with node.js

免費的雲端服務是獨立開發者最好的朋友，
今天分享 Heroku，價格可以看這邊，

首先可以先建立 react app

 npm i create-react-app my-app 

再自行加工 my-app 內容..

預設會產生 /build 資料夾。

然後開一個 node server 把預設路徑改到 /build

 npm i express 

// index.js of node env

var express = require('express')

var app = express()

const Path = require('path')

const PORT = process.env.PORT || '8080'

app.use(express.static(Path.join(__dirname, 'build')));

app.get('/*', (req, res) => {

res.sendFile(Path.join(__dirname, 'build', 'index.html'));

});

app.listen(PORT)

丟 heroku

mac 安裝 heroku-cli

https://devcenter.heroku.com/articles/heroku-cli#download-and-install

產生一個 heroku 專案

 heroku create my-app 

https://devcenter.heroku.com/articles/creating-apps

透過 git 推一專案

 git init // 初始

 git add . // 將全部 stage 

 git commit -am "first commit" // 寫 commit message 

 heroku git:remote -a "my-app" // 將 git remote repository 設定成 heroku 專案 

 git push heroku master // 推到 master branch