最近整理了一下自己在用的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. 【转载】CANoe 入门 Step by step系列(三)简单例子的剖析

    来源:http://www.cnblogs.com/dongdonghuihui/archive/2012/09/26/2704623.html 最好的学习方式是什么?模仿.有人会问,那不是山寨么?但 ...

  2. 关于线程和junit注入失败的问题

    问题: 在使用spring的时候,通常会使用注释@Autowired或@Resource注入java Bean; 但是在碰到线程类和测试类的时候就不支持注入方式了. 定义: 线程类:继承thread或 ...

  3. C#开发模式——单例模式

    一.单例模式简介 单例模式是为保证一个对象,在程序运行的任何时刻只有一个实例存在,我们把这种实现方式称之为“单例模式”. 二.单例模式的核心 单例类只有一个实例存在 单例类提供一个全局访问点 单例类通 ...

  4. (转)log4j(六)——log4j.properties简单配置样例说明

    一:测试环境与log4j(一)——为什么要使用log4j?一样,这里不再重述 1 老规矩,先来个栗子,然后再聊聊感受 (1)使用配文件的方式,是不是感觉非常的清爽,如果不在程序中读取配置文件就更加的清 ...

  5. 再起航,我的学习笔记之JavaScript设计模式02

    我的学习笔记是根据我的学习情况来定期更新的,预计2-3天更新一章,主要是给大家分享一下,我所学到的知识,如果有什么错误请在评论中指点出来,我一定虚心接受,那么废话不多说开始我们今天的学习分享吧! 我们 ...

  6. JAVA二维数组的复制

    JAVA二维数组的复制 笔者今天做一道ccf题目时,遇到要将二维数组拷贝复制时,没有用常规的那种一个一个数的复制,用的是System.arraycopy()来进行复制,下面介绍这个函数的一些注意点: ...

  7. 在同一个sql语句中,统计不同条件的Count数量

    前几天帮同事优化了个SQL,原写法使用多个子查询这里不再重现了,大家都遇到过这样一种情况,在项目后期的维护中, 修改别人的SQL代码,超过30行的语句,多层子查询,读起来很坑,时间久的项目伴随着人员的 ...

  8. Redis-key的设计技巧

    把表名转换为key前缀, 比如: tag: 第二段放置用于区分key的字段--对应mysql中的主键的列名 第三段放置主键值 第三段写列名 用户表user, 转换为redis的key-value存储 ...

  9. 红帽 Red Hat Linux相关产品iso镜像下载【百度云】(转载)

    不为什么,就为了方便搜索,特把红帽EL 5.EL6.EL7 的各版本整理一下,共享出来.正式发布 6.9 :RedHat Enterprise Server 6.9 for x86_64:rhel-s ...

  10. python教程6-4:算数

    参照练习2-9和练习5-3.将测试得分放到一个列表中,并且可以计算出平均分. python35 SuanShu_6_4.py SuanShu_6_4.py #coding=utf-8 def ave( ...