Reactjs、redux的从入门到放弃、删库跑路示例

#1
最近看到很多react相关的问题跟讨论,越来越多的小伙伴喜欢这个框架了,

同时也在看到了有些入门的小伙伴遇到了各种各样的问题,本人也是react框架使用都一枚,

公司是腾讯、阿里、平安三巨头合资的一家公司,分别上海、深圳、杭州、北京、广州等多个分部,前端人员也有近100人,

框架也在统一往react靠齐,本人也在实际项目中应用了蛮长一段时间,跟社区的很多新伙伴一样,入坑的过程中,遇到过各种各样的问题,

这里就不一一详细吐槽了,吐下去,你们估计要骂我疯了,重点就讲讲我们项目的一些整个框架结构吧,

因为很多小伙伴在入门后,上手做项目时,都会苦脑于项目结构如何构建,便于后期维护、项目迭代等等的问题;

地址:github项目示例地址 ,如果觉得不错,对你有帮助记得帮 转发 和 star哦,感谢您的支持。

项目结构示例:




可以扫码预览哦

上面是项目的大体结构,有兴趣的小伙伴,可以进入项目详细看看,

1、首先我们会分不同的环境,写不同的配置文件,便于结构清晰,维护修改;

2、所有的项目组件都放在pages里,pages里再按项目模块去划分项目结构,actions、reducers内也是如何,共用的组件放在components内,

路由文件也是按项目模块来划分,不要全部放在一个文件内,找起来特别不方便,也不容易维护,

4、后面统一引入在一个入口文件内,对外输出,

5、实现了按需加载,共用代码提取,

6、该项目主要用到了 react、react-router、redux、redux-thunk、es6、babel、webpack、node、express等

7、特别说明,window.devToolsExtension是redux的一个调试工具,在chrome浏览器应用商店搜索redux后按装,开发环境就能看到redux状态的每一步变化了,便于调试提高开发效率;

8、当然还有其他的,就不一一说明了,可进入项目细看,

地址:github项目示例地址 ,如果觉得不错,对你有帮助记得帮 转发 和 star哦,感谢您的支持。

更多示例地址:想了解更多吗?点我吧

文字缩进 4 格