React全家桶项目

开篇

利用业余时间，作了个React项目，算是成品吧，比较简单，还有不少瑕疵。目录结构至关简单。没有数据库，大家运行不起来。想运行起来的话，把express调用数据库的部分全删掉，写死数据。

ak47

这个集成了React全家桶，能够直接运行，也能够直接在生产环境使用。 github.com/xuya227939/…

源码

github.com/bbww/sight.…

预览地址

最好用谷歌游览器进行体验，其余游览器没测。 downfuture.com

技术栈

react + redux + saga + router + es6 + node.js + webpack + mysql

功能

• 简单的登陆、注册、修改密码
• 用户能够点赞和收藏
• 我的中心能够上传头像和图片(图片最多上传三张)，暂时未压缩。
• 我的中心能够修改密码和登出

目录结构

经常使用方法

fetch

封装了fetch请求，统一报错。

function request({ method, options, callback }) {
  options.mode = "cors";
  if(!options.sign) {
    options.headers = {
      'Content-Type': 'application/json'
    };
    if(!(options.method === 'GET' || options.method === 'DELETE')) {
      options.body = JSON.stringify(options.body);
    }
  }
  options.credentials = 'include';
  return fetch(getApi + method, options )
    .then(checkStatus)
    .then(parseJSON)
    .then((data) => {
      return data;
    }).catch((err) => {
      message.config({
        top: 24,
        duration: 1,
        maxCount: 3,
      });
      message.error('发送fetch失败' + JSON.stringify(err) + ',方法名：' + method);
    });
复制代码

接口符合restFul设计

util.js

工具类js

router.js

全部的路由配置都在这个js中

结语

建站步骤，在个人blog中分享出来了。欢迎一块儿讨论，只介绍实现，不阐述相关代码的含义。 github.com/xuya227939/…