/NTU-Group-Online

A web application made in Software Engineering course.

Primary LanguageVue

ntu-group-project

Demo

影片 Demo。(有做補禎轉換,所以可能有些地方會模糊掉) 直接點擊圖片就會跳轉了 或是造訪 http://www.youtube.com/watch?v=_uxVV6u9fK4

Screenshot

Some Detail

  • Depoly 結果 : https://ntu-online-group.herokuapp.com/

    • 因為 Heroku 的機制,直接點進去可能無法看到畫面。
    • 另外,此平台需要有 NTU 的 Mail 才能進行註冊,首頁也必須要登入才能看到。
    • 2023 更新: 因為製作後端的同學已撤掉其服務,目前前端收不到資料,無法訪問
  • 本地端執行需要新增 .env 檔案。

  • 後端想寄 Mail 驗證,串接部分 : 使用 /verify-mail/ forgetpwd 來當作觸發驗證信箱的頁面。

    • 範例 :
      • http://FRONTEND_URL/verify-mail/MjU/anwhy8-c74b2a2e33d5e8e28355e2bfe3970ba3/
      • http://FRONTEND_URL/forgetpwd/MjQ/anv2cs-5c8dae1703cf292a05db291ddbe5b2e4/
  • Dependence:

Project setup

npm install

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build

Install Other Tools (if without backend, use this to test Restful API)

npm install -g json-server

Recommnad Install Some plugin in VSC

(可以在 VSC 右邊 Market 下載)

Search :

  • Vetur
  • Eslint
  • Prettier
  • Copy Relative Path
  • Snippests Suite
    • 要搜尋 sarah.drasner

User Setting

根據上面做一些調整

  // I want my default to be 4, but JavaScript/JSON to be 2
    "editor.tabSize": 4,
    "[javascript]": {
        "editor.tabSize": 2
    },
    "[json]": {
        "editor.tabSize": 2
    },

    // Setting eslint
    "eslint.validate": [
        "vue",
        "html",
        "javascript"
    ],
    
    // Setting for Vetur's Emmet Function
    "emmet.includeLanguages": {
      "vue-html": "html",
      "vue": "html"
    },

Json Server

json-server --watch db.json