express + mongodb 搭建一个简易网站（三）

前面已经实现了基本的网站功能，现在我们就开始开搞一个完整的网站，现在整个网站的UI就是下面的这个样子。

我们网站的样子就照着这个来吧。

1.为了便于维护，还是在views里面再建一个文件夹吧，就叫components吧，这个文件夹中维护的就是我们要用的公共组件。那好，我们就先在
components中新建两个文件header.ejs和footer.ejs。

在header.ejs中添加如下代码：

<div class="header">

<ul class="nav">

<li><a href="/all">所有宝贝</a></li>

<li><a href="/jacket">上衣</a></li>

<li><a href="/pants">下装</a></li>

<li><a href="/discount">清仓区</a></li>

<li><a href="/admin">登录</a></li>

</ul>

</div>

在footer.ejs中添加如下代码：

<div class="footer">

<ul>

<li><a>联系我们</a></li>

<li><a>广告合作</a></li>

<li><a>品牌招商</a></li>

</ul>

</div>

为了保持语义化，在views文件夹下新建all.ejs、discount.ejs、jacket.ejs、pants.ejs四个文件，里面的内容就空着吧，以前的几个文件可以删除了。
all.ejs模板文件对应的是导航中的“所有宝贝”，discount.ejs对应的是导航中的“清仓区”，jacket.ejs对应的是导航中的“上衣”，pants.ejs对应的是导航的“下装”，至于登录页，我们放到后面做。在四个文件中里添加如下代码（四个文件一样）：

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>website</title>

<link rel="stylesheet" type="text/css" href="/css/reset.css">

<link rel="stylesheet" type="text/css" href="/css/public.css">

</head>

<body>

<div class="wrap">

<%include ./components/header.ejs %>

<div class="all_goods">

<ul class="goods">

<% goods.forEach(function(item) {%>

<li>

<img src="<%= item.url %>">

<span class="title"><%= item.title %></span>

<span class="price"><%= item.price %></span>

</li>

<%}) %>

</ul>

</div>

<%include ./components/footer.ejs %>

</div>

</body>

</html>

2.由于模板文件已经改名了，所以路由也需要相应的修改，由于现在还没有连接到数据库，所以先用使用假数据测试，
在routes文件中找到app.js，代码修改如下：

module.exports = function (app) {

app.use('/', require('./all'));

app.use('/all', require('./all'));

app.use('/discount', require('./discount'));

app.use('/jacket', require('./jacket'));

app.use('/pants', require('./pants'));

};

在all.js中代码修改如下：

var express = require('express');

var router = express.Router();

