学生档案信息管理案例

一，生成项目描述文件

二，创建网站服务器并实现网站的请求功能

三，实现路由的第三方模块：router

四，当模板引擎引入的文件内有css文件时，需要使用第三方模块解析：serve-static

五，整理后的文件;

其中，主文件app.js

//引入http模块
const http =require('http')
//引入模板引擎
const template=require('art-template')
const path=require('path')
//引入静态资源访问模块，返回值是个方法
const serveStatic=require('serve-static')
//引入querystring模块，处理post请求变成对象
const querystring=require('querystring')
const dateFormat=require('dateformat')
const router=require('./route/index')
//配置模板的根目录
template.defaults.root=path.join(__dirname,'views')
//处理日期格式的方法
template.defaults.imports.dateFormat = dateFormat;
//实现静态资源访问服务，参数是个静态资源目录,通常把静态资源都放public目录下
//它的返回值依旧是个方法
const serve=serveStatic(path.join(__dirname,'public'))require('./model/connect')
//创建网站服务器
const app =http.createServer()app.on('request',(req,res)=>{//调用路由router(req,res,()=>{})//调用静态资源访问模块serve(req,res,()=>{})
})
app.listen(80)
console.log('服务器创建成功')

路由文件：

//引入router模块
const getRouter=require('router')
//获取路由对象
const router =getRouter()
const Student=require('../model/user')
//引入模板引擎
const template=require('art-template')
//引入querystring模块，处理post请求变成对象
const querystring=require('querystring')
//定义路由
//呈递学生档案信息页面
router.get('/add',(req,res)=>{let html=template('index.art',{})res.end(html)
})
//呈递学生档案信息列表页面
router.get('/list',async(req,res)=>{//查询学生信息let students=await Student.find()let html=template('list.art',{students:students})res.end(html)
})
//呈递学生信息添加的路由
router.post('/add',(req,res)=>{let formData=''req.on('data',param=>{formData +=param})req.on('end',async()=>{await Student.create(querystring.parse(formData)).catch(err=>console.log(err))//重定向到列表页，301代表重定向res.writeHead(301,{Location:'/list'})res.end()})
})module.exports=router

数据库的连接文件：

// 数据库的连接代码
const mongoose=require('mongoose')
mongoose.connect('mongodb://localhost/playground',{useNewUrlParser: true ,useUnifiedTopology: true}).then(()=>console.log('数据库连接成功')).catch(()=>console.log('数据库连接失败'))

学生的集合文件：

const mongoose = require('mongoose')
//创建学生集合规则
const studentsSchema=new mongoose.Schema({name:{type:String,require:true,minlength:2,maxlength:10},age:{type:Number,min:4,max:100},sex:{type:String},email:String,hobbies:[String],collage:String,enterDate:{type:Date,default:Date.now}
})
const Student=mongoose.model('Student',studentsSchema)
//将学生信息导出
module.exports=Student

主页的模板字符串：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"><title>学生档案</title><link rel="stylesheet" href="./css/main.css">
</head>
<body><form action="/add" method="post"><fieldset><legend>学生档案</legend><label>姓名: <input class="normal" type="text" autofocus placeholder="请输入姓名" name="name"></label><label>年龄: <input class="normal"  type="text" placeholder="请输入年龄" name="age"></label><label>性别: <input type="radio" value="0" name="sex"> 男<input type="radio" value="1" name="sex"> 女</label><label>邮箱地址: <input class="normal" type="text" placeholder="请输入邮箱地址" name="email"></label><label>爱好: <input type="checkbox" value="敲代码" name="hobbies"> 敲代码<input type="checkbox" value="打篮球" name="hobbies"> 打篮球<input type="checkbox" value="睡觉" name="hobbies"> 睡觉</label><label>所属学院: <select class="normal"><option value="前端与移动开发">前端与移动开发</option><option value="PHP">PHP</option><option value="JAVA">JAVA</option><option value="Android">Android</option><option value="IOS">IOS</option><option value="UI设计">UI设计</option><option value="C++">C++</option></select></label><label>入学日期: <input type="date" class="normal" name="enterDate"></label><label class="btn"><input type="submit" value="提交" class="normal"></label></fieldset></form>
</body>
</html>

列表页的模板字符串：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>学员信息</title><link rel="stylesheet" href="./css/list.css">
</head>
<body><table><caption>学员信息</caption><tr><th>姓名</th><th>年龄</th><th>性别</th><th>邮箱地址</th><th>爱好</th><th>所属学院</th><th>入学时间</th></tr>{{each students}}<tr><th>{{$value.name}}</th><th>{{$value.age}}</th><th>{{$value.sex=='0'? '男':'女'}}</th><th>{{$value.email}}</th><th>{{each $value.hobbies}}<span>{{$value}}</span>{{/each}}</th><th>{{$value.collage}}</th><th>{{dateFormat($value.enterDate,'yyyy-mm-dd')}}</th></tr>{{/each}}</table>
</body>
</html>

实现的功能：

学生档案信息管理案例相关推荐

前端学习（1364）:学生档案信息管理6
service.js //引入http模块 const http = require('http'); //创建网站服务器 const app = http.createServer();const ...
前端学习（1363）:学生档案信息管理5
service.js //引入http模块 const http = require('http'); //创建网站服务器 const app = http.createServer(); //引入路 ...
前端学习（1362）:学生档案信息管理4
service.js //引入http模块 const http = require('http'); //创建网站服务器 const app = http.createServer(); //引入路 ...
前端学习（1361）:学生档案信息管理3
service.js //引入http模块 const http = require('http'); //创建网站服务器 const app = http.createServer(); //引入路 ...
学生档案信息管理之模板引擎的应用
实现学生信息添加功能在模板的表单中指定请求地址与请求方式为每一个表单项添加name属性添加实现学生信息功能路由接收客户端传递过来的学生信息将学生信息添加到数据库中将页面重定向到 ...
淘宝五星好评案例和实现学生档案管理案例
代码免费资源链接:https://download.csdn.net/download/weixin_50001396/14930528 讲解下载需要使用的字体样式完成静态页面将两种星星重叠 ...
前端学习（1360) :学生档案信息管理2
service.js //引入http模块 const http = require('http'); //创建网站服务器 const app = http.createServer(); //引入路 ...
前端学习（1359) :学生档案信息管理1
\ service.js //引入http模块 const http = require('http'); //创建网站服务器 const app = http.createServer(); // ...
Python高校学生档案管理系统毕业设计源码071528
Python高校学生档案管理系统摘要随着互联网趋势的到来,各行各业都在考虑利用互联网将自己推广出去,最好方式就是建立自己的互联网系统,并对其进行维护和管理.在现实运用中,应用软件的工作规则和开发 ...
基于java实现的学生档案管理系统毕业论文（可下载）
目录摘要学生档案管理系统是当今互联网时代下的趋势和不可缺少的一部分,他可以高效快速的完成和解决信息的查询和录入.随着计算机的快速发展和普及,越来越多的办公离不开电脑. 本系统采用B/S模式 ...

学生档案信息管理案例

一，生成项目描述文件

二，创建网站服务器并实现网站的请求功能

三，实现路由的第三方模块：router

四，当模板引擎引入的文件内有css文件时，需要使用第三方模块解析：serve-static

学生档案信息管理案例相关推荐

最新文章

热门文章