node express mongoose簡單實現全棧之增刪改查

做爲一個有志向的前端,怎麼能不搞搞全(zhuang)棧(bi)呢。。。
說搞咱就搞啊,後端就用node,數據庫就用mongodb,前端呢,呃,再搞個node的web框架express,思路搞定,開始搭建咱們的環境,搭建以前仍是先看看咱們的目標和成果前端

項目的目標和成果

圖片描述圖片描述圖片描述

1.下載mongodb

mongodb官網: https://www.mongodb.com/downl...
下載好代碼好,進入bin文件夾,啓動./mongod,再新打開一個terminal(終端),啓動./mongonode

clipboard.png

至此咱們的數據庫已經搭建完畢,我火燒眉毛的想進行增(zhuang)刪(bi)改(da)查(fa)了。這時候有的同窗就有疑問了,你這上面不是mongoose嗎,跟mongodb有啥關係啊,看下圖,簡單來講,我moogoose能夠隨意蹂躪你mongodb裏面的數據,git

clipboard.png

2.搭建數據結構

首先先來鏈接一下咱們的數據庫,其次咱們來定義一下數據結構,再搞個model(mongoose裏面叫document)github

// 數據庫鏈接
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定義數據的數據結構
var ProductSchema = mongoose.Schema({
    id: {
        type: String,
        default: uuid.v1
    },
    name: String,
    price: Number,
    url: String
});

// Schema只是定義了數據結構,而對數據的處理須要model去實現
var Product = mongoose.model('Product', ProductSchema);

module.exports = Product;

3.創建前端的頁面、路由和請求的接口

node+express的搭建這裏就不詳細介紹,對於你們來講灑灑水啊web

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())

// 託管靜態文件
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);
});

定義增刪改查的接口類型和路由跳轉,因爲偷懶,就先把接口和路由寫在一塊兒了mongodb

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具體怎麼操做數據庫的,你們能夠去查看官網的API哈,http://mongoosejs.com/數據庫

結語

咱們簡單的全棧之旅就結束了,是否是灰常的簡單,你們的心情是否是灰常的激動(我如今TMD是一個全棧了,2333333333),具體的操做放在github上,本文只是提供一個簡單的思路。
github地址: https://github.com/warplan/no...
歡迎你們多多交流前端技術啊,若是你們喜歡的話,請給我一個小小的star哦express

相關文章
相關標籤/搜索