router.get('/', function(req, res) {

res.render('all', {goods: [

{url: 'https://img.alicdn.com/imgextra/i3/1020250042/TB2qHT5pypnpuFjSZFkXXc4ZpXa_!!1020250042-0-beehive-scenes.jpg_180x180q70', title: '女生裙子', price: '49元'},

{url: 'https://img.alicdn.com/imgextra/i3/1020250042/TB2qHT5pypnpuFjSZFkXXc4ZpXa_!!1020250042-0-beehive-scenes.jpg_180x180q70', title: '女生裙子', price: '49元'},

{url: 'https://img.alicdn.com/imgextra/i3/1020250042/TB2qHT5pypnpuFjSZFkXXc4ZpXa_!!1020250042-0-beehive-scenes.jpg_180x180q70', title: '女生裙子', price: '49元'},

{url: 'https://img.alicdn.com/imgextra/i3/1020250042/TB2qHT5pypnpuFjSZFkXXc4ZpXa_!!1020250042-0-beehive-scenes.jpg_180x180q70', title: '女生裙子', price: '49元'},

{url: 'https://img.alicdn.com/imgextra/i3/1020250042/TB2qHT5pypnpuFjSZFkXXc4ZpXa_!!1020250042-0-beehive-scenes.jpg_180x180q70', title: '女生裙子', price: '49元'},

{url: 'https://img.alicdn.com/imgextra/i3/1020250042/TB2qHT5pypnpuFjSZFkXXc4ZpXa_!!1020250042-0-beehive-scenes.jpg_180x180q70', title: '女生裙子', price: '49元'},

{url: 'https://img.alicdn.com/imgextra/i3/1020250042/TB2qHT5pypnpuFjSZFkXXc4ZpXa_!!1020250042-0-beehive-scenes.jpg_180x180q70', title: '女生裙子', price: '49元'},

{url: 'https://img.alicdn.com/imgextra/i3/1020250042/TB2qHT5pypnpuFjSZFkXXc4ZpXa_!!1020250042-0-beehive-scenes.jpg_180x180q70', title: '女生裙子', price: '49元'},

{url: 'https://img.alicdn.com/imgextra/i3/1020250042/TB2qHT5pypnpuFjSZFkXXc4ZpXa_!!1020250042-0-beehive-scenes.jpg_180x180q70', title: '女生裙子', price: '49元'},

{url: 'https://img.alicdn.com/imgextra/i3/1020250042/TB2qHT5pypnpuFjSZFkXXc4ZpXa_!!1020250042-0-beehive-scenes.jpg_180x180q70', title: '女生裙子', price: '49元'},

{url: 'https://img.alicdn.com/imgextra/i3/1020250042/TB2qHT5pypnpuFjSZFkXXc4ZpXa_!!1020250042-0-beehive-scenes.jpg_180x180q70', title: '女生裙子', price: '49元'},

{url: 'https://img.alicdn.com/imgextra/i3/1020250042/TB2qHT5pypnpuFjSZFkXXc4ZpXa_!!1020250042-0-beehive-scenes.jpg_180x180q70', title: '女生裙子', price: '49元'},

{url: 'https://img.alicdn.com/imgextra/i3/1020250042/TB2qHT5pypnpuFjSZFkXXc4ZpXa_!!1020250042-0-beehive-scenes.jpg_180x180q70', title: '女生裙子', price: '49元'},

{url: 'https://img.alicdn.com/imgextra/i3/1020250042/TB2qHT5pypnpuFjSZFkXXc4ZpXa_!!1020250042-0-beehive-scenes.jpg_180x180q70', title: '女生裙子', price: '49元'},

{url: 'https://img.alicdn.com/imgextra/i3/1020250042/TB2qHT5pypnpuFjSZFkXXc4ZpXa_!!1020250042-0-beehive-scenes.jpg_180x180q70', title: '女生裙子', price: '49元'},

{url: 'https://img.alicdn.com/imgextra/i3/1020250042/TB2qHT5pypnpuFjSZFkXXc4ZpXa_!!1020250042-0-beehive-scenes.jpg_180x180q70', title: '女生裙子', price: '49元'},

{url: 'https://img.alicdn.com/imgextra/i3/1020250042/TB2qHT5pypnpuFjSZFkXXc4ZpXa_!!1020250042-0-beehive-scenes.jpg_180x180q70', title: '女生裙子', price: '49元'},

{url: 'https://img.alicdn.com/imgextra/i3/1020250042/TB2qHT5pypnpuFjSZFkXXc4ZpXa_!!1020250042-0-beehive-scenes.jpg_180x180q70', title: '女生裙子', price: '49元'},

{url: 'https://img.alicdn.com/imgextra/i3/1020250042/TB2qHT5pypnpuFjSZFkXXc4ZpXa_!!1020250042-0-beehive-scenes.jpg_180x180q70', title: '女生裙子', price: '49元'},

{url: 'https://img.alicdn.com/imgextra/i3/1020250042/TB2qHT5pypnpuFjSZFkXXc4ZpXa_!!1020250042-0-beehive-scenes.jpg_180x180q70', title: '女生裙子', price: '49元'}

]})

})

module.exports = router;

在discount.js文件中添加如下代码：

var express = require('express');

var router = express.Router();

