Web前端工程師成長之路——知識匯總


一、何為Web前端工程師?
      
      前端工程師,也叫Web前端開發工程師。他是隨着web發展,細分出來的行業。Web前端開發工程師,主要職責是利用(X)HTML/CSS /JavaScript/DOM/Flash等各種Web技術進行產品的界面開發。制作標准優化的代碼,並增加交互動態功能,開發JavaScript以 及Flash模塊,同時結合后台開發技術模擬整體效果,進行豐富互聯網的Web開發,致力於通過技術改善用戶體驗。
Web前端工程師成長之路——知識匯總
圖1、前端技術MSS

      Web前端開發技術主要包括三個要素:HTML、CSS和JavaScript!
      它要求前端開發工程師不僅要掌握基本的Web前端開發技術,網站性能優化、SEO和服務器端的基礎知識,而且要學會運用各種工具進行輔助開發以及理論層面的知識,包括代碼的可維護性、組件的易用性、分層語義模板和瀏覽器分級支持等。
      隨着近兩三年來RIA(Rich Internet Applications的縮寫,中文含義為:豐富的因特網應用程序)的流行和普及帶來的諸如:Flash/Flex,Silverlight、XML和服務器端語言(PHP、ASP.NET,JSP、Python)等語言,前端開發工程師也需要掌握。
      前端開發的入門門檻其實很低,與服務器端語言先慢后快的學習曲線相比,前端開發的學習曲線是先快后慢。

  • HTML 甚至不是一門語言,他僅僅是簡單的標記語言!
  • CSS 只是無類型的樣式修飾語言。當然可以勉強算作弱類型語言。
  • Javascript 的基礎部分相對來說不難,入手還算快。
    
      也正因為如此,前端開發領域有很多自學成“才”的同行,但大多數人都停留在會用的階段,因為后面的學習曲線越來越陡峭,每前進一步都很難。 Web前端技術有一些江湖氣,知識點過於瑣碎,技術價值觀的博弈也難分伯仲,即全局的系統的知識結構並未成體系,這些因素也客觀上影響了“正統“前端技術 的沉淀!而且各種“奇技淫巧”被濫用,前端技術知識的傳承也過於泛泛,新人難看清時局把握主次。因此,前端技術領域,為自己覓得一個靠譜的師兄,重要性要 蓋過項目、團隊、公司、甚至薪水。
 
      另一方面,正如前面所說,前端開發是個非常新的職業,對一些規范和最佳實踐的研究都處於探索階段。總有新的靈感和技術不時閃現出來,例如CSS sprite、負邊距布局、柵格布局等;各種JavaScript框架層出不窮,為整個前端開發領域注入了巨大的活力;瀏覽器大戰也越來越白熱化,跨瀏覽 器兼容方案依然是五花八門。為了滿足“高可維護性”的需要,需要更深入、更系統地去掌握前端知識,這樣才可能創建一個好的前端架構,保證代碼的質量。
 
      隨着手持設備的迅猛發展,帶動了 HTML5行業標准的快速發展。web領域的技術,大概有10年都沒有大的更新了!現在市場很需要優秀的、高級的前端工程師。一方面是因為這是一個比較新 的細分行業,而且前端程序員大都自學一部分,知識結構不系統;另一方面,大學里面沒有這種課程,最最重要的是:北大青鳥這類培訓機構也沒有專門的前端工程 師的培訓課程!!
 
      吳亮在《JavaScript 王者歸來》第一張的序里面說:大多數程序員認為 Javascript 過於簡陋,只適合一些網頁上面花哨的表現,所以不願花費精力去學習,或者以為不學習就能掌握。實際上,一門語言是否腳本語言,往往是她的設計目標決定,簡單與復雜並不是區分腳本語言和非腳本語言的標准。事實上,在腳本語言里面,Javascript 屬於相當復雜的一門語言,他的復雜度即使放在非腳本語言中來衡量,也是一門相當復雜的語言!Javascript 的復雜度不遜色於 Perl 和 Python!


二、如何學習前端知識?
      
     作為一名最基礎的前端工程師你必須掌握HTML、CSS和 JavaScript。三者必須同時精通,類似我字樣對前端知識一知半解的,一遇到問題就停下工作就四處搜索解決方案的,首先就算不上一個合格的前端人 員。像我這樣的如果當了前端工程師那工期肯定是不能保證的。合格的前端工程師第一要學會的就是在沒有任何外來幫助的情況下(包括搜索引擎),能夠完成大多 數任務。
