第一章 后端express 搭建
正文
开发环境
本地安装mongoDB、nodejs、react 脚手架
node.js 安装及配置
mongoDb 安装及配置
参考文档：https://www.cnblogs.com/progor/p/8595661.html?utm_source=tuicool&utm_medium=referral
一、服务器搭建（前端小白搭建后端项目，勿喷）
express+mongoose 搭建后台项目
1，全局安装 express-generator
npm install express -sage -g
npm install express-generator --save -g
express 是nodejs 的一个web 框架，使用express 能够更便捷的使用nodejs. express-generator 是express应用生成器，相当于express的骨架，进入一个web项目中后，使用 “express 项目名” 命令，能够快速构建应用的目录结构
2，创建项目
// express myAppName
express bolg-server
3, 进入项目，初始化依赖，启动项目
npm install npm start
项目搭建成功！！
4， 项目文件结构
bin: 启动文件， 默认启动命令： npm start public: 存放项目的静态文件， routes: 项目路由信息，控制地址路由 views: 视图文件，模板文件.jade ，相当于 html app.js 入口文件（主文件） package.json 依赖的模块列表
5，mongoose 连接数据库，操作数据库
通过express 搭建完项目后，将 连接数据库 放在routes.js 文件中。
const mongoose = require('mongoose');
// mongodb://user:[email protected]:27017/dbname
// dbname-必选项 user/password 是可选的
const url = 'mongodb://127.0.0.1:27017/admin'; // 本地数据库地址
mongoose.connect(url);
// connection readyStateconst;
db = mongoose.connection;
db.on('connected', () => {
console.log('MongoDB connected success '.green);
});
db.on('errror', () => {
console.error('MongoDB connected fail');
});
db.on('disconnected', () => {
console.log('MongoDB connected to disconnected');
});
运行的时候，提示
(node:2896) DeprecationWarning: current URL string parser is deprecated, and will be removed in a future version. To use the new parser, pass option { useNewUrlParser: true } to MongoClient.connect.
在网上找到了解决方案，但是暂时不知道什么原因。
只需要添加 { useNewUrlParser:true }
mongoose.connect(url, { useNewUrlParser: true });
第二章 前端框架搭建
1, 搭建 react+Ant Design项目
新建一个空的文件夹作为项目目录，并在目录下执行：
yarn create umi
or
npm create umi
选择 ant-design-pro：
Select the boilerplate type (Use arrow keys) ❯ ant-design-pro - Create project with an layout-only ant-design-pro boilerplate, use together with umi block. app - Create project with a simple boilerplate, support typescript. block - Create a umi block. library - Create a library with umi. plugin - Create a umi plugin.
选择对应的语言，不过相对来说TypeScript 感觉有点乱
Which language do you want to use? (Use arrow keys) > TypeScript JavaScript
npm install npm start
启动完成后会自动打开浏览器访问 http://localhost:8000，成功了。
2，整理项目