router.get('/', function(req, res) {

res.render('discount', {goods: [

{url: 'https://ss0.baidu.com/6ONWsjip0QIZ8tyhnq/it/u=3663715146,1860018343&fm=80&w=179&h=119&img.JPEG', title: '米格-31', price: '特价49元'},

{url: 'https://ss0.baidu.com/6ONWsjip0QIZ8tyhnq/it/u=3663715146,1860018343&fm=80&w=179&h=119&img.JPEG', title: '米格-31', price: '特价49元'},

{url: 'https://ss0.baidu.com/6ONWsjip0QIZ8tyhnq/it/u=3663715146,1860018343&fm=80&w=179&h=119&img.JPEG', title: '米格-31', price: '特价49元'},

{url: 'https://ss0.baidu.com/6ONWsjip0QIZ8tyhnq/it/u=3663715146,1860018343&fm=80&w=179&h=119&img.JPEG', title: '米格-31', price: '特价49元'},

{url: 'https://ss0.baidu.com/6ONWsjip0QIZ8tyhnq/it/u=3663715146,1860018343&fm=80&w=179&h=119&img.JPEG', title: '米格-31', price: '特价49元'},

{url: 'https://ss0.baidu.com/6ONWsjip0QIZ8tyhnq/it/u=3663715146,1860018343&fm=80&w=179&h=119&img.JPEG', title: '米格-31', price: '特价49元'},

{url: 'https://ss0.baidu.com/6ONWsjip0QIZ8tyhnq/it/u=3663715146,1860018343&fm=80&w=179&h=119&img.JPEG', title: '米格-31', price: '特价49元'},

{url: 'https://ss0.baidu.com/6ONWsjip0QIZ8tyhnq/it/u=3663715146,1860018343&fm=80&w=179&h=119&img.JPEG', title: '米格-31', price: '特价49元'},

{url: 'https://ss0.baidu.com/6ONWsjip0QIZ8tyhnq/it/u=3663715146,1860018343&fm=80&w=179&h=119&img.JPEG', title: '米格-31', price: '特价49元'}

]})

})

module.exports = router;

在jacket.js中添加如下代码：

var express = require('express');

var router = express.Router();

