前端工程師是怎麼練成的

     本人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學習和應用

     此文爲本人轉型前端兩年來的自我實踐總結，若有偏頗歡迎指正。也許咱們會在某個階段停留好久，但不要氣餒，相信本身必定會突破難關。爲本身，更爲一樣身在泥潭中的戰友，共勉。