成都源碼時代H5培訓精英班

· HTML5+CSS3基礎入門
課程內容
掌握HTML5入門基本內容：文件目錄結構、語義化標簽、注釋、編碼規范等； 掌握CSS3的基礎入門知識：內聯式與外聯式、各類選擇器；掌握IDE的使用及基本的瀏覽器調試；
項目實戰
京東登錄注冊案例（HTML5+CSS3） 登錄界面提供賬號、密碼等表單驗證，有控制用戶權限、記錄用戶行為、保護操作安全的作用。登錄界面是所有在線系統的入口。
· HTML5+CSS3進階
課程內容
選擇器的繼承與優先級、盒子模型、浮動布局、相對定位、絕對定位等布局方案；能夠熟練進行網站布局的實現。
項目實戰
項目實戰-個人博客（HTML5+CSS3） 個人博客是學員涉足前端領域的第一個項目，運用前端基礎知識，培養項目思維，在入學兩周內搭建屬于自己的個人信息分享平臺。
· Photoshop
課程內容
熟練使用Photoshop進行位圖處理：常用工具、圖層處理、切圖等，并結合商業案例練習。學習后能夠獨立進行網站切圖工作，與設計師無縫協作。
項目實戰
項目實戰- 企業網站（HTML5+CSS3+Photoshop+PxCook） 企業網站作為一家公司的互聯網名片，是每家企業必備。該項目強化學員對HTML+CSS+PS（切圖）等知識的綜合應用； 作為第一個企業級項目，更側重體驗項目研發協作流程以及培養問題定位能力和調試能力。

· JavaScript基礎
課程內容
了解最前沿JavaScript知識。掌握JS基礎語法。以及ES6&ES7新特性，培養編程邏輯思維，輕松實現網站的動態交互。
項目實戰
案例實踐-H5音樂播放器、H5小游戲 （HTML5+CSS3+Javascript） 通過游戲應用開發，培養學員的參與感和研發興趣，強化Javascript基礎及DOM操作和事件機制在實際場景中的應用。
· BOM+DOM編程
課程內容
理解BOM和DOM模型：掌握各瀏覽器API的使用、熟練操作元素節點、理解網站事件類型與機制
項目實戰
案例實踐-H5音樂播放器、H5小游戲 （HTML5+CSS3+Javascript） 通過游戲應用開發，培養學員的參與感和研發興趣，強化Javascript基礎及DOM操作和事件機制在實際場景中的應用。
· jQuery＋交互及動畫＋jQuery優質插件
課程內容
熟練掌握JQuery生態下的網站研發：選擇器操作、屬性與樣式操作、DOM節點操作、事件處理、動畫特效等； 了解JQuery社區優質框架和插件的使用，培養學員前端庫的使用意識和能力。
項目實戰
案例實踐-樓層跳動&輪播&表單驗證 （HTML5+CSS3+jQuery） 體味JQuery對原生JS封裝后帶來的諸多好處。首次接觸社區輪子庫（如Swiper）的使用，感受社區生態對項目研發效率上的提升。思維上初現組件化思想的萌芽。
· 版本控制工具GIT&SVN
課程內容
使用GIT/SVN進行代碼版本控制。熟練使用各指令操作，授課中滲透分支概念，模擬實際的企業協作場景，圖解Git分支協作流程Git Flow。培養學員的版本控制意識及研發協作能力。
項目實戰
項目實戰 -電子購物網站（HTML5+CSS3+jQuery+UI插件庫） 通過本階段的學習，學員具備熟練操作元素節點及實現動畫的能力；熟悉社區庫、插件的使用流程；培養良好的代碼版本控制意識，并在實戰中鍛煉學員的協作研發能力。

