React项目开发经验汇总

博客来源 小寒的博客

 

定义好全局配置信息

环境变量不要提取出来，配置信息提取出来

 

UI样式变量

定义好变量的做用不用多说

 

 

样式库建设

工具样式，复用性强的样式，这些class成为会是真个网站样式的底层，将是很重要的一部分

 

工具函数

这个也不用多说，超级重要的，平常定义一些好的工具函数，说不定哪天就能够产生一个上万star的工具库了

 

功能封装

包括上传文件，支付，登陆，数据返回处理 等等一系列的操做，其实每次都是一个一样的流程

不一样的网站根据复用性的业务不一样

面对这种问题，复制粘贴代码确定是不明智的，咱们须要维护一系列的功能复用性的工具

 

静态文件和icon

管理静态文件老是比较麻烦的，最可怕的就是忽然的要求复用某个网页里专属的文件，同时cdn建设也很重要，那么这些公共资源如何管理也是一件很重要的事情

尤为是icon的建设

 

 

---------------------------分界线-------------------------

 

 

 

以上是常见的复用功能的作法

如下是react项目开发须要注意的地方

UI库建设

UI库建设被放倒第一位的缘由也是理所固然的

UI库建设可能在短时间下降了开发效率，提升了维护成本，但长期来看，绝对确定必定以及百分之百是值得的，建设UI库能够有让人意想不到的效果

更是为了保证换即便设计师也能够该组件库，整个网站风格就变了，还有包括间接性的接入第三方UI库，不要直接接入，不然没准哪一天就不用了

说不许哪天就能够产生一个上万star的UI库了

 

数据层

和后台交互是一件很重要的事情，网页渲染的数据来源通常出了配置信息之外，就是后端请求的数据了

那么怎么去管理这些数据呢

 

我在项目中的作法是经过mobx创建一个数据层，组件内是彻底不能够请求数据的，只会简单的处理数据，而后映射数据到页面上，这样全部的数据操做便会变得清晰起来，很便于维护

 

 

多项目并行开发

多项目并行并非启动多个项目，而是在一个大项目下，根据耦合状况拆分红多个小项目，小项目之间须要有耦合，包括环境变量，UI组件，工具函数，封装好的功能等。盲目的拆开项目去纯粹的解耦是一件很做死的事情

一个大的项目可能会须要并行不少个小项目，好比说我正在作的建站项目，就会并行代理商，自定义网站的后台，网站前台，编辑器，预览，并行多个项目的时候到底拆不拆老是一个很头大的事情

 

 

后端渲染和前端渲染

前端渲染的SEO是比较麻烦的事情，next服务端渲染多是一个不错的选择，很好的解决了浏览内容类页面的加载问题和seo问题

可是编辑器和后台页面自己却不须要什么seo，因此须要前端渲染和后端渲染同时作。

 

 

先后端同构

若是后端是node的话，那么同构是一件颇有颇有意义的事情

 

总结

同时作好这么多事情看似很麻烦，只要从基本的开始遵循也很快就会彻底适应，

其实也不为其余的，为的是不让本身太辛苦的维护项目

为的是换一个设计师的时候 他不会太累

为的是和后端愉快的沟通

为的是本身对本身的东西内心有数