大家好，我是林三心，用最通俗易懂的話講最難的知識點是我的座右銘，基礎(chǔ)是進(jìn)階的前提是我的初心~

很多人都來問我：我平時寫的東西都是后臺管理系統(tǒng)，根本就沒啥亮點的東西，我也沒啥進(jìn)步，我該咋辦呢？

后臺管理不丟人

其實據(jù)我了解，大部分前端在公司其實就是做后臺管理系統(tǒng)，偶爾做做移動端，那么大家都是做后臺管理，你要怎么比別人強(qiáng)呢？其實就是一個點：你如何把后臺管理系統(tǒng)做得更好

其實我也做過一段時間的后臺管理系統(tǒng)，我總結(jié)了幾點我的心得，分享給大家~

多封裝組件

封裝是一個很普遍的操作，但是卻很少人去做好這件事，我現(xiàn)在做后臺管理系統(tǒng)的話我會做到極致的封裝，只要是一個東西有兩處地方復(fù)用到了，我肯定會抽取封裝起來，在這個過程中，我也學(xué)到了很多 Vue3 的 API，也發(fā)現(xiàn)很多封裝組件的技巧，比如

• shallowRef 節(jié)省性能
• computed 的 getter 和 setter
• 組件 props 類型的拓展
• 組件封裝的更加方便使用
• 模板的極致復(fù)用
• 命令式使用彈窗

多封裝 Hooks

對于一些業(yè)務(wù)性的邏輯代碼，或者共用的邏輯代碼，都要有抽取成 Hooks 的意識，這有利于于后續(xù)代碼的可維護(hù)性，并且抽取共用的 Hooks，有利于代碼可復(fù)用性，提高代碼開發(fā)效率，鍛煉你的邏輯封裝能力，我最近封裝了很多 Hooks，比如

• useClickoutside：點擊目標(biāo)區(qū)域以外觸發(fā)事件
• useCommandComponent：命令式使用組件
• createModal：命令式使用彈窗
• useTemplate：本組件復(fù)用彈窗
• useGlobalState：局部狀態(tài)管理
• useVirtualList：虛擬滾動
• 等等。。。

多考慮邊界條件

我發(fā)現(xiàn)很多人在做后臺管理也好，做其他的東西也好，其實總是會考慮得沒那么周全，其中一點就是，總是不考慮邊界條件，不去考慮兜底，比如：

• 組件的參數(shù)兜底檢驗補(bǔ)全
• hooks的參數(shù)兜底補(bǔ)全
• 接口請求數(shù)據(jù)出錯、接口報錯的兜底
• 某些代碼記得加 try catch 進(jìn)行兜底
• 代碼執(zhí)行先后順序問題，怎么去控制按照順序去執(zhí)行

多想想產(chǎn)品優(yōu)化

其實優(yōu)化不止是代碼優(yōu)化，也有產(chǎn)品優(yōu)化，有時候其實產(chǎn)品經(jīng)理想出來的點子，也是不合理的，這個時候你可以去提出自己的見解，讓整個產(chǎn)品更好，當(dāng)然代碼的優(yōu)化也是必須做的，比如：

• 防抖節(jié)流
• 長列表的虛擬滾動
• 大文件的分片上傳
• 多請求時的控制并發(fā)
• 使用合適的 API ，節(jié)省性能
• 多使用設(shè)計模式，提高代碼健壯性

多想想怎么提高效率

你要知道，后臺管理系統(tǒng)其實業(yè)務(wù)難度是有限的，但是其實你可以不要局限于項目，而是要經(jīng)常去想想：

• 你能怎么在項目中去讓自己進(jìn)步
• 你要怎么樣去提升自己的開發(fā)效率
• 你要怎么樣去提升整個團(tuán)隊的開發(fā)效率

就比如我，我在開發(fā)后臺管理系統(tǒng)的時候，我會做這些事：

• 發(fā)現(xiàn)某些別人不合理的開發(fā)習(xí)慣，可以記下來，反饋給團(tuán)隊
• 為了團(tuán)隊開發(fā)規(guī)范，開發(fā)一些小工具，來助力團(tuán)隊的規(guī)范
• 為了團(tuán)隊成員開發(fā)的效率，開發(fā)一些小工具，幫他們提升開發(fā)效率
• 多為團(tuán)隊的組件庫工具庫貢獻(xiàn)，這樣也能提升整個團(tuán)隊的開發(fā)效率
• 主動去封裝一些比較難的組件，提升團(tuán)隊開發(fā)效率，使自己進(jìn)步

多搞配置化

我記得我一年前去面試一個高級前端工程師的崗位時，面試官就問我一個問題：假如你開發(fā)一個后臺管理系統(tǒng)，你怎么讓你的團(tuán)隊成員更輕松去開發(fā)呢？ 我當(dāng)時回答說：制定規(guī)范！ 然后面試官我沒體會到他真正的意思

現(xiàn)在我算是領(lǐng)會到了，面試官的意思是：你要怎么開發(fā)一個后臺管理系統(tǒng)，讓你的組員無腦地開發(fā)

那其實我覺得，把一些事情做成配置化，這樣才能讓別人開發(fā)的時候，更加方便、更加無腦~

其實后臺管理無非就幾個東西：

• 表單
• 表格
• 圖表

那么可以做相對應(yīng)的配置器，讓其他人只需要傳入配置，就可以生成想要的頁面效果，比如：

• 表單配置器
• 表格配置器
• 圖表配置器

多看看別人怎么做的

github 上有很多很出名的后臺管理系統(tǒng)，大家可以去看看人家是怎么寫的，為啥你寫的像入門級，人家寫的像大佬級別，可以多看看多學(xué)學(xué)，我推薦給你們vben-admin，我從這個后臺管理項目中真的學(xué)到好多東西！