摘要：作為一個(gè)有志向的前端，怎么能不搞搞全棧呢。。。地址歡迎大家多多交流前端技術(shù)啊，如果大家喜歡的話，請(qǐng)給我一個(gè)小小的哦

作為一個(gè)有志向的前端，怎么能不搞搞全(zhuang)棧(bi)呢。。。
說搞咱就搞啊，后端就用node，數(shù)據(jù)庫(kù)就用mongodb，前端呢，呃，再搞個(gè)node的web框架express，思路搞定，開始搭建我們的環(huán)境，搭建之前還是先看看我們的目標(biāo)和成果

mongodb官網(wǎng)： https://www.mongodb.com/downl...
下載好代碼好，進(jìn)入bin文件夾，啟動(dòng)./mongod,再新打開一個(gè)terminal(終端)，啟動(dòng)./mongo

至此我們的數(shù)據(jù)庫(kù)已經(jīng)搭建完畢，我迫不及待的想進(jìn)行增(zhuang)刪(bi)改(da)查(fa)了。這時(shí)候有的同學(xué)就有疑問了，你這上面不是mongoose嗎，跟mongodb有啥關(guān)系啊，看下圖，簡(jiǎn)單來說，我moogoose可以隨意蹂躪你mongodb里面的數(shù)據(jù)，

首先先來連接一下我們的數(shù)據(jù)庫(kù)，其次我們來定義一下數(shù)據(jù)結(jié)構(gòu)，再搞個(gè)model(mongoose里面叫document)

// 數(shù)據(jù)庫(kù)連接
var uuid = require("node-uuid");
var mongoose = require("mongoose");
mongoose.connect("mongodb://127.0.0.1:27017/mart");

var db = mongoose.connection;
db.on("error", console.error.bind(console, "connection error:"));
db.once("open", function() {
    console.log("we are connected");
});

// Schema定義數(shù)據(jù)的數(shù)據(jù)結(jié)構(gòu)
var ProductSchema = mongoose.Schema({
    id: {
        type: String,
        default: uuid.v1
    },
    name: String,
    price: Number,
    url: String
});

// Schema只是定義了數(shù)據(jù)結(jié)構(gòu)，而對(duì)數(shù)據(jù)的處理需要model去實(shí)現(xiàn)
var Product = mongoose.model("Product", ProductSchema);

module.exports = Product;

node+express的搭建這里就不詳細(xì)介紹，對(duì)于大家來說灑灑水啊

var express = require("express");
var path = require("path");
var router = require("./routes");
var bodyParser = require("body-parser");

var app = express();

// view engine set
app.set("views", path.join(__dirname, "views"));
app.set("view engine", "ejs");

// parse application/x-www-form-urlencoded
app.use(bodyParser.urlencoded({ extended: false }))
// parse application/json
app.use(bodyParser.json())

// 托管靜態(tài)文件
app.use(express.static("public"));

app.use("/", router);

var server = app.listen(3000, function () {
  var host = server.address().address;
  var port = server.address().port;

  console.log("Example app listening at http://%s:%s", host, port);
});

定義增刪改查的接口類型和路由跳轉(zhuǎn)，由于偷懶，就先把接口和路由寫在一起了

var express = require("express");
var router = express.Router();
var productModel = require("../mongoose");

router.get("/", function(req, res) {
    res.redirect("/list");
})

router.get("/list", function(req, res) {
    var list = [];
    productModel.find(function(err, products) {
        list = products;
        res.render("list", {
            list
        })
    });
})

// 添加商品
router.post("/admin/add/product", function(req, res) {
    var item = req.body;
    var product = new productModel(req.body);

    product.save(function(err) {
        res.send({
            code: "success",
            data:{}
        })
    });    
})

// 編輯商品
router.post("/admin/edit/product", function(req, res) {
    var item = req.body;
    console.log(item);
    productModel.update({_id: item.id}, item, function(err) {
        res.send({
            code: "success",
            data:{}
        })
    });    
})

// 刪除商品
router.post("/admin/delete/product", function(req, res) {
    console.log(req.body.id);
    productModel.findByIdAndRemove({_id: req.body.id}, {}, 
        function() {
            res.send({
                code: "success",
                data:{}
            })
        }
    )
})

// 搜索商品
router.get("/list/search", function(req, res) {
    var list = [],
        price = {};
    if (req.query.price1) price.$gte = req.query.price1;
    if (req.query.price2) price.$lte = req.query.price2;

    productModel.find({
        price
    }, function(err, products) {
        list = products;
        res.render("list", {
            list
        })
    });
})

module.exports = router;

mongoose具體怎么操作數(shù)據(jù)庫(kù)的，大家可以去查看官網(wǎng)的API哈，http://mongoosejs.com/

我們簡(jiǎn)單的全棧之旅就結(jié)束了，是不是灰常的簡(jiǎn)單，大家的心情是不是灰常的激動(dòng)（我現(xiàn)在TMD是一個(gè)全棧了，2333333333），具體的操作放在github上，本文只是提供一個(gè)簡(jiǎn)單的思路。
github地址： https://github.com/warplan/no...
歡迎大家多多交流前端技術(shù)啊，如果大家喜歡的話，請(qǐng)給我一個(gè)小小的star哦