· JavaScript進階
課程內容
掌握最新語言標準下的數組、對象操作方法；深入探索瀏覽器history歷史堆棧；使用正則表達式進行表單驗證；DOM事件流解析等。
項目實戰
案例實戰-天貓品牌墻 / H5動效簡歷 （HTML5+CSS3+動畫框架） 網站品牌墻是網頁商鋪吸流的利器。本項目實戰過程中分析常見動畫實現原理，封裝動畫框架，并結合H5與CSS3標準下的諸多特性，實現天貓品牌墻動效。
· HTML5+CSS3進階
課程內容
多媒體操作-音頻、視頻；Web存儲技術LocalStorage、SessionStorage、Cookie；LBS地理定位技術；高德地圖、百度地圖API應用；數據可視化基礎：Canvas畫布繪圖；Echarts進行數據可視化及地圖應用開發；CSS3選擇器；響應式布局原理及CSS3媒體查詢；多列布局、Flex布局；Web字體、漸變、過渡動畫等；
項目實戰
案例實戰-天貓品牌墻 / H5動效簡歷 （HTML5+CSS3+動畫框架） 網站品牌墻是網頁商鋪吸流的利器。本項目實戰過程中分析常見動畫實現原理，封裝動畫框架，并結合H5與CSS3標準下的諸多特性，實現天貓品牌墻動效。
· Bootstrap4
課程內容
響應式布局框架BootStrap的最新版本：基礎樣式、柵格系統、UI控件和JavaScript插件等；
項目實戰
項目實戰-電影主題站設計 （HTML5+CSS3+Bootstrap） 快速打造能夠適應多端布局的電影主題網站
· 依賴管理+ CSS預處理（Less+Sass）
課程內容
使用bower管理庫依賴，一個命令搞定所有依賴；使用CSS預處理框架Less/Sass，簡單代碼實現復雜樣式功能；
項目實戰
項目實戰-運動健身移動站 （Webpack+Less+原生JS+移動端布局適配） 完全手寫Webpack配置，深入理解前端編譯構建階段的流程與內容。項目涵蓋諸多經典交互場景來鍛煉學員原生JS的運用能力。CSS布局樣式方面更側重移動端布局、動效、適配能力的鍛煉。
· 自動化構建部署
課程內容
手寫配置，使用Webpack/Gulp/Grunt進行預編譯，實現代碼的壓縮、合并、混淆，結合各加載器Loader進行編譯優化，啟動本地服務與接口代理；了解前端自動化構建工具的執行原理；
項目實戰
項目實戰-運動健身移動站 （Webpack+Less+原生JS+移動端布局適配） 完全手寫Webpack配置，深入理解前端編譯構建階段的流程與內容。項目涵蓋諸多經典交互場景來鍛煉學員原生JS的運用能力。CSS布局樣式方面更側重移動端布局、動效、適配能力的鍛煉。
· Mysql
課程內容
了解Mysql背景，快速搭建Mysql環境，熟悉Sql基礎語法，實現對數據的CRUD操作
項目實戰
項目實戰-運動健身移動站 （Webpack+Less+原生JS+移動端布局適配） 完全手寫Webpack配置，深入理解前端編譯構建階段的流程與內容。項目涵蓋諸多經典交互場景來鍛煉學員原生JS的運用能力。CSS布局樣式方面更側重移動端布局、動效、適配能力的鍛煉。

· JavaScript高級編程
課程內容
執行環境與作用域、閉包、面向對象編程、原型與原型鏈、變量類型檢測、淺拷貝與深拷貝、ES6新特性（模板字符、箭頭函數、解構賦值、class、模塊化等）、異步編程（Axios庫、Promise、Async與Await等）
項目實戰
案例實踐-原生表單驗證插件 （HTML5+CSS3+ES6） 能夠通過面向對象思想開發jQuery插件，學習實踐JS設計模式，具備初級JS框架的編寫能力。
· jQuery插件開發
課程內容
學習插件開發模式,并自己動手實現動態表格查詢和表單驗證等插件。
項目實戰
案例實踐-原生表單驗證插件 （HTML5+CSS3+ES6） 能夠通過面向對象思想開發jQuery插件，學習實踐JS設計模式，具備初級JS框架的編寫能力。
· 模塊化組件開發
課程內容
了解模塊化編程的歷史和演變；自己動手來實現模塊化管理；了解當下流行的AMD和CMD規范，并掌握基于客戶端的RequireJS框架。
· WebSocket
課程內容
掌握HTTP*、客戶端數據傳輸方式，掌握WebSocket 在HTML5 領域的應用，實現客戶端和服務器的長鏈接。
項目實戰
案例實戰-在線聊天室 （HTML5+CSS3+JS+WebSocket） 打造多人聊天互動的在線聊天室。
· MVVM架構源碼解析
課程內容
掌握MVC、MVP和MVVM架構的演變歷史，掌握分層開發思想，學習雙向綁定原理，實現基于MVVM架構的miniVue框架。
項目實戰
案例實踐-miniVue框架 （面向對象編程） 動手打造第一款屬于自己的前端主流框架。

