本人Sam。啟蒙微軟派，遁入前端教。已修煉後端技能、領域驅動設計、前端技能等近八餘載。擅長C#，領域驅動設計，必殺技為Javascript、Css。為領域驅動設計在前端教的應用而奮鬥。現將自我領悟的前端教技能秘笈總結如下： 上圖咯： 內功心法 前端教的三大內功秘笈：Html、Css、Javascri ...
本人Sam。啟蒙微軟派，遁入前端教。已修煉後端技能、領域驅動設計、前端技能等近八餘載。擅長C#，領域驅動設計，必殺技為Javascript、Css。為領域驅動設計在前端教的應用而奮鬥。現將自我領悟的前端教技能秘笈總結如下：
上圖咯：
內功心法
前端教的三大內功秘笈：Html、Css、Javascript。你必須要掌握的程度
- html：他是Css和Javascript秘笈的根本，沒有他Css和Javascript就無法施展其魅力。他包含了標簽語義、BFC和IFC標簽、h5新功能（如：cnavas、video、websocket、localstorage等）等。
- css：他有靜態裝飾html元素能力，css3的出現也讓他做了一Javascript的事件。你需要區分css2.1與css3的差異。
在css2.1的領域中display(改變元素的BFC和IFC的能力)、float(讓元素浮動)、position(定位)、z-index(層級)、vertical-algin(垂直對齊)、Margin和Padding等很重要。而在css3的領域更加完善了background、transition(過渡)、animation(動畫)、linear-gradient（漸變）、shadow(陰影)、flex佈局、媒體查詢的支持、多設備適配的單位等，這些你都需要掌握。
- javascript：他是三大秘笈中最難，也是最致命的技能，什麼怪都能打。
es5存在了很多年，es6火得很快，es7又來了。es5雖然很古老，他也是一切罪惡的根源，es6與es7都是為es5解決一些複雜場景應用的問題。在es5領域中的閉包、this指向、自執行函數、執行上下文、Js與Dom的關係等很重要，在es6的領域中，Class、let、Promise、Generator等太多東西，這些你都需要深入理解和掌握。
下山
完成上述內功心法的修煉，我們就可以進入下一個階段，下山打怪。
在這裡我們需要解決掉一個css框架、一個javascript框架，css框架推薦選擇當下流行的bootstrap，他是集合了所有怪物的特點於一身。javascript框架推薦選擇框架老祖JQuery，雖然現在都MV*了，但是JQuery的江湖地位還是首屈一指的。對於這兩個框架我們需要深入理解他的源碼，並對每一個值得學習的細節做好筆記。
- boostratp要學習他對css應用場景的分類，如：字體、按鈕、表單等，更要掌握他利用樣式疊加實現各種效果的組合技能。
- JQuery要學習他的Promise(Es6會原生實現)、Extend方法，鏈式調用、callback、css相關Hack的處理手段等
製造怪物
在製造怪物之前，我們還需要瞭解當下流行的MV*框架，他是未來處理前端項目的首先，在這裡我們思想要有所改變，要時刻記住只有viewModel才能驅動view的改變，以及Flux概念的理解和應用。
- 選擇一個MV*框架深入學習，如：Vue，React，AnglerJs等。
- 學習Nodejs做為前端開發工具的應用
- 學習一門戶後端語言，推薦nodejs。可以做到一份代碼多端運行，也就是同構方案
- 前端自動化工具的使用，如karma，eslint，webpack，phantomJs，selenim webdirver等 完成上述技能後，就可以選擇一個業務領域進行自己框架的開發了。
修煉成仙
完成前三步已經是江湖高手了，在這裡主要是把我們渡為神，如下就是神所需要具體的能力
- 對瀏覽器解析原理的深入理解，瞭解各瀏覽器內核，如：webkit，Gecko等，折騰源碼建議選擇webkit相關的。
- Javascript解析原理的深入理解，首先V8引擎
- 建議選擇chrome開源版本的chromium學習和應用
此文為本人轉型前端兩年來的自我實踐總結，如有偏頗歡迎指正。也許我們會在某個階段停留很久，但不要氣餒，相信自己一定會突破難關。為自己，更為同樣身在泥潭中的戰友，共勉。
