React項目開發經驗彙總

博客來源 小寒的博客

 

定義好全局配置信息

環境變量不要提取出來，配置信息提取出來

 

UI樣式變量

定義好變量的做用不用多說

 

 

樣式庫建設

工具樣式，複用性強的樣式，這些class成爲會是真個網站樣式的底層，將是很重要的一部分

 

工具函數

這個也不用多說，超級重要的，平常定義一些好的工具函數，說不定哪天就能夠產生一個上萬star的工具庫了

 

功能封裝

包括上傳文件，支付，登陸，數據返回處理 等等一系列的操做，其實每次都是一個一樣的流程

不一樣的網站根據複用性的業務不一樣

面對這種問題，複製粘貼代碼確定是不明智的，咱們須要維護一系列的功能複用性的工具

 

靜態文件和icon

管理靜態文件老是比較麻煩的，最可怕的就是忽然的要求複用某個網頁裏專屬的文件，同時cdn建設也很重要，那麼這些公共資源如何管理也是一件很重要的事情

尤爲是icon的建設

 

 

---------------------------分界線-------------------------

 

 

 

以上是常見的複用功能的作法

如下是react項目開發須要注意的地方

UI庫建設

UI庫建設被放倒第一位的緣由也是理所固然的

UI庫建設可能在短時間下降了開發效率，提升了維護成本，但長期來看，絕對確定必定以及百分之百是值得的，建設UI庫能夠有讓人意想不到的效果

更是爲了保證換即便設計師也能夠該組件庫，整個網站風格就變了，還有包括間接性的接入第三方UI庫，不要直接接入，不然沒準哪一天就不用了

說不許哪天就能夠產生一個上萬star的UI庫了

 

數據層

和後臺交互是一件很重要的事情，網頁渲染的數據來源通常出了配置信息之外，就是後端請求的數據了

那麼怎麼去管理這些數據呢

 

我在項目中的作法是經過mobx創建一個數據層，組件內是徹底不能夠請求數據的，只會簡單的處理數據，而後映射數據到頁面上，這樣全部的數據操做便會變得清晰起來，很便於維護

 

 

多項目並行開發

多項目並行並非啓動多個項目，而是在一個大項目下，根據耦合狀況拆分紅多個小項目，小項目之間須要有耦合，包括環境變量，UI組件，工具函數，封裝好的功能等。盲目的拆開項目去純粹的解耦是一件很做死的事情

一個大的項目可能會須要並行不少個小項目，好比說我正在作的建站項目，就會並行代理商，自定義網站的後臺，網站前臺，編輯器，預覽，並行多個項目的時候到底拆不拆老是一個很頭大的事情

 

 

後端渲染和前端渲染

前端渲染的SEO是比較麻煩的事情，next服務端渲染多是一個不錯的選擇，很好的解決了瀏覽內容類頁面的加載問題和seo問題

可是編輯器和後臺頁面自己卻不須要什麼seo，因此須要前端渲染和後端渲染同時作。

 

 

先後端同構

若是後端是node的話，那麼同構是一件頗有頗有意義的事情

 

總結

同時作好這麼多事情看似很麻煩，只要從基本的開始遵循也很快就會徹底適應，

其實也不爲其餘的，爲的是不讓本身太辛苦的維護項目

爲的是換一個設計師的時候 他不會太累

爲的是和後端愉快的溝通

爲的是本身對本身的東西內心有數