1. 程式人生 > 其它 >關於學生管理系統的簡單搭建

關於學生管理系統的簡單搭建

開發步驟

建立一個空資料夾,取名students-system

方式一:右鍵新建

方式二:命令列新建(提倡)

 

初始化

 

執行結果:該資料夾下新增了一個package.json

在該目錄下新建資料夾/檔案

安裝包

 

編輯app.js

app.js

搭建基礎框架

建立路由

在router資料夾下,新建index.js,並引入至app.js

Index.js

app.js

編輯管理員登入介面

admin-login.html

自行搭建介面,要有登入表單區域

 

form表單中,action是地址,method是方法,這兩個值要跟後端保持一致

當account失去焦點時,通過正則判斷手機號格式是否正確,如果正確,則通過ajax向後臺驗證賬號是否已註冊,這一步我們使用jQuery來實現。

 

驗證過賬號是註冊過的之後,才可以提交該表單給後臺

後臺根據前端傳過來的賬號,去資料表中查詢對應的賬戶,如果找到,

則比較前端傳來的密碼和資料表中的密碼是否一致,如果一致,

則允許登入,就把管理員檢視學生資訊的介面渲染給前端,同時

還要傳送相應的資料,包括賬戶資訊(注意刪除賬戶密碼)、對應許可權、

所有學生資訊(注意刪除賬戶密碼)。

如果不一致,則把登入介面重新渲染給前端