以下知識點是作為一個前端工程師必須了解和熟悉的:

  • DOM結構——兩個節點之間可能存在哪些關系以及如何在節點之間任意移動。
  • DOM操作——怎樣添加、移除、移動、復制、創建和查找節點。
  • 事件——怎樣使用事件以及IE和DOM事件模型之間存在哪些主要差別。
  • XMLHttpRequest——這是什么、怎樣完整地執行一次GET請求、怎樣檢測錯誤。
  • 嚴格模式與混雜模式——如何觸發這兩種模式,區分它們有何意義。
  • 盒模型——外邊距、內邊距和邊框之間的關系,IE < 8中的盒模型有什么不同。
  • 塊級元素與行內元素——怎么用CSS控制它們、它們怎樣影響周圍的元素以及你覺得應該如何定義它們的樣式。
  • 浮動元素——怎么使用它們、它們有什么問題以及怎么解決這些問題。
  • HTML與XHTML——二者有什么區別,你覺得應該使用哪一個並說出理由。
  • JSON——它是什么、為什么應該使用它、到底該怎么使用它,說出實現細節來。
      
    上述這些知識點都應該是你“想都不用想”就知道的東西。除了上述的前端知識,也還需學會至少一門后端編程語言,讓你自己學會如何與后端進行更好的交互。 很 多前端工程師對一些庫非常的熟悉,jQuery,Bootstrap等,但是對於庫的熟悉並不能提現你的優秀,整整優秀的是那些理解庫背后的機制,特別是 能夠徒手寫出一個自己的庫的人。真正合格的前端工程師是能實現具體的功能要求,而優秀的前端工程師需要解決的問題是尋找一個最優的解決方案。

      再者,優秀的前端工程師需要具備良好的溝通能力,因為前端工程師至少都要滿足四類客戶的需求:

  • 產品經理。這些是負責策划應用程序的一群人。他們會想出很多新鮮的、奇怪的、甚至是不可是實現的應用。一般來說,產品經理都追求豐富的功能。
  • UI設計師。這些人負責應用程序的視覺設計和交互模擬。他們關心的是用戶對什么敏感、交互的一貫性以及整體的好用性。一般來說,UI設計師於流暢靚麗、但並不容易實現的用戶界面,而且他們經常不滿前端工程師造成 1px 的誤差。
  • 項目經理。這些人負責實際地運行和維護應用程序。項目管理的主要關注點,無外乎正常運行時間、應用程序始終正常可用的時間、性能和截止日期。項目經理追求的目標往往是盡量保持事情的簡單化,以及不在升級更新時引入新問題。
  • 最終用戶。指的是應用程序的主要消費者。盡管前端工程師不會經常與最終用戶打交道,但他們的反饋意見至關重要。最終用戶要求最多的就是對個人有用的功能,以及競爭性產品所具備的功能。  
      
      Yahoo公司 ,YUI的開發工程師 Nicholas C. Zakas 認為:前端工程師是計算機科學職業領域中最復雜的一個工種。絕大多數傳統的編程思想已經不適用了,為了在多種平台中使用,多種技術都借鑒了大量軟科學的知 識和理念。成為優秀前端工程師所要具備的專業技術,涉及到廣闊而復雜的領域,這些領域又會因為你最終必須服務的各方的介入而變得更加復雜。專業技術可能會 引領你進入成為前端工程師的大門,但只有運用該技術創造的應用程序以及你跟他人並肩協同的能力,才會真正讓你變得優秀。

三、提升無止境

Web前端工程師成長之路——知識匯總
圖2、Web前端工程師知識架構

      優秀的前端工程師應該具備快速學習能力。推動Web發展的技術並不是靜止不動的,這些技術幾乎每天都在變化,如果沒有快速學習能力,你就跟不上Web發展 的步伐。你必須不斷提升自己,不斷學習新技術、新模式;僅僅依靠今天的知識無法適應未來。Web的明天與今天必將有天壤之別,而你的工作就是要搞清楚如何 通過自己的Web應用程序來體現這種翻天覆地的變化。


四、前端開發知識架構

前端工程師


五、Web前端學習書籍
    
    HTML、CSS 類別書籍,都是大同小異,在當當網、卓越網搜索一下很多推薦。如果感覺學的差不多了,可以關注一下《CSS禪意花園》,這個很有影響力。Javascript 的書籍 推薦看老外寫的,國內很多 Javascript 書籍的作者對 Javascript 語言了解的都不是很透徹。
    這里推薦幾本 Javascript 書籍:
    ——初級讀物:——
   《JavaScript高級程序設計》:一本非常完整的經典入門書籍,被譽為JavaScript聖經之一,詳解的非常詳細,最新版第三版已經發布了,建議購買。
   《JavaScript王者歸來》百度的一個Web開發項目經理寫的,作為初學者准備的入門級教程也不錯。
    ——中級讀物:——
   《JavaScript權威指南》:另外一本JavaScript聖經,講解的也非常詳細,屬於中級讀物,建議購買。
   《JavaScript.The.Good.Parts》:Yahoo大牛,JavaScript精神領袖Douglas Crockford的大作,雖然才100多頁,但是字字珠璣啊!強烈建議閱讀。
   《高性能JavaScript》:《JavaScript高級程序設計》作者Nicholas C. Zakas的又一大作。
   《Eloquent JavaScript》:這本書才200多頁,非常短小,通過幾個非常經典的例子(艾米麗姨媽的貓、悲慘的隱士、模擬生態圈、推箱子游戲等等)來介紹JavaScript方方面面的知識和應用方法。
高級讀物:
   《JavaScript Patterns 》:書中介紹到了各種經典的模式,如構造函數、單例、工廠等等,值得學習。
   《Pro.JavaScript.Design.Patterns》:Apress出版社講解JavaScript設計模式的書,非常不錯。
   《Developing JavaScript Web Applications》:構建富應用的好書,針對MVC模式有較為深入的講解,同時也對一些流程的庫進行了講解。
   《Developing Large Web Applications》:不僅有JavaScript方面的介紹,還有CSS、HTML方面的介紹,但是介紹的內容卻都非常不錯,真正考慮到了一個大型的Web程序下,如何進行JavaScript架構設計,值得一讀。
    要做優秀的前端工程師,還需要繼續努力:《高性能網站建設指南》、《Yahoo工程師的網站性能優化的建議》、“YSLOW”性能優化建議、《網站重構》、《Web開發敏捷之道》、“ jQuery 庫”、“前端框架”、“HTML5”、“CSS3”…… 這些都要深入研究!
 
    萬事開頭難!如果你能到這個境界,剩下的路自己就可以走下去了。如果單純只是學習前端編程語言、而不懂后端編程語言(PHP、ASP.NET,JSP、Python),也不能算作是優秀的前端工程師。在成為一個優秀的前端工程師的道路上,充滿了汗水和辛勞。


六、參考資料  





免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM