前端是一種技術(shù)問題較少、工程問題較多的軟件開發(fā)領(lǐng)域,
一切能提升前端開發(fā)效率、提高前端應(yīng)用質(zhì)量的手段和工具都是前端工程化。
前端越來越復(fù)雜,設(shè)計的問題和環(huán)節(jié)也越來越多,
不采用工程化管理,就無法很好的實現(xiàn)團(tuán)隊協(xié)同和降低復(fù)雜性。
所以在一個成熟的開發(fā)團(tuán)隊里面,前端工程化是非常必要且需要不斷努力的持久化進(jìn)程。
1.關(guān)注點
高性能、穩(wěn)定性、可用性、可維護(hù)性、可訪問性
2.術(shù)
1.模塊化
JS的模塊化
CSS的模塊化
2.組件化
UI組件化(容器、展示、高階組件、渲染回調(diào))
3.規(guī)范化
目錄結(jié)構(gòu)的制定
編碼規(guī)范
前后端接口規(guī)范
文檔規(guī)范
組件管理
Git分支管理
Commit描述規(guī)范
定期CodeReview
視覺圖標(biāo)規(guī)范
4.自動化
圖標(biāo)合并
持續(xù)集成
自動化構(gòu)建
自動化部署
自動化測試
3.參考文章
1. 技術(shù)選型指南
2. 聊聊前端工程化
3. 淺談【四更理念】之開發(fā)一個管理端
4. 誰能介紹下web前端工程化?
5. 大公司里怎樣開發(fā)和部署前端代碼?
6. 前端農(nóng)民工的博客
7. 一個程序員的成長之路
8. 如何管理好你團(tuán)隊的前端代碼
4.拓展
1. 純潔的微笑
2. Chrome 開發(fā)者工具操作指南
3.Vue對比其他框架
4. React / Angular / Vue 完整的比較指南
5. 深入ES6模塊
6. Serverless——前端的3.0時代
7. 前端工程化及代碼管理
8. 透視前端工程化
......
如何選型技術(shù)、如何定制規(guī)范、如何分治系統(tǒng)、如何優(yōu)化性能、如何加載資源,當(dāng)你從切圖開始轉(zhuǎn)變?yōu)樗伎歼@些問題的時候,我想說:
你好,工程師!