今天將會運用到前幾日所學到的內容,並開始為專案增加資料庫的存取功能!那麼就讓我們直接開始今日的內容吧!
現階段為了方便測試,所以先在 local 建立檔案,到未來筆者將會改使用一些其他的hosting以便其他裝置上的使用者做操作。
表格的建立只需要輸入並執行以下SQL語言的程式碼:
CREATE TABLE IF NOT EXISTS accounts (
id INTEGER PRIMARY KEY AUTOINCREMENT,
username TEXT NOT NULL UNIQUE,
password TEXT NOT NULL UNIQUE
);
首先先來測試一下express是否能夠順利執行,我們利用以下指令下載express包:
npm install express
接著在跟目錄中建立以下資料夾以及檔案:src/server/index.js
,這將會是我們待會所要使用的檔案。建立好後我們可以照著官方教學來創立一個最基礎的可執行網頁:
import express from 'express'
const app = express()
const port = 3000
app.get('/', (req, res) => {
res.send('Hello World!')
})
app.listen(port, () => {
console.log(`App listening on port ${port}`)
})
有一點需要特別注意的是,express 的 port 不可與 vue 相同,以此範例來說,我們的vue預設在 5173 運行,那麼express便需要選擇一個不同的,如3000。