· VUE2&VUE3
課程內容
掌握Vue技術棧各框架特性：模板語法、生命周期、SFC單文件組件、高階組件、計算屬性、插槽、消息通訊。學習使用Vue-cli腳手架，vue-router路由跳轉，vuex數據狀態管理。ElementUI庫，以及Vant、iView、MintUI移動端框架。
項目實戰
項目實戰1-外賣商家管理系統 （ElementUI＋Koa2＋Mysql） 通過最熱門的Node+Koa2+Mysql開發模式獨立完成網站開發。通過NPM生態圈通過分享和實踐編碼進行自我提升。成為一名真正的全棧工程師。
項目實戰2-超市管理系統 （Element+Koa2+MySql） 熟練使用基于Vue的餓了么前端視圖框架ElementUI，高效打造大型復雜應用。使用Koa2打開更前沿的服務端開發模式，使用Mysql關系數據庫管理大型并發數據。
· TypeScript
課程內容
掌握靜態類型機制、類型注解和類型推斷，元組、接口、枚舉等注解類型的使用。在編譯階段發現和解決編碼問題，使項目的編碼質量進一步提升。
項目實戰
項目實戰-外賣APP、源碼旅游App （TS+Vue+Vuex+Vant+axios） 熟練掌握Vue技術棧下的開發，滿足企業級研發的能力要求，成為合格的高效、高產前端工程師
· Webpack5項目構建打包工具
課程內容
深入學習Webpack5構建打包配置：文件的壓縮、合并、混淆，加載器、babel、代碼質量檢測ESlint、本地服務、Proxy代理等。
項目實戰
項目實戰-外賣APP、源碼旅游App （TS+Vue+Vuex+Vant+axios） 熟練掌握Vue技術棧下的開發，滿足企業級研發的能力要求，成為合格的高效、高產前端工程師
· Uniapp/Taro微信小程序
課程內容
掌握Web跨平臺研發理念； 深入微信小程序框架的應用： 掌握uni-app跨平臺開發，一套代碼編譯到iOS、Android、H5、小程序等多端平臺； 掌握京東凹凸實驗室多端開發框架Taro的使用，打通WebApp、微信/支付寶/百度/字節跳動等小程序的多端編譯。
項目實戰
項目實戰-源碼電影小程序/四海香美食小程序 （WXML + WXSS + JS + 豆瓣開放接口API）通過本階段學習，掌握微信/支付寶/百度/字節跳動小程序的研發，具備熟練進行Web跨平臺研發的能力。

· React技術棧
課程內容
掌握React基本語法、JSX、生命周期、React Hooks 鉤子函數、React-Router路由處理、Redux數據狀態管理。 掌握螞蟻金服AntDesign庫的使用。
項目實戰
項目實戰-源碼房產App、源碼電影App （TS+React+Redux+Webpack+Antd-mobile+Koa2+MongoDB） 熟練掌握React技術棧項目架構下的業務研發。配合著行業主流UI庫AntDesign，高效進行應用布局、樣式及交互的功能實現。
· Flutter/React Native
課程內容
Flutter是谷歌的移動UI框架，可以快速在iOS和Android上構建高質量的原生用戶界面（原生應用）。 Flutter可以與現有的代碼一起工作。在全世界，Flutter正在被越來越多的開發者和組織使用，并且Flutter是完全免費、開源的。 掌握ReactNative技術棧，進行跨平臺應用開發：構建部署流程、文本輸入、滾動視圖、各橋接控件等；
項目實戰
項目實戰-源碼生活APP （ReactNative/Flutter+AntD+DVA+高德地圖API） 通過本階段學習，具備與移動端開發人員的合作完成低成本、高性能、高健壯的App應用的能力。

· 就業指導
課程內容
企業通用面試技巧、知識點面試技巧、模擬面試、項目面試技巧、 語言表達練習、互面總結、總結和復習面試題。
· 面試直通車
課程內容
面試經驗交流、面試技術解惑、面試項目跟蹤。
· 售后服務
課程內容
隨時隨地為同學們提供全方位工作問題解決方案！源碼時代是獨家具有售后的服務機構！

