2025-06-25 Line 訂單系統-階段A

2025-06-25 Line 訂單系統-階段A

🚀 LINE 線上訂單系統：分階段開發操作手冊

---

🅰️ 階段 A：環境準備與版本控制

🎯 目標

• 建立 GitHub 專案與資料夾結構
• 三台電腦能各自 clone/push/pull
• 能在本機啟動前端與後端的基本專案

---

🔧 步驟

1️⃣ 初始化後端（Lenovo）

cd backend
npm init -y
npm install express cors dotenv mysql2

建立 backend/index.js：

import express from 'express';
import cors from 'cors';
import dotenv from 'dotenv';
dotenv.config();

const app = express();
app.use(cors());
app.use(express.json());

app.get('/', (req, res) => res.send('Backend running!'));

app.listen(3000, () => console.log('Server running on port 3000'));

建立 .env：

DB_HOST=localhost
DB_USER=line_user
DB_PASS=password123
DB_NAME=line_order_db
PORT=3000

執行：

node index.js

→ 顯示 “Server running on port 3000” 即成功。

---

2️⃣ 初始化前端（MacAir #1）

cd frontend
npm install
npm run dev

→ 打開 http://localhost:5173 出現 Vite + Vue 畫面。

---

3️⃣ 推上 GitHub（所有電腦）

git add .
git commit -m "Initialize A: base structure"
git push origin main

---

🧪 Checkpoint

✅ 後端可在 3000 埠啟動
✅ 前端可在 5173 埠開啟
✅ 另一台電腦能 clone 並運行

---

💡 延伸

• 用 .env.example 讓其他開發者知道要設定哪些環境變數。
• 用 nodemon 自動重啟後端開發伺服器。

---