create-react-app相关配置

1.命令行安装create-react-app

全局安装：yarn global add create-react-app

2.创建创建一个空项目

create-react-app appname ，这里注意应用名字不能包含大写字母

3.进入项目，会发现项目文件很少，这是为什么呢，因为默认会不显示细致的目录文件，运行以下命令可以打开隐藏的部分，便于把控项目

yarn run eject，现在就可以进行开发了，现在有一个需求是利用nodejs链接mongodb数据库，express做后台框架，进行前后端开发，需要搭建相应环境，首先去mongodb官网，下载并安装mongodb

4.安装express依赖，yarn add express，等待安装完成

新建server.js，利用express创建一个htttp服务，实现简单路由控制

var express = require('express');
var app = express();
app.get('/',function(req,res){
    res.send('<h1>hello world</h1>')
})
app.listen('9999',function(err){
    if(!err){
        console.log('server has been start at  port 9999')
    }else{
        console.log(err)
    }
})

这里由于express暂时还不支持import写法，所以就使用es5的写法，访问127.0.0.1:9999/，即可看到hello world，http服务开启成功，

5.链接mongodb数据库，实现数据的增删改查

这里需要安装一个依赖mongoose，来实现nodejs和mongodb的链接，yarn add mongoose，依赖安装成功之后，引入mongoose模块，链接nodejs和mongodb，更改的server.js代码如下

const express = require('express');
const mongoose = require('mongoose');
mongoose.connect('mongodb://127.0.0.1:27017/immoc');
mongoose.connection.on('connected',function(err){
    if(!err){
        console.log('mongodb connected')
    }else{
        console.log(err)
    }
})
const app = express();
app.get('/',function(req,res){
    res.send('<h1>hello world</h1>')
})
app.listen('9999',function(err){
    if(!err){
        console.log('server has been start at  port 9999')
    }else{
        console.log(err)
    }
})

控台输出正确，连接正常

6.链接一个集合（数据库的概念），并定义文档模型（表的概念）model，接着定义数据结构（字段）Schema

const express = require('express');
const mongoose = require('mongoose');
mongoose.connect('mongodb://127.0.0.1:27017/immoc');
mongoose.connection.on('connected',function(err){
    if(!err){
        console.log('mongodb connected')
    }else{
        console.log(err)
    }
})

const User =  mongoose.model('user',new mongoose.Schema({
    name : {type:String,require:true},
    age : {type:Number,require:true}
}))
User.create({
    name:'coldbreath',
    age:18
},function(err,doc){
    if(!err){
        console.log(doc)
    }else{
        console.log(err)
    }
})

const app = express();
app.get('/',function(req,res){
    res.send('<h1>hello world</h1>')
})
app.get('/data',function(req,res){
    User.find({},function(err,doc){
        if(!err){
            res.json(doc)
        }else{
            console.log(err)
        }
    })
})
app.listen('9999',function(err){
    if(!err){
        console.log('server has been start at  port 9999')
    }else{
        console.log(err)
    }
})

7.对数据库进行操作，增删改查，这里就不多加赘述，可以点击下这里，用法很灵活，多样化