# [**node.js项目环境安装配置**]

## **需要准备的软件**

- 数据库MongoDB

- 图形化的MongoDB管理工具MongoChef

- node.js（下载地址：https://nodejs.org/zh-cn/）

- npm（Node的模块管理器，用来安装别人写好的模块。不用单独安装，安装 Node.js时默认已经默认安装了）

- 编辑器（webstorm）

## **配置环境**

### **安装Node.js和npm。**

1. Windows 或 Mac 直接去 Node.js 官网下载安装，默认是已经安装上 npm 的，查看 node.js 和npm版本可以在终端分别输入 node -v 和 npm -v 可以查看各自的版本号。

2. 用 npm 安装模块。安装分为本地安装和全局安装。如果需要用到 Node.js 的 require 来获取依赖，那么需要本地安装。(以下是在terminal（终端）运行的命令)

- 本地安装命令：npm install。这个命令就是在命令行的当前目录下创建一个叫node_modules的文件夹，然后把安装代码放到这个文件夹下面。（在项目目录中使用该命令）。

- 在install后，如果没有异常，安装的代码将会出现在 node_modules 的目录下。查看是否安装成功，Mac及Linux系统下命令是：ls node_modules (ls命令表示遍历当前目录下的文件)。Windows系统下命令是：dir node_modules(dir同ls命令)。

### **安装MongoDB**

1.Mac上用brew在线安装：brew install mongodb（参考链接：http://yijiebuyi.com/blog/b6a3f4a726b9c0454e28156dcc96c342.html)

2.下载MongoDB源码，解压，安装。（下载地址：https://www.mongodb.com/download-center?jmp=nav#community）

### **安装MongoChef**

1. 下载MongoChef（下载地址：http://3t.io/mongochef/）默认安装即可。

## **项目导入打开**

1. 把项目导入webstorm编辑器。

2. 启动MongoDB数据库：在终端下输入sudo mongod，在弹出的输入密码框中输入电脑密码即可，此时终端会显示等待连接端口。（数据库已在项目代码中创建完成）

3. 打开MongoChef，点击连接在弹出窗口选择要连接的数据库连接即可。此时终端会显示已经连接上数据库中的数据表。

4. 启动npm，在终端下，切换到项目目录，输入 npm start启动npm

5. 在浏览器中打开项目地址完成。

**以上都是在Mac上的操作**

**可能需要了解的框架：vue.js框架（链接：https://vuejs.org.cn/guide/overview.html）和React框架（链接：https://facebook.github.io/react/docs/why-react-zh-CN.html）express.js**

## **项目结构（只涉及到数据处理）**

项目结构如图所示不会有太大变化。

- app文件夹中存放数据模型models文件和模型调用数据库端口号设置setting文件。

- bin文件存放命令行相关代码

- node_modules是进行npm安装之后自动生成的需要调用的模块，需要添加的模块都下载到这里。

- public文件夹中存放公共CSS文件，图片，公共js代码

- routes是路由文件的存放处

- view文件夹存放html静态页面

-package.json文件：每个项目的根目录下面，一般都有一个package.json文件，定义了这个项目所需要的各种模块，以及项目的配置信息（比如名称、版本、许可证等元数据）。npm install命令根据这个配置文件，自动下载所需的模块，也就是配置项目所需的运行和开发环境。

- server.js是服务器模块负责连接数据库并实现监听端口等行为,建立的models文件和页面路由文件也需要在此文件中请求使用

### **项目中数据处理的步骤**

**执行流程： a.html文件加载（暂时没有数据）（引用vue框架来加载数据）---->引用a.js来请求数据（根据路由地址）----->在server.js中设置路由请求地址----->server.js请求地址到相应的路由文件根据模型设置数据进行数据操作----->路由请求到model文件夹在模型

- demo:a.html 中(引用js文件，a.js和vue.js) -----> a.js中（ this.$http.get('http://127.0.0.1:3000/api/a').then(function (response) ）-----> server.js 中var health = require('./routes/a_route');app.use('/api/a', health);-----> var example= require('../app/models/a_Model')接下来对example进行数据增删查改 **

1. 建立数据模型。

- 在app－models文件夹中创建一个js文件，文件命名一般和实际意义相关（尽量英文）。

- 在建立数据模型时需要用到mongoose语句来实例化连接对象（在server.js中已经连接到了数据库）数据库（mongoose是MongoDB的驱动程序）。

- 建立schema（一种以文件形式存储的数据库模型骨架，不具备数据库操作能力）

- 建立model（由schema生成的模型具有抽象属性和行为的数据库操作对）

- 建立Entity（model创建的实体，操作会影响数据库）

Demo：

> var mySchema = new mongoose.Schema ({ name : String });//创建模式

> var Name = new mongoose.model ( 'Name' , mySchema); //建一个数据表names（数据库不存在该数据库的时候添加数据会默认添加数据库并会把大写字母改为小写字母并变为复数）

> var jack = new Name ({ name: 'jack' });//新建一条数据到数据表中

> var jack.save ( function (err) ){

> if(err) return console.log(err);

>console.log('save success');}

2. 建立路由文件可以把操作数据库的方法放到这里来。

3. 在server.js中设置连接数据库例以及设置数据请求路径：mongoose.connect('');

app.use('/api/health', health);

//浏览器中http://127.0.0.1:3000/api/health

4. 在js文件中引用 （vue方法）this.$http.get('http://127.0.0.1:3000/api/health').then(function (response) {｝获取数据

5.把数据附加到html静态页。语法：｛｛｝｝（页面需引用vue文件）。