· HTML+CSS快速入門
課程內容
掌握HTML、CSS的基礎語法，并能夠把布局思想和浮動定位熟練引用到項目中實踐到項目。
項目實戰
項目實戰-品一思格城官網 （HTML5+CSS3+Canvas） 熟練掌握品一思格城官網設計和前端代碼規范
· Canvas實戰
課程內容
掌握HTML5繪圖API-Canvas，熟練繪制直線、矩形，圓型等圖案，能夠手動繪制折線圖、餅狀圖、柱狀圖等常見報表圖形，能夠實現H5小游戲。
項目實戰
項目實戰-報表&飛翔小鳥游戲 （HTML5+CSS3+Canvas） 熟練掌握手寫H5報表和H5小游戲
· Vue3+TS+AntDesign項目實戰
課程內容
繼Vue3發布后的前沿應用技術棧應用。課程中可以體驗使用Vue3進行業務編碼的諸多新特性：CompositionAPI、Suspense、Fragments等；AntD作為UI層框架，首先提供對Vue3的支持，Vue3+TypeScript+AntD勢必成為最新的主流技術棧應用架構。
項目實戰
項目實戰-運動健身社區 （Vue3+TypeScript+AntDesign）
· Vue3源碼解析系列課程
課程內容
2020年9月Vue團隊發布3.0正式版，隨后國內各企業陸續進行技術棧升級。本系列課程除具體源碼的講解外，還更加側重于功能背后的設計思想、知識運用的講解，幫助同學們深入理解工作中經常用到的框架特性。隨著學習的不斷深入，你將領略到Vue3框架背后的組件化系統、響應式原理、編譯過程、常用特性甚至Vue生態中Vue Router和Vuex的實現原理等各領域獨有的技術魅力，感受前端學科的技術底蘊。
項目實戰
系列課程配套實戰
· React進階實戰項目
課程內容
掌握來自Facebook工程師開發的流行前端框架-ReactJs；熟練使用ReactJs基本語法、聲明周期、React-Router及基于ES6的React組件開發；掌握React Redux架構在實際項目中的應用。掌握基于ReactJS衍生出來的本地化跨平臺框架；
項目實戰
項目實戰 - 智慧社區App （React+React Router+Redux+Webpack+AmazeUI） 熟練掌握React全家桶項目架構
· React+Dva+AntDesign新聞發布系統
課程內容
Dva可以有效提高React技術棧項目的研發能效。Dva通過 reducers, effects 和 subscriptions 組織 model，簡化 redux 和 redux-saga 引入的概念。
項目實戰
項目實戰-新聞發布系統 （Dva+React+AntD）
· 疫情大數據可視化動態分布
課程內容
掌握AntV數據可視化方案中G2圖形語法的使用，相比于Echarts、HighCharts這類配置式圖表庫，G2圖形語法面向圖表的生成過程，點、線結合著坐標系的映射逐步地完成圖表渲染，具有更強的靈活性、可定制性以及元素事件的支持性。
項目實戰
（AntV-G2+大數據服務）
· Angular
課程內容
掌握Angular環境搭建、知識預備、項目目錄結構分析。 掌握Angular 創建組件 、聲明屬性 、數據綁定、屬性 、條件判斷、事件系統、 表單處理、指令等諸多框架特性。
項目實戰
項目實戰 -源碼商城App （TypeScript+Angular+Webpack+Ionic) 熟練使用Angular框架完成大型項目開發，并配合自動化構建工具及打包工具簡化開發成本；完全具備中、高級前端工程師的素養和要求。
· Expres(Node.js)＋Mongodb
課程內容
掌握node.js環境的搭建及基于服務端模塊化編程;了解node.js基礎知識、特性。掌握NPM生態圈搭建及使用。掌握NodeJS作用域、事件編程、異步編程及文件操作。掌握HTTP*、客戶端數據傳輸方式；熟練使用網頁模板模板技術來簡化開發。掌握Express路由及使用請求、響應對象完成客戶端及服務端的交互；了解Express中間件的使用。了解分布式文件存儲的數據庫MongoDB；讓大家學會搭建和使用屬于前端開發者自己的數據庫，成為一個真正的全棧工程師。
項目實戰
項目實戰 ——學校食堂安全管理系統 （AntDesign+NodeJS+MongoDB） 通過最熱門的Node+Express +MongoDB開發模式獨立完成網站開發。通過NPM生態圈通過分享和借鑒代碼進行自我提升。致力于成為一名真正的全棧工程師。
· PHP
課程內容
快速構建PHP運行環境，熟悉PHP語法、文件操作流程以及對mysql數據庫的連接與操作
項目實戰
項目實戰-響應式金融借貸平臺（Bootstrap4+Sass+PHP+Mysql） 使用Bootstrap4進行響應式布局開發；使用Git進行版本控制，模擬企業真實協作場景。使用CSS預處理技術實現樣式重用和擴展。鍛煉工程構建和高效布局能力。