最近整理了一下自己在用的react框架,主要涉及到的技术有react react-router redux  Es6 webpack less ant-design等技术,可用于快速开发后台类系统。

主要实现功能:

  • webpack生成首页
  • 热更新
  • 路由分割
  • 打包压缩
  • 报错信息指向源文件
  • Es6装换
  • less转换
  • 封装富文本

开发步骤:

  • 在src/containers 文件下添加页面
  • 在src/router.js 文件里添加路由
  • 在src/actions 文件下添加页面对应的.js 文件(主要作用是发起dispatch,改变redux)
  • 在src/reducers 文件下添加页面对应的.js 文件(设置redux初始值,并根据不同情况进行相应改变)
  • 在src/reducers/index.js 文件将现有的reduces合并为一个大的状态机

待改进问题

  • 打包代码压缩
  • webpack添加环境变量,为快发环境和线上环境定制深度定制不同打包逻辑
  • 登录页面加入打包,不单独列出
  • 与后端进行接口标准制定,并统一改进接口反馈(包括成功提示,失败提示,404处理,错误处理等)

设想

  • 构建自己的node.js服务器
  • 进行服务器端渲染

使用:

1 。从github上clone代码,代码见 我的github,希望搭建能帮我点个星

2. 下载我编写的npm包,可用命令行直接生成基础框架,npm包代码见我的github,

$ npm install -g yq-fontend-cli
$ yqbegin init <project-name>

react后台开发框架搭建的更多相关文章

  1. 使用React全家桶搭建一个后台管理系统

    引子 学生时代为了掌握某个知识点会不断地做习题,做总结,步入岗位之后何尝不是一样呢?做业务就如同做习题,如果‘课后’适当地进行总结,必然更快地提升自己的水平. 由于公司采用的react+node的技术 ...

  2. 从0到1用react+antd+redux搭建一个开箱即用的企业级管理后台系列(基础篇)

    背景 ​ 最近因为要做一个新的管理后台项目,新公司大部分是用vue写的,技术栈这块也是想切到react上面来,所以,这次从0到1重新搭建一个react项目架子,需要考虑的东西的很多,包括目录结构.代码 ...

  3. 整合springboot(app后台框架搭建四)

    springboot可以说是为了适用SOA服务出现,一方面,极大的简便了配置,加速了开发速度:第二方面,也是一个嵌入式的web服务,通过jar包运行就是一个web服务: 还有提供了很多metric,i ...

  4. Spring4.X + spring MVC + Mybatis3 零配置应用开发框架搭建详解(1) - 基本介绍

    Spring4.X + spring MVC + Mybatis3 零配置应用开发框架搭建详解(1) - 基本介绍 spring集成 mybatis Spring4.x零配置框架搭建 两年前一直在做后 ...

  5. Android二手交易平台,dagger2+mvp+Bmob后台云搭建

    二手交易平台 我的毕业设计项目安卓源码,二手交易平台,dagger2+mvp+Bmob后台云搭建,集成了百度地图,友盟三方登录等 系统架构 Dagger2+MVP分层,完成了一次正常的retrofit ...

  6. springmvc跨域+token验证(app后台框架搭建二)

    这是app后台框架搭建的第二课,主要针对app应用是跨域的运用,讲解怎么配置跨域服务:其次讲解怎么进行token验证,通过拦截器设置token验证和把token设置到http报文中.主要有如下:   ...

  7. Win7_Ultimate + VS2010 + openGL_MFC单文档应用开发框架搭建步骤

    Win7_Ultimate + VS2010 + openGL单文档应用开发框架搭建步骤 上一个配置是基于OpenGL的开发工具配置的,下面就是基于Vs2010的MFC单文档应用开发. 通过网上查找资 ...

  8. JAVAEE——宜立方商城01:电商行业的背景、商城系统架构、后台工程搭建、SSM框架整合

    1. 学习计划 第一天: 1.电商行业的背景. 2.宜立方商城的系统架构 a) 功能介绍 b) 架构讲解 3.工程搭建-后台工程 a) 使用maven搭建工程 b) 使用maven的tomcat插件启 ...

  9. ONVIF学习-ONVIF开发框架搭建(C++)

    第一步.下载gsoap 从gsoap官网(http://www.genivia.com/products.html#notice)下载最新版gsoap(博主用的是gsoap_2.8.45).gsoap ...

随机推荐

  1. C++第三篇--程序结构

    C++第三篇--程序结构 1. 初识程序结构 将类中的成员函数全部放在类外实现,类中只负责声明该函数 person.cpp #include <stdio.h> class Person{ ...

  2. org.w3c.dom.Element 缺少 setTextContent 步骤

    org.w3c.dom.Element 缺少 setTextContent 方法 今天将项目环境由jdk5改为jdk6,eclipse重新编译工程后,却突然出现org.w3c.dom.Element没 ...

  3. 内核对象kobject和sysfs(2)——kref分析

    内核对象kobject和sysfs(2)--kref分析 在介绍ref之前,先贴上kref的结构: struct kref { atomic_t refcount; }; 可以看到,kref只是包含一 ...

  4. Eclipse详细设置护眼背景色和字体颜色并导出

    Eclipse详细设置护眼背景色和字体颜色并导出 Eclipse是一款码农们喜闻乐见的集成开发平台,但是其默认的主题和惨白的背景色实在是太刺激眼球了.下面,将给大家详细介绍如何设置成护眼主题的方法,也 ...

  5. [IB]PeopleSoft异步详细信息中状态“已完成”但订阅合同状态“新建”问题

    最近遇到一个IB异步程序状态不一致问题,异步详细信息中上面的状态是“DONE”但是订阅合同中还是“新建”状态.在域状态中清除域状态也不管用. 重启app server也不好使.最后执行了appmsgp ...

  6. Pandas: 如何将一列中的文本拆分为多行? | Python

    Pandas: 如何将一列中的文本拆分为多行? 在数据处理过程中,经常会遇到以下类型的数据: 在同一列中,本该分别填入多行中的数据,被填在一行里了,然而在分析的时候,需要拆分成为多行. 在上图中,列名 ...

  7. vue错误和解决方法

    1.Error in render function: "TypeError: Cannot read property 'matched' of undefined 原因:之前不知道,在引 ...

  8. 【整理】01. Fiddler 杂记

    抓手机包步骤: Tools -- Fiddler Options -- Connections (默认)Fiddler listens on port:8888 (勾选)Allow remote co ...

  9. 基于NFS实现WordPress

    实验内容: (1)主机IP nfs server IP :192.168.29.120 nfs server IP: 192.168.29.110 (2)要求 nfs server共享/data/we ...

  10. ios 监听TextField中内容

    @property (weak, nonatomic) IBOutlet UITextField *UserID; @property (weak, nonatomic) IBOutlet UITex ...