react后台开发框架搭建
最近整理了一下自己在用的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后台开发框架搭建的更多相关文章
- 使用React全家桶搭建一个后台管理系统
引子 学生时代为了掌握某个知识点会不断地做习题,做总结,步入岗位之后何尝不是一样呢?做业务就如同做习题,如果‘课后’适当地进行总结,必然更快地提升自己的水平. 由于公司采用的react+node的技术 ...
- 从0到1用react+antd+redux搭建一个开箱即用的企业级管理后台系列(基础篇)
背景 最近因为要做一个新的管理后台项目,新公司大部分是用vue写的,技术栈这块也是想切到react上面来,所以,这次从0到1重新搭建一个react项目架子,需要考虑的东西的很多,包括目录结构.代码 ...
- 整合springboot(app后台框架搭建四)
springboot可以说是为了适用SOA服务出现,一方面,极大的简便了配置,加速了开发速度:第二方面,也是一个嵌入式的web服务,通过jar包运行就是一个web服务: 还有提供了很多metric,i ...
- Spring4.X + spring MVC + Mybatis3 零配置应用开发框架搭建详解(1) - 基本介绍
Spring4.X + spring MVC + Mybatis3 零配置应用开发框架搭建详解(1) - 基本介绍 spring集成 mybatis Spring4.x零配置框架搭建 两年前一直在做后 ...
- Android二手交易平台,dagger2+mvp+Bmob后台云搭建
二手交易平台 我的毕业设计项目安卓源码,二手交易平台,dagger2+mvp+Bmob后台云搭建,集成了百度地图,友盟三方登录等 系统架构 Dagger2+MVP分层,完成了一次正常的retrofit ...
- springmvc跨域+token验证(app后台框架搭建二)
这是app后台框架搭建的第二课,主要针对app应用是跨域的运用,讲解怎么配置跨域服务:其次讲解怎么进行token验证,通过拦截器设置token验证和把token设置到http报文中.主要有如下: ...
- Win7_Ultimate + VS2010 + openGL_MFC单文档应用开发框架搭建步骤
Win7_Ultimate + VS2010 + openGL单文档应用开发框架搭建步骤 上一个配置是基于OpenGL的开发工具配置的,下面就是基于Vs2010的MFC单文档应用开发. 通过网上查找资 ...
- JAVAEE——宜立方商城01:电商行业的背景、商城系统架构、后台工程搭建、SSM框架整合
1. 学习计划 第一天: 1.电商行业的背景. 2.宜立方商城的系统架构 a) 功能介绍 b) 架构讲解 3.工程搭建-后台工程 a) 使用maven搭建工程 b) 使用maven的tomcat插件启 ...
- ONVIF学习-ONVIF开发框架搭建(C++)
第一步.下载gsoap 从gsoap官网(http://www.genivia.com/products.html#notice)下载最新版gsoap(博主用的是gsoap_2.8.45).gsoap ...
随机推荐
- 计算 x y 的最近值
计算xy的最近值. 代码如下: package Day05; import java.util.Arrays; public class FindNearestPoints { public stat ...
- ARM开发(1) 基于STM32的LED跑马灯
一 跑马灯原理: 1.1 本实验实现2个led的跑马灯效果,即2个led交替闪烁. 1.2 实验思路:根据电路图原理,给led相关引脚赋予高低电平,实现电路的导通,使led灯发光. 1.3 开发 ...
- TensorFlow conv2d原理及实践
tf.nn.conv2d(input, filter, strides, padding, use_cudnn_on_gpu=None, data_format=None, name=None) 官方 ...
- python2.7 + selenium3.4.3浏览器的选择
大家都知道,selenium2对火狐浏览器兼容性比较好,和谷歌和IE相比,好处是无需安装相应的driver.exe来支持启动浏览器,但是缺点是最高支持火狐47版本. 现在selenium3出来了,是不 ...
- nopcommerce 开源商城
http://www.nopchina.net/ 中文网 http://www.nopcommerce.com/downloads.aspx 源码下载 如果要在数据库中添加一个新的数据表,需要按 ...
- angularjs 选项卡tab切换(移动端用户订单状态)
<!--头部导航tabs切换--> <div class="tabs-striped tabs-top tabs-background-positive tabs-colo ...
- 一次浴火重生的MySQL优化(EXPLAIN命令详解)
一直对SQL优化的技能心存无限的向往,之前面试的时候有很多面试官都会来一句,你会优化吗?我说我不太会,这时可能很多人就会有点儿说法了,比如会说不要使用通配符*去检索表.给常常使用的列建立索引.还有创建 ...
- web正则表达式与示例
正则表达式应用——实例应用: 1.验证用户名和密码:("^[a-zA-Z]\w{5,15}$")正确格式:"[A-Z][a-z]_[0-9]"组成,并且第一个字 ...
- 51nod 1008 N的阶乘 mod P
输入N和P(P为质数),求N! Mod P = ? (Mod 就是求模 %) 例如:n = 10, P = 11,10! = 3628800 3628800 % 11 = 10 Input 两 ...
- svn本地目录结构for window
演示内容: 使用svn目录结构来进行备份正式版和修复版本,最终合并修复版本.主干上的版本. 使用工具: visualSVN server 服务器软件工具 TortoiseSVN客户端工具 1.服务器的 ...