当我们把Vue框架的概念过了一遍之后，要进一步提升，就要看看别人是怎么使用Vue框架来做项目了。
在github上有不少好的Vue项目，我找到了其中的一个，并把它作为下一步学习的目标。
链接地址：https://github.com/bailicangdu/vue2-elm
这是一个基于vue2+vuex构建的，具有45个页面的大型单页面应用，它高仿了“饿了么”外卖App。
第一讲，我们先看看这个项目的后台，即数据存储部分。
该项目分成两部分，一个是前端，一个是后端，链接分别是：https://github.com/bailicangdu/vue2-elm和https://github.com/bailicangdu/node-elm
前端采用vue框架，后端基于node服务器，数据库使用MongoDB。
它们的运行方式相近：
打开一个命令窗口 进入项目所在的目录 npm install npm run dev一般先运行后端，再运行前端。
项目的一些截图：
MongoDB可以去它的官网下载，网址为：www.mongodb.org
但官网首页不容易找到下载链接，下面的这个网址提供了比较齐全的下载链接：http://dl.mongodb.org/dl/win32/x86_64
选择“mongodb-win32-x86_64-v3.4-latest-signed.msi”这个安装包。
下载后，按照Windows应用程序的通用安装步骤，一路点“下一步”，直到完成。
默认安装在：C:\Program Files\MongoDB\Server\3.4。
在这个目录下新建两个目录：data和log，分别用于存放数据文件和日志文件。
在这个目录下新建一个文件，名为：mongo.conf，它是数据库的配置文件，内容如下：
dbpath=C:\Program Files\MongoDB\Server\3.4\data #存放数据库文件的目录 logpath=C:\Program Files\MongoDB\Server\3.4\log\mongo.log #日志文件 logappend=true #错误日志采用追加模式 journal=true #启用日志 port=27017 #端口号，27017是MongoDB的默认监听端口 quiet=true #可以过滤掉一些无用的日志信息最终的目录结构如下：
bin目录中有两个常用的exe文件，一个是mongod，它是数据库服务器程序，，另一个是mongo，它是客户端程序。这一点很像MySQL数据库，MySQL也有mysqld和mysql。
最后，我们将MongoDB安装为Windows服务，以便开机启动。
将MongoDB的bin目录加入PATH环境变量 在命令窗口中输入：mongod --config "C:\Program Files\MongoDB\Server\3.4\mongo.conf" --install --serviceName "MongoDB" 输入如下命令启动服务：net start mongodb至此，MongoDB就安装成了Windows服务，以后开机即可自动运行MongoDB数据库服务器。
mongo.exe是一个命令行的客户端，使用起来不太方便，这里推荐一个图形界面管理工具：adminMongo。
在github上可以找到这个项目：https://github.com/mrvautin/adminMongo
使用方法：
下载，解压 打开命令窗口，进入解压目录 npm install npm start然后，就可以通过如下网址来管理MongoDB了：http://127.0.0.1:1234
进入管理界面，首先要求创建一个数据库连接，这时输入连接名称（mongodb，可以任意）和连接字符串（mongodb://127.0.0.1:27017），如下图所示：
点击“Connect”，就可以看到数据库的内容了：
可以看到饿了么（elm）应用有多个表，打开其中一个表：
可以直观地感觉到，MongoDB的数据存储格式很像常用的JSON格式。
好了，这一讲我们下载了要学习的Vue项目，并且把后台的数据库也搭建好了，下一讲，将详细分析后端项目是如何操作MongoDB数据库的。
