課程簡介
本課程主要講解如何打造一個(gè)面向大型Web項(xiàng)目的前端工程化集成解決方案，包括前端工程化相關(guān)的各個(gè)方面，由淺入深，闡述前端編譯工具、前端模塊化、前端監(jiān)控、前端性能優(yōu)化、前端規(guī)范等技術(shù)架構(gòu)以及實(shí)現(xiàn)方式和具體應(yīng)用。
目標(biāo)收益
?通過在一流互聯(lián)網(wǎng)多年的開發(fā)經(jīng)驗(yàn)和前端工程化技術(shù)實(shí)踐，可以全面學(xué)習(xí)到：
1.前端工程化思想
2.前端命令行工具內(nèi)核與實(shí)現(xiàn)
3.前端模塊化實(shí)現(xiàn)思路
4. 前端性能優(yōu)化的方法
5.前端持續(xù)集成方案
培訓(xùn)對象
前端開發(fā)行業(yè)的初級(jí)、中級(jí)、高級(jí)前端開發(fā)者
課程定位：適合于對前端工程化有訴求的業(yè)務(wù)項(xiàng)目和業(yè)務(wù)團(tuán)隊(duì)，特別是超大型前端項(xiàng)目、多條業(yè)務(wù)線研發(fā)項(xiàng)目，可以很方便對前端開發(fā)流程統(tǒng)一，前端工具統(tǒng)一，前端組件統(tǒng)一等。
課程內(nèi)容
隨著業(yè)務(wù)項(xiàng)目日益復(fù)雜，團(tuán)隊(duì)成員技術(shù)水平參差不齊，前端框架多樣化等，企業(yè)對前端工程化的訴求逐漸提升，通過前端工程化課程的學(xué)習(xí)，可以幫助我們解決前端研發(fā)過程中遇到的項(xiàng)目、團(tuán)隊(duì)、框架統(tǒng)一等問題。
課前準(zhǔn)備
可以準(zhǔn)備一些實(shí)際工作中前端工程化相關(guān)的技術(shù)問題，以及一些思考，比如如何理解前端工程化？前端工具你常用的有那些，有何優(yōu)勢？前端性能優(yōu)化有那些必備點(diǎn)，如何做。
課程大綱
| 前端工程化 |
定義 要解決哪些問題 架構(gòu) |
| 前端命令行工具 |
常見工具介紹（Grunt、Gulp、Webpack、Vue-CLI、Ng-CLI、FIS、JDF） 大廠JDF前端命令行工具內(nèi)核介紹（架構(gòu)、內(nèi)核、編譯、發(fā)布） 編譯效率提升的方式和方法 |
| 前端模塊化開發(fā) |
常見模塊化方案（CommonJS、AMD、ES Module） 大廠JDF模塊化方案（定義、編譯、命令行、規(guī)范、國際化、文檔生成、單元測試、持續(xù)集成、自動(dòng)測試覆蓋率） npm模塊化方案（安裝、發(fā)布、開發(fā)方法，私有化部署方案介紹） 模塊市場搭建的方式和方法 |
| 前端監(jiān)控 |
面臨新的挑戰(zhàn) 業(yè)界常見方案 大廠方案-上線前Web頁面即時(shí)檢測（定義、頁面錯(cuò)誤、性能指標(biāo)、安全指標(biāo)、AI智能） 大廠方案-上線后前端性能監(jiān)控（定義、分類、采集、展示、告警、問題定位） |
| 前端性能優(yōu)化 |
靜態(tài)資源優(yōu)化 頁面渲染架構(gòu)設(shè)計(jì)和性能優(yōu)化 原生APP優(yōu)化 服務(wù)端和?絡(luò)優(yōu)化 研發(fā)開發(fā)流程優(yōu)化 全鏈路質(zhì)量監(jiān)控體系建設(shè) 大廠性能優(yōu)化實(shí)戰(zhàn)實(shí)例 |
| 前端持續(xù)集成方案介紹 |
應(yīng)用生成 代碼檢查 自動(dòng)編譯 自動(dòng)發(fā)布 持續(xù)部署 文檔生成 |
| 前端代碼規(guī)范如何落地 |
規(guī)范如何制定 如何在開發(fā)流程中落地 |
|
前端工程化 定義 要解決哪些問題 架構(gòu) |
|
前端命令行工具 常見工具介紹（Grunt、Gulp、Webpack、Vue-CLI、Ng-CLI、FIS、JDF） 大廠JDF前端命令行工具內(nèi)核介紹（架構(gòu)、內(nèi)核、編譯、發(fā)布） 編譯效率提升的方式和方法 |
|
前端模塊化開發(fā) 常見模塊化方案（CommonJS、AMD、ES Module） 大廠JDF模塊化方案（定義、編譯、命令行、規(guī)范、國際化、文檔生成、單元測試、持續(xù)集成、自動(dòng)測試覆蓋率） npm模塊化方案（安裝、發(fā)布、開發(fā)方法，私有化部署方案介紹） 模塊市場搭建的方式和方法 |
|
前端監(jiān)控 面臨新的挑戰(zhàn) 業(yè)界常見方案 大廠方案-上線前Web頁面即時(shí)檢測（定義、頁面錯(cuò)誤、性能指標(biāo)、安全指標(biāo)、AI智能） 大廠方案-上線后前端性能監(jiān)控（定義、分類、采集、展示、告警、問題定位） |
|
前端性能優(yōu)化 靜態(tài)資源優(yōu)化 頁面渲染架構(gòu)設(shè)計(jì)和性能優(yōu)化 原生APP優(yōu)化 服務(wù)端和?絡(luò)優(yōu)化 研發(fā)開發(fā)流程優(yōu)化 全鏈路質(zhì)量監(jiān)控體系建設(shè) 大廠性能優(yōu)化實(shí)戰(zhàn)實(shí)例 |
|
前端持續(xù)集成方案介紹 應(yīng)用生成 代碼檢查 自動(dòng)編譯 自動(dòng)發(fā)布 持續(xù)部署 文檔生成 |
|
前端代碼規(guī)范如何落地 規(guī)范如何制定 如何在開發(fā)流程中落地 |
近期公開課推薦
