node + mongodb建站

最近跟着imooc学了下node+mongodb,下面是我的记录和整理

下面是项目文件说明

如何通过npm下载bootstrap,jquery等库

npm install bower(如果提示找不到git无法下载 ，就转到git bash下载)

bower install bootstrap (bootstrap依赖于jquery，所以这个命令会顺便把jquery也下载了)

.bowerrc的作用是指定下载的文件放于哪个目录，启动项目的时候会去自动搜索这个文件，如果有，则按照里面的配置安放文件。

如新建一个文件，.bowerrc，然后在文件中输入

{
     "directory":"public/libs"

}

再利用bower install bootstrap的时候就会自动将bootstrap放入public/libs目录下。

views目录内容安排

head.jade里放入的是头部需要引入的文件

link(href="/libs/bootstrap/dist/css/bootstrap.min.css",rel="stylesheet")
script(src="/libs/jquery/dist/jquery.min.js")

script(src="/libs/bootstrap/dist/js/bootstrap.min.js")

---

header.jade里放入每个文件中要引入的公共部分

.container
     .row
          .page-header
               h1= title

               small 重度科幻迷

---

layout是布局公共页（注意jade的缩进）

doctype html
html(lang="en")
head
     title #{title}
     meta(charset="utf-8")
     include ./includes/head
body
     include ./includes/header

     block content

---

后面的admin.jade，index.jade等，都只需要extends ../layout即可使用这个布局layout.jade布局页

如在jade中：

extends ../layout

block content
     .container
          .row
               each item in movies
                    .col-md-2
                         .thumbnail
                              a(href="/movie/#{item._id}")
                                   img(src="#{item.poster}",alt="#{item.title}")
                              .caption
                                   h3 #{item.title}

                                   p: a.btn.btn-primary(href="/movie/#{item._id}",role="button")观看预告片

 

---

app.js是入口文件，也基本上是这个项目的逻辑部分。                    

var express = require("express");
var port = process.env.PORT || 3000;
var app = express();
var path = require("path");

var bodyParser = require('body-parser');

//包含mongoose模块

var mongoose = require('mongoose');
var Movie = require("./models/movie");
var _ = require("underscore");

//链接mongoose数据库

mongoose.connect("mongodb://localhost/movie")

//设置views的路径是views/pages

app.set("views","./views/pages");

//设置模板引擎

app.set("view engine","jade");

app.use(bodyParser.urlencoded({ extended: true }));

//设置静态资源的路径

app.use(express.static(path.join(__dirname,"public")));

//require/moment

app.locals.moment = require("moment");
app.listen(port);

console.log("Listen on port"+port);

//当路径是/时

app.get("/",function(req,res){

      //fetch所有的movies

     Movie.fetch(function(err,movies){
          if(err){
               console.log(err);
          }
          res.render("index",{
               title:"首页",
               movies:movies
          })
     })    
});

//当路由路径是/admin/list

app.get("/admin/list",function(req,res){

      //获得所有列表，跟index是一样的逻辑

     Movie.fetch(function(err,movies){
          if(err){
               console.log(err);
          }
          res.render("list",{
               title:"列表页",
               movies:movies
          })
     })         
});

//添加电影的逻辑，post过来movie,

//admin post movie
app.post("/admin/movie/new",function(req,res){
     var id = req.body.movie._id;
     var movieObj = req.body.movie;
     var _movie;

     if(id !== 'undefined'){
          Movie.findById(id,function(err,movie){
               if(err){
                    console.log(err);

               }

                //利用underscore模块_把更改了的movie字段更新

               _movie = _.extend(movie,movieObj);

               //save movie。

               _movie.save(function(err,movie){
                    if(err){
                         console.log(err);

                    }

                    //跳转到对应的movie页

                    res.redirect("/movie/"+movie._id);
               })
          })

     }else{

          //新建一个Movie要把所有的值传进去，再save一下

          _movie = new Movie({
               doctor:movieObj.doctor,
               title:movieObj.title,
               country:movieObj.country,
               flash:movieObj.flash,
               poster:movieObj.poster,
               year:movieObj.year,
               summary:movieObj.summary,
               language:movieObj.language
          }),
          _movie.save(function(err,movie){
               if(err){
                    console.log(err);
               }
               res.redirect("/movie/"+movie._id);
          })
     }
})

app.get("/admin/movie",function(req,res){
     res.render("admin",{
          title:"管理员页",
          movie:{
               doctor:"",
               country:"",
               title:"",
               year:"",
               poster:"",
               language:"",
               summary:"",
               flash:""
          }
     })
});

//详情页
app.get("/movie/:id",function(req,res){
     var id = req.params.id;
     Movie.findById(id,function(err,movie){
          res.render("detail",{
               title:movie.title,
               movie:movie
          })
     })    
});

//admin update movie
app.get("/admin/update/:id",function(req,res){
     var id = req.params.id;

     if(id){
          Movie.findById(id,function(err,movie){
               res.render('admin',{
                    title:"更新电影列表",
                    movie:movie
               })
          })
     }
})

//前台当点击删除按钮时，利用ajax把要删除的id传过来，然后从后台remove掉

//list delete movie
app.delete("/admin/list",function(req,res){
     var id = req.query.id;
     // console.log(id);
     // console.log("test");
     if(id){
          Movie.remove({_id:id},function(err,movie){
               if(err){
                    console.log(err);
               }else{
                    res.json({success:1});
               }
          })
     }
})

---

如何删除记录（第一前端是把对应的dom节点删除，第二是把id传到后台）

$(function(){
     $(".del").click(function(e){
          //alert("aaa");
          var target = $(e.target);
          var id = target.data('id');
          var tr = $(".item-id-"+id);

          $.ajax({
               type:"DELETE",
               url:"/admin/list?id="+id
          })
          .done(function(results){
               if(results.success === 1){
                    if(tr.length > 0){
                         tr.remove();
                    }
               }
          })
     })

})

    

---

当所有项目完成以后就可以写package.json和bower.json，一个是说明npm依赖，一个是说明前端的依赖库

方法是：

bower init生成前段依赖库的文档

npm init生成后端依赖库的文档

生成这个是便于别人以后拿这个项目不需要把包什么的都下载，只用主要文件，后根据这两个文件自动加载所倚赖的包

---

源码地址： https://github.com/Christine95/nodejs