By Yi Xiaochun

更新日期:

文章目录
  1. 1. 前言
  2. 2. node.js与npm安装
  3. 3. MongoDB安装
  4. 4. Express安装
  5. 5. Angular安装
  6. 6. Ending

前言

最近尝试接触Web后端技术，看了看基于Java、Python、Nodejs的各种框架，最终选择了MEAN架构进行学习，理由主要包括三个方面：

  1. 轻量级，入门门槛低。
  2. 框架成熟，可参考资料多。
  3. 可以一并学习Angular和Mongodb。

    本次学习历时12天，产出物是一个简单的用户管理系统。这篇博客将会记录我在MEAN的安装配置过程中的一些操作方法，为日后再次上手提供一些支持。

node.js与npm安装

首先引用官网的话来介绍一下node.js与npm。

  • node.js:

    Node.js® is a platform built on Chrome’s JavaScript runtime for easily building fast, scalable network applications. Node.js uses an event-driven, non-blocking I/O model that makes it lightweight and efficient, perfect for data-intensive real-time applications that run across distributed devices.

  • npm:

    npm is the package manager for node .

本人Win8.1-64位系统，Windows的Node.js安装包安装里包含了npm。安装方法非常简单，从node.js官网下载对应版本的msi安装文件安装即可。

MongoDB安装

  • MongoDB

    MongoDB是一种文件导向数据库管理系统，由C++撰写而成，以此来解决应用程序开发社区中的大量现实问题。——维基百科

安装方法:

  1. 官网下载安装包进行安装。
  2. 将MongoDB/bin文件夹添加至系统PATH环境变量。
  3. 安装目录下新建mongo.config配置文件，配置data和log目录。
     ##store data here
 dbpath=D:\mongodb\data 
 ##all output go here
 logpath=D:\mongodb\log\mongo.log 
 ##log read and write operations
 diaglog=3

  4. 启动MongoDB。
    预配置：

     >mongod --config D:\mongodb\mongo.config
 ...
 >mongo
 MongoDB shell version: 2.6.6
 connecting to: test

  5. 添加至Windows本地服务，这样就可以随机器开机启动了。

     > mongod --config D:\mongodb\mongo.config --install
  6. 简单的测试操作。以下代码执行了创建（转换）数据库，添加数据，查找并显示数据的操作。
     >mongo
 MongoDB shell version: 2.6.6
 connecting to: test
 >use usercollection
 swiched to db usercollection
 >db.usercollection.insert({ “username”:“testuser1″,“email”:“testuser1@testdomain.com” })
 ...
 >db.usercollection.find().pretty()
 ...

Express安装

  • Express

    Express 是一个简洁、灵活的 node.js Web 应用开发框架, 它提供一系列强大的特性，帮助你创建各种 Web 和移动设备应用。

网上关于Express安装的博客很多，但方法不尽相同。主要差异原因在于Express版本的变化。文章主要参考Express官网指南进行安装，Express版本4.x。

安装方法：

  1. 使用生成器生成。

     $ npm install -g express-generator

  2. 编辑依赖项。
    根据项目需求修改package.json文件，在dependencies中添加MongoDB和Monk的依赖：

     "mongodb": "\*",
 "monk": "\*"

  3. 安装。

     $ npm install

  4. 测试。成功后打开localhost:3000将会显示Express主页。

     $ npm start

  5. 使用monk连接MongoDB。
    在app.js中添加以下代码

     var mongo = require('mongodb');
 var monk = require('monk');
 var db = monk('localhost:27017/yourdbname');
 ...
 app.use(function(req,res,next){
     req.db = db;
     res.locals.user = req.session.user;
     next();
 });

  6. 后端调用数据库方法

     var db = req.db;
 var collection = db.get('usercollection');
 //查询
 collection.find({email:req.body.email,password:req.body.password},{},function(e,docs){});
 //插入
 collection.insert(req.body,function(err,doc){});
 //更新
 collection.update({email:req.body.olduser.email},req.body.newuser,{safe:true},function(e,docs){});
 //删除
 collection.remove({email:req.body.email},{safe:true},function(e,docs){});

使用monk操作MongoDB的方法在网上并没有查阅到相关文档，也许是我查找的方式不对。另一种方法是使用mongoose操作，资料较全。

Angular安装

  • Angular

    AngularJS是一款开源JavaScript函式库，由Google维护，用来协助单一页面应用程序运行的。它的目标是透过MVC模式（MVC）功能增强基于浏览器的应用，使开发和测试变得更加容易。——维基百科

官网和百科上对Angular的解释一如既往的深入难懂，但估计大部分小白第一次接触Angular只是被大牛告诉Angular出色的双向数据绑定的功能。快速了解Angular可以参考文末文章《怎样快速的学习AngularJS》。

Angular和Bootstrap不算是安装了，在前端添加依赖就可（也可以用npm、bower类似的工具进行配置与管理）。js和css包可以在官网下载。

Express安装完成后，在目录中添加App文件夹存放前端文件，修改默认启动入口，删除Express中不需要的文件与文件夹。

Ending

MEAN架构的优势主要在于前段后端的一体化，被誉为前端工程师的福音。在学习的过程中也接触到许多项目生成方法如：

  1. mean.io
  2. 基于Yeoman生成器，如generator-meanstack

不多作为初学者，而且目标系统也很简单轻小，因此没有一开始就上手这种方法。以后有机会可以尝试。

最后的最后，感谢一下给予帮助的博客文章们：

  1. 什么是MEAN全堆栈javascript开发框架
  2. IBM文档库：精通MEAN系列(推荐)
  3. 从零开始搭建Node.js, Express, Ejs, Mongodb服务器
  4. Node+Express+Mongodb+monk简易入门教程
  5. How To Install MongoDB On Windows
  6. 从零开始NodeJs系列文章(推荐)
  7. 使用express4.x版和Jade模板重写《nodejs开发指南》微博实例
  8. Angular学习笔记
  9. 怎么样快速入门AngularJS
文章目录
  1. 1. 前言
  2. 2. node.js与npm安装
  3. 3. MongoDB安装
  4. 4. Express安装
  5. 5. Angular安装
  6. 6. Ending