router.get('/', function(req, res) {

res.render('jacket', {goods: [

{url: 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3365611160,2639098405&fm=117&gp=0.jpg', title: '美美的上衣', price: '49元'},

{url: 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3365611160,2639098405&fm=117&gp=0.jpg', title: '美美的上衣', price: '49元'},

{url: 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3365611160,2639098405&fm=117&gp=0.jpg', title: '美美的上衣', price: '49元'},

{url: 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3365611160,2639098405&fm=117&gp=0.jpg', title: '美美的上衣', price: '49元'},

{url: 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3365611160,2639098405&fm=117&gp=0.jpg', title: '美美的上衣', price: '49元'},

{url: 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3365611160,2639098405&fm=117&gp=0.jpg', title: '美美的上衣', price: '49元'},

{url: 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3365611160,2639098405&fm=117&gp=0.jpg', title: '美美的上衣', price: '49元'},

{url: 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3365611160,2639098405&fm=117&gp=0.jpg', title: '美美的上衣', price: '49元'},

{url: 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3365611160,2639098405&fm=117&gp=0.jpg', title: '美美的上衣', price: '49元'},

{url: 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3365611160,2639098405&fm=117&gp=0.jpg', title: '美美的上衣', price: '49元'},

{url: 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3365611160,2639098405&fm=117&gp=0.jpg', title: '美美的上衣', price: '49元'},

{url: 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3365611160,2639098405&fm=117&gp=0.jpg', title: '美美的上衣', price: '49元'},

{url: 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3365611160,2639098405&fm=117&gp=0.jpg', title: '美美的上衣', price: '49元'},

{url: 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3365611160,2639098405&fm=117&gp=0.jpg', title: '美美的上衣', price: '49元'},

{url: 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3365611160,2639098405&fm=117&gp=0.jpg', title: '美美的上衣', price: '49元'},

{url: 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3365611160,2639098405&fm=117&gp=0.jpg', title: '美美的上衣', price: '49元'},

{url: 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3365611160,2639098405&fm=117&gp=0.jpg', title: '美美的上衣', price: '49元'},

{url: 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3365611160,2639098405&fm=117&gp=0.jpg', title: '美美的上衣', price: '49元'},

{url: 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3365611160,2639098405&fm=117&gp=0.jpg', title: '美美的上衣', price: '49元'},

{url: 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3365611160,2639098405&fm=117&gp=0.jpg', title: '美美的上衣', price: '49元'}

]})

})

module.exports = router;

在pants.js文件中添加如下代码：

var express = require('express');

var router = express.Router();

router.get('/', function(req, res) {

res.render('jacket', {goods: [

{url: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2035613461,1411584253&fm=26&gp=0.jpg', title: '短裤女', price: '49元'},

{url: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2035613461,1411584253&fm=26&gp=0.jpg', title: '短裤女', price: '49元'},

{url: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2035613461,1411584253&fm=26&gp=0.jpg', title: '短裤女', price: '49元'},

{url: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2035613461,1411584253&fm=26&gp=0.jpg', title: '短裤女', price: '49元'},

{url: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2035613461,1411584253&fm=26&gp=0.jpg', title: '短裤女', price: '49元'},

{url: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2035613461,1411584253&fm=26&gp=0.jpg', title: '短裤女', price: '49元'},

{url: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2035613461,1411584253&fm=26&gp=0.jpg', title: '短裤女', price: '49元'},

{url: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2035613461,1411584253&fm=26&gp=0.jpg', title: '短裤女', price: '49元'},

{url: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2035613461,1411584253&fm=26&gp=0.jpg', title: '短裤女', price: '49元'},

{url: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2035613461,1411584253&fm=26&gp=0.jpg', title: '短裤女', price: '49元'},

{url: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2035613461,1411584253&fm=26&gp=0.jpg', title: '短裤女', price: '49元'},

{url: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2035613461,1411584253&fm=26&gp=0.jpg', title: '短裤女', price: '49元'},

{url: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2035613461,1411584253&fm=26&gp=0.jpg', title: '短裤女', price: '49元'},

{url: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2035613461,1411584253&fm=26&gp=0.jpg', title: '短裤女', price: '49元'},

{url: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2035613461,1411584253&fm=26&gp=0.jpg', title: '短裤女', price: '49元'},

{url: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2035613461,1411584253&fm=26&gp=0.jpg', title: '短裤女', price: '49元'},

{url: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2035613461,1411584253&fm=26&gp=0.jpg', title: '短裤女', price: '49元'},

{url: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2035613461,1411584253&fm=26&gp=0.jpg', title: '短裤女', price: '49元'},

{url: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2035613461,1411584253&fm=26&gp=0.jpg', title: '短裤女', price: '49元'},

{url: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2035613461,1411584253&fm=26&gp=0.jpg', title: '短裤女', price: '49元'},

{url: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2035613461,1411584253&fm=26&gp=0.jpg', title: '短裤女', price: '49元'},

{url: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2035613461,1411584253&fm=26&gp=0.jpg', title: '短裤女', price: '49元'},

{url: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2035613461,1411584253&fm=26&gp=0.jpg', title: '短裤女', price: '49元'}

]})

})

module.exports = router;

3.在根目录下新建一个public文件夹，里面存放的是项目使用到的静态文件，在public下新建三个文件夹，分别是js，css，img，在css下新建public.css和
reset.css，reset.css初始化浏览器样式文件，
在reset.css中添加如下代码：

/**

* Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/)

* http://cssreset.com

*/

html, body, div, span, applet, object, iframe,

h1, h2, h3, h4, h5, h6, p, blockquote, pre,

a, abbr, acronym, address, big, cite, code,

del, dfn, em, img, ins, kbd, q, s, samp,

small, strike, strong, sub, sup, tt, var,

b, u, i, center,

dl, dt, dd, ol, ul, li,

fieldset, form, label, legend,

table, caption, tbody, tfoot, thead, tr, th, td,

article, aside, canvas, details, embed,

figure, figcaption, footer, header,

menu, nav, output, ruby, section, summary,

time, mark, audio, video, input {

margin: 0;

padding: 0;

border: 0;

font-size: 100%;

font-weight: normal;

vertical-align: baseline;

}

/* HTML5 display-role reset for older browsers */

article, aside, details, figcaption, figure,

footer, header, menu, nav, section {

display: block;

}

body {

line-height: 1;

}

blockquote, q {

quotes: none;

}

blockquote:before, blockquote:after,

q:before, q:after {

content: none;

}

table {

border-collapse: collapse;

border-spacing: 0;

}

/* custom */

a {

color: #7e8c8d;

text-decoration: none;

-webkit-backface-visibility: hidden;

}

li {

list-style: none;

}

::-webkit-scrollbar {

width: 5px;

height: 5px;

}

::-webkit-scrollbar-track-piece {

background-color: rgba(0, 0, 0, 0.2);

-webkit-border-radius: 6px;

}

::-webkit-scrollbar-thumb:vertical {

height: 5px;

background-color: rgba(125, 125, 125, 0.7);

-webkit-border-radius: 6px;

}

::-webkit-scrollbar-thumb:horizontal {

width: 5px;

background-color: rgba(125, 125, 125, 0.7);

-webkit-border-radius: 6px;

}

html, body {

width: 100%;

}

body {

-webkit-text-size-adjust: none;

-webkit-tap-highlight-color: rgba(0, 0, 0, 0);

}

在public.css中添加入选代码：

body,html{

height: 100%;

}

.wrap{

width: 100%;

height: 100%;

display: flex;

flex-direction: column;

background: url(/img/bg.png) repeat;
overflow: auto;

}

.header{

width: 100%;

height: 120px;

line-height: 160px;

background-image: url(/img/bird.png),url(/img/word.png);

background-repeat: no-repeat no-repeat;

background-position: left center, right center;

background-size: auto 100%;

text-align: center;

}

.header li{

display: inline-block;

margin:0 12px;

}

.header li:last-clild{

margin-left: 30px;

}

.footer{

width: 100%;

height: 80px;

line-height: 80px;

background: #ccc;

text-align: center;

}

.footer li{

display: inline-block;

}

.all_goods{

width: 100%;

flex: 1;

}

.all_goods .goods{

width: 80%;

min-width: 960px;

margin: 0 auto;

}

.goods li{

display: inline-block;

position: relative;

width: 22%;

min-height: 60px;

margin: 6px 1%;

border: 1px solid #ccc;

border-radius: 4px;

box-shadow: 0 4px 8px 0 rgba(7,17,27,.1);

}

.goods img{

height: 100%;

width: 100%;

}

.goods .title,.goods .price{

position: absolute;

color: #fff;

}

.goods .title{

left: 6px;

bottom:4px;

}

.goods .price{

right: 6px;

bottom: 4px;

}

在img文件夹中添加三张图片，分别是bg.png，bird.png，word.png，图片就贴在下面，可以拷贝下来放在自己的img文件夹中。

bg.png:

bird.png

word.png

4.最后还需要修改项目的入口app.js，app.js代码最终修改为：

var express = require('express'); // 引入express框架

var path = require('path'); // 引入path模块

var routes = require('./routes/app');// 引入路由模块

var port = process.env.PORT || 8000; // 设置端口号：3000

var app = express(); //实例化express

var serveStatic = require('serve-static'); // 静态文件处理

app.use(serveStatic('public')); // 路径：public

app.set('views', path.join(__dirname, 'views'));

app.set('view engine', 'ejs');

app.listen(port); // 启动web服务。

routes(app);

console.log('server listening at ' + port);

其实就多了

var serveStatic = require('serve-static'); // 静态文件处理

app.use(serveStatic('public')); // 路径：public

现在就可以在控制台输入node app运行项目试试效果，是不是已经有常见的网站模样了。

express + mongodb 搭建一个简易网站（三）的更多相关文章

express + mongodb 搭建一个简易网站（四）
express + mongodb 搭建一个简易网站 (四) 目前网站整体页面都已经能全部展示了,但是,整个网站还有两个块需要做完才能算完整,一个连接数据库,目前网站上的数据都是抓取的本地假数据,所以 ...
express + mongodb 搭建一个简易网站(二)
express + mongodb 搭建一个简易网站 (二) 在搭建网站(一)中,实现了简单的路由功能,这离一个完整的网站还差的有点远,继续撸代码吧. 1.首先在根目录下新建一个views文件夹,用来 ...
express + mongodb 搭建一个简易网站(一)
express + mongodb 搭建一个简易网站(一) 前言:后台使用node.js的express框架,数据库使用mongodb,模板使用ejs.大概就这些. 开始第一个简易网站之旅吧.... ...
express + mongodb 搭建一个简易网站（五）
前面已经将导航中的“所有宝贝”页面连上了mongodb,现在我们就把其他的页面脸上数据库,将整个网站全部实现. 打开routes文件,找到jacket.js,将里面的代码修改如下: var expre ...
从无到有，用Nodejs+express+mongodb搭建简易登陆系统
前端处理server表示很蛋疼,初学Node,虽然感觉异常强大,但是学起来还是有些吃力的,Node是工具,它不是万能的,搭建一个系统还是需要借助其他一些工具,对于我这个没怎么接触server的前端来说 ...
使用EF Code First搭建一个简易ASP.NET MVC网站,允许数据库迁移
本篇使用EF Code First搭建一个简易ASP.NET MVC 4网站,并允许数据库迁移. 创建一个ASP.NET MVC 4 网站. 在Models文件夹内创建Person类. public ...
Angularjs,WebAPI 搭建一个简易权限管理系统
Angularjs,WebAPI 搭建一个简易权限管理系统 Angularjs名词与概念(一) 1. 目录前言 Angularjs名词与概念权限系统原型权限系统业务数据库设计和实现 Web ...
利用git+hugo+markdown 搭建一个静态网站
利用git+hugo+markdown 搭建一个静态网站一直想要有一个自己的文档管理系统: 可以很方便书写,而且相应的文档很容易被分享很方便的存储.管理.历史记录比较方面的浏览和查询第一点用M ...
Django搭建博客网站(三)
Django搭建博客网站(三) 第三篇主要记录view层的逻辑和template. Django搭建博客网站(一) Django搭建博客网站(二) 结构网站结构决定我要实现什么view. 我主要要用 ...

随机推荐

Vs2008应用程序升级为vs2012
Vs2008应用程序升级为vs2012 编写人:左丘文 2015-5-21 近来一直有想法,想将开发环境升级 vs2008到vs2012,在此做个小结,将自己碰到的一系统问题,分享出来,以供参考.有兴 ...
ios之runloop笔记
网上关于runloop的文章不计其数,再此,贴个自认为讲的比较简单明了的文章 http://www.jianshu.com/p/536184bfd163 个人理解: ios的runloop应该是类似于 ...
bzoj4236 JOIJOI
Description JOIOJI桑是JOI君的叔叔.“JOIOJI”这个名字是由“J.O.I”三个字母各两个构成的. 最近,JOIOJI桑有了一个孩子.JOIOJI桑想让自己孩子的名字和自己一样由 ...
深入理解HTTP协议之POST方法——ajax实例
作者:吴俊杰性别:男邮箱:sshroot@126.com 文章类型:原创博客:http://www.cnblogs.com/voiphudong/ 一.说明http协议其实是一个相对比较简单的应 ...
转 - ubuntu 安装node.js 与 npm
原文链接为: https://blog.csdn.net/wangtaoking1/article/details/78005038 这篇文章介绍如何在ubuntu环境下安装node环境. 我使用的系 ...
中国标准时间改为formatTime格式
1.toLocaleDateString (根据本地时间把Date 对象的日期部分转换为字符串): var time = new Date(); var formatTime = time.toLoc ...
node使用MySQL数据库
内容: 1.node连接数据库 2.数据库常用操作 3.数据库实例 - 用户注册.登陆 1.node连接数据库 (1)下载mysql模块 (2)使用mysql模块连接数据库 let db=mysql. ...
javascript 常用获取页面宽高信息 API
在页面的构建中常常会需要获取页面的一些宽高信息,例如实现惰性加载图片需要获取页面的可见区域高度和已滚动区域的高度,以判断图片所在位置是否可见来决定加载图片的时间, 花点时间整理了一下,获取页 ...
scrapy与redis分布式组件
Scrapy 和 scrapy-redis的区别 Scrapy 是一个通用的爬虫框架,但是不支持分布式,Scrapy-redis是为了更方便地实现Scrapy分布式爬取,而提供了一些以redis为基础 ...
Win10交换Ctrl和大写键
打开注册表 [HKEY_LOCAL_MacHINE\SYSTEM\CurrentControlSet\Control\Keyboard Layout] "Scancode Map" ...

express + mongodb 搭建一个简易网站 （三）

express + mongodb 搭建一个简易网站 （三）

express + mongodb 搭建一个简易网站 （三）的更多相关文章

随机推荐

热门专题

express + mongodb 搭建一个简易网站（三）

express + mongodb 搭建一个简易网站（三）

express + mongodb 搭建一个简易网站（三）的更多相关文章