前端的興起
前端真正興起和開始頻繁出現在大家的視線裡，大概是在十年前。彼時的 Web 開發基本是由後端主導，前端能做的隻是校驗一下資料、操作一下 DOM。（其中資料檢驗是 JS 産生的根本原因：當時網絡太慢，在服務端檢驗資料并回報給使用者，讓使用者知曉輸入錯誤，這個流程太長、反應太慢，是以通過腳本在使用者端完成第一步校驗，既友善了使用者，又減輕了帶寬的壓力。）即使 06 年 jQuery 釋出并風靡全球，以及 XMLHttpRequest 被納入 W3C 标準，也沒有改變這種狀況。制約它進度的原因很簡單，因為很多事情前端 做不了 或者 做不好。随着時間的推移，近幾年，Angular、Backbone、React、Vue 等架構陸續釋出，讓前端越來越正規化、體系化。此時雖然仍有很多事，前端 做不了 或者 做不好，但前端這個崗位卻已變得熱辣空前。那麼，是什麼推動着前端發展到如此大的規模和火熱的程度？
也許，你可以列舉出很多各種各樣的原因，但是綜其一點，就是 『使用者體驗』 ，是由于所有人對使用者體驗的重視，才讓前端發展得這麼迅猛，這麼快地興起。這裡，可能要感謝 Apple，感謝 iPhone，感謝 Jobs，07 年第一代 iPhone 釋出，正式引發了幾乎所有人對使用者體驗的重視，從『隻要能用就好』，變成『要好用我才買單』的心理。而，前端的先驅者們、浏覽器的開發者們，也順應了這個潮流，将一系列重要的能力加入了浏覽器，加入了前端。
其中最重要的一項是 XMLHttpRequest，也就是 Ajax，它是富 Web 應用的基礎，它讓前端可以脫離後端的掌控，不用通過跳轉的方式就能實作資料互動。感謝微軟，感謝 IE，雖然被 IE 6~8 虐了無數遍，但是是它引入了 XMLHttpRequest ，引入了 Ajax，開啟了富 Web 應用的時代，讓使用者體驗大幅提升。
而近幾年，随着移動網際網路的發展，多端多平台的需求越來越多，産品形态和資料分離，是形勢所趨。而與此同時，移動時代對産品形态跨端、跨平台、多元化的使用者體驗要求，讓本身就有跨平台特性的前端技術着實又火了一把，它讓開發者有更多的時間和精力關注使用者體驗，并很容易保持多平台使用者體驗的統一（不同平台用不同技術實作，雖然可以，但成本太高）；除去上面的原因之外，前端技術自帶的熱釋出、熱更新特性，能在及時更新業務需求的同時快速修複使用者所遇到的問題，也是大家選擇它的一種原因。雖然另外還有很多零零總總、各種各樣的原因，再促使着前端成為目前最火爆的幾個職位之一，但是最根本的原因仍舊是大家對使用者體驗的要求。
從上面可以看出，前端的興起源于所有人對 使用者體驗 的重視，而火爆更是由于所有人對 多元化的使用者體驗 的關注。當然，使用者體驗不隻隻是 UI 漂亮、好看，它是多方面的，例如視圖的加載速度和流暢程度，這些取決于你選擇技術的編碼體積、運作效率等多種因素。說白了，前端的目的就是 讓使用者用得爽，那麼 使用者體驗 必須是重中之重。
說了這麼多，其實有一個很重要的點沒有提到，那就是 CSS。注重使用者體驗，首先你要用界面要有 UI，HTML + CSS 作為最簡單的 UI 建構方式，讓前端的 UI 開發成本低到無與倫比，而開發成本低才會有更多的時間和精力去注重使用者體驗。同時，現在 CSS 也有相應的架構，像 PostCss、Sass 等，更進一步降低了開發成本，釋放了開發者的時間和精力。
前端興起這十年，也是使用者體驗飛速增長的十年。不管是技術完善度還是從業人數，前端這個方向受到了足夠多技術人員的關注，同時也受到了足夠多企業的重視。經過前端人不斷的努力，現在的情況又如何呢？
前端的現狀
提到現狀，必須先提到一個概念 大前端。由于近幾年網際網路的發展，尤其是移動網際網路的發展，有的大前端概念将 Native 歸入前端的範疇，有的大前端概念将 Node 甚至隻渲染頁面的 PHP 歸入前端範疇，但不管怎麼說，筆者認為 大前端 是未來的一個趨勢，将最終目标（提升使用者體驗）一緻的技術歸類到一起，讓開發者清楚自己的最終目标是什麼，要怎麼做。當然，也正因為這點，作為一個前端工程師，如果你想更好的發展，你應該有更廣的知識面，包括移動端知識、服務端知識。這些知識結合你的前端技術，才能更好地實作優秀的使用者體驗。
抛開大前端，單談前端，從前端架構層面談，最近比較流行的有四個：老牌勁旅 jQuery、最近火得不能再火的 React、Google 精品 Angular 以及 MVVM 架構 Vue。現在幾乎所有的項目都會在這四種架構方案中選擇其一作為基礎，進行業務開發。四種架構，四種不同的思想，簡單來說：jQuery Dom 驅動的思想深入人心；React 則推崇元件化，萬物皆元件；Angular 則把 MVC 在前端領域發揚光大；而 Vue 則是以資料驅動為核心的 MVVM 架構。作為一個前端新人，不可能很快就了解所有知識和思想，隻能一步一步來，先把你在工作中所使用的架構了解透徹，再去思考和學習别的。說實話，會用和了解的差距很大。
在這裡，可能會有個疑問，上述四個架構，都很火，但是哪裡涉及到使用者體驗了？是的，這些架構都沒有直接涉及到 UI。但是就像足球，沒有勤奮的訓練和優秀的戰術，再好的11人也踢不出好的比賽一樣，這些架構從開發成本和開發體驗上，降低了開發者編碼和維護的難度，讓其在 UI 的使用者體驗上的付出，事半功倍。當然，架構在編碼體積、運作效率等多個方面影響了最終的使用者體驗。
上面所說的是，目前前端的一大現狀 —— 架構橫行，現在很少有公司、有工程師用純原始的方式撸代碼了。而前端另一大現狀就是 —— 移動為先。原因很簡單，随着移動網際網路使用者的暴漲，各個公司的産品都是移動為先，技術跟随着産品的步伐，也必須移動為先。這時，為了解決多平台的問題，Hybrid 方案脫穎而出，包括傳統的基于 WebView 的 Hybrid 方案（例如 Cordova）和 React-Native 等一系列技術方案。在這裡我就不多說了，關于移動前端的内容最近充斥着各種技術論壇、交流群、公共号，具體的，大家可以自己親身去了解。
最後，對于現狀，我想大家可能最關心的其實是職業形勢。由于前端的興起，前端人才市場相當活躍，平均薪金水準也是名列前茅。與此同時，前端的技術入門比較容易，造成另一個極端情況：人員泛濫、人才稀缺。這種情況，一方面由于前端發展太快，很難短時間掌握全部知識；另一方面，高等院校并沒有開設專門的前端專業，大家更多是自學，野路子很多。所謂亂世出英雄，這樣的前端大環境或許對一個新入行的同學更有利。當然，在如此『亂世』中，一個好的職業規劃，才能避免『誤入歧途』，保證自身順利地成長。
如何做一個職業規劃
上面講述了前端如何興起和前端的現狀，下面将基于上述兩點，分幾個方面為大家提供一些有關職業規劃的觀點，希望對大家有幫助。
确定方向
做職業規劃的目的是避免迷茫，而避免迷茫最有效的方式就是确定明确的方向和目标。
對于任何一個技術崗位，都有固定的兩個方向：技術專家（架構師）和 開發經理。前者偏重技術，需要你在目前領域鑽研得很深；後者偏向管理，需要你在對技術有很深掌握的同時，可以帶領團隊完成項目的開發。當然，兩者并不是魚與熊掌的關系，你可以同時成為技術專家和開發經理。
對于技術專家和開發經理兩個方向的選擇，更多取決于你自身在工作中多巴胺的分泌情況。當你專研技術時，多巴胺分泌得更多，感到更興奮，或許你會很容易成為技術專家；反之，當你跟團隊一起做業務時，多巴胺分泌得更多，更有獲得感，那麼你可以嘗試向開發經理方向發展。
當然，你也可能做什麼都沒有分泌太多的多巴胺，那麼，你可以在嘗試一段時間後，轉型其他職業，例如産品經理。前端作為核心是使用者體驗，與使用者最近的工程師，轉型産品經理，阻礙會小一些。況且，文藝型前端布道人豆瓣前端負責人張克軍認為，前端工程師正慢慢演變為産品工程師，前端和産品離得确實很近。
當你選擇好一個方向後，你就要朝着這個方向一步一步進發。丹尼爾在《一萬小時天才理論》提出一萬小時定律，即要成為某個領域的專家，需要積累一萬小時。當然這隻是個概數，不過每天花更多的時間去學習和實踐，肯定是最有效的。這裡，成為技術專家和開發經理過程中，關注的點略有差别。成長為技術專家，要更多關注技術本身的實作，包括邏輯、架構、設計模式、方法論等；而成長為技術經理，則要更多關注技術開發的過程，考慮如何提高開發效率、降低開發成本、優化開發品質等等。不同的人，精力是有限的，選擇性關注一些必要的方面，對自身快速的成長是很有必要的。
做業務還是做架構
做業務，時間要求比較緊，代碼品質要求高，可參考的代碼比較多，業務知識需要學習。做架構，時間稍微自由，對經驗要求比較高，無可參考代碼，專業基礎知識需要深刻了解；最主要的，做架構的你既是開發，又是使用者，還是 PM ，隻有 80% – 90% 的明确目标，并在開發過程中不斷微調最終的目标。
對于一個新人，其實不用糾結，做業務才是好的選擇，而且做 技術含量高、使用流行技術 的業務才是最好的。原因很簡單，架構的最終的目的是解決業務當中的問題，你沒做過業務，哪能知道業務的問題在哪，你都不知道要解決什麼問題，如何做好架構。是以，從業務做起，是新人最好的選擇，也是唯一可行的選擇。而選擇有技術含量、使用流行技術的業務的原因更多在于成長，這樣你的成長可能會更快、成長道路可能會更直。當然，這隻是『可能』，不同的人适合不同的業務，是以不要強求一定『技術含量高、使用流行技術』的業務，更多的而是改變自己，去 适應團隊、适應業務，這樣才能 更快地成長。
事實上，很多時候，你會遇到很業務工作很繁重沒有額外時間學習的情況。而如何在這樣環境中更快地成長呢？說白了就是『抄』，不不，是 參考。将學習融入到工作中，是最好的方法。做新項目，參考老項目代碼；做新需求，參考老需求的代碼；沒有同類型的代碼，參考别的業務的代碼。參考前人的經驗，在巨人的肩膀上，成長才會變得更快。同時，你的導師和你的夥伴，也會在業務中給你指點，幫你快速解決成長路上的問題。
在這裡，總結一下，在繁重的業務環境下快速成長，你需要 很優秀的學習能力、很持久的耐心 以及 很好的導師和夥伴，這樣才能在技術成長的路上事半功倍。
技術的學習
說了半天，到了最核心的問題了，對于一個新人如何學習技術？筆者給的建議是：千萬不要囫囵吞棗，先把目前使用的技術學透用熟，才是最重要的；千萬不要在還沒把目前使用的技術吃透之前，去學新的東西，不管新的東西有多火。就像上文所說，不同的架構，有不同的核心，有不同的思想。兩個架構代碼相似之處的思想不一定相似，例如 Angular 和 Vue 都有雙向綁定，雖然效果相似，但是實作思想和内部實作方式是截然不同的。還在入門階段的你，會被各種思想充斥頭腦，反而會更不清楚。
一定的時間後，當你了解透一個架構體系後，你可以 類比地去看 更多的架構體系。這時候，你會發現不同架構很多東西都是殊途同歸，了解得很快。
當然，了解透一個架構體系，有人需要一年，有人需要三年，還有人可能需要更長時間。為什麼有這麼大的差別呢？因為有些人在開發中，并不認為完成就可以了，會在開發中，追求代碼的優美，會不斷優化自己的代碼，讓自己的代碼性能更好、可讀性更高，并通過長時間的積累，達到 量變導緻質變 的程度。即使一個特别聰明的人，沒有『量』也不可能『質變』的，隻不過他的量可能比其他人少而已。
要提醒的一點是，學技術，一定要結合你所在公司、團隊的技術棧。例如，去哪兒前端應屆生會在進入業務線前，進行3個月的脫産教育訓練，2017年的前端教育訓練課程内容中涉及的技術主要是 React 和 React Native，而去哪兒業務的技術棧也大多是 React，那麼作為去哪兒的前端應屆生，你優先學習 React 的技術體系是事半功倍的，既有前人可以問，又有項目可以實踐。
當然，在學習架構的同時，不要忽略兩樣最基本的東西，一個是 技術基礎，一個是 開發規範。
技術基礎是一切開發、架構的前提，沒有一個好的基礎，是無法讓你自身的技術水準達到足夠高的次元。例如你對于繼承了解的并不透徹，你很難了解清晰 React 的内部實作。
對于開發規範，筆者在帶應屆生時特别注意讓他們遵守。代碼規範比比皆是，但是很少有人嚴格遵守。究其原因，多是在代碼規範制定之前，已經有自己的一套代碼習慣，很難短時間改變自己的習慣。而應屆生，一般來說代碼并不多，還沒有形成自己的編碼習慣。這時候，開始遵守一定的規範，會促使他們養成一個較好的編碼習慣，為後續的成長打好基礎。下面，列舉一下開發規範的幾點好處，讓大家明白代碼規範的重要性：
規範的代碼可以促進團隊合作。
規範的代碼可以減少 Bug 處理。
規範的代碼可以降低維護成本。
規範的代碼有助于代碼審查。
養成代碼規範的習慣，有助于程式員自身的成長。
如果是自學web前端的話，給以下幾點建議：
1、根據自己的情況，規劃一個合理的學習計劃，學習時長，學習内容，以及練習時間。
2、系統的web前端學習教程
3、多實操，多動手，多練習
4、一周要進行知識點回顧，如果不回顧，不去加深記憶，我保證你會不斷的忘記之前的
5、找個專業的人指導，不要異想天開覺得自己可以無師自通，這不現實，也是對自己不負責任
6、堅持每天學習不能間斷，準備好用半年的時間學前端，現在競争大，技術學不好很難就業
7、跟比較明白的人請教一下學前端有哪些坑，避免走太多彎路，掌握好學習方法
自學路線：
基礎篇
HTML,Css,JavaScript，jQuery這是一個基本前端必須要掌握的，比較簡單，也是入門級技術。
進階篇
Bootstrap，TypeScript ，JSON，jQuery EasyUI，jQuery UI等一些第三方js庫。稍有難度，前期可以基本了解一下，友善面試，工作中使用再去研究。
進階篇
Vue，React，Angular前端主流三大架構，熟悉一個，了解兩個。伺服器語言node.js學習一下，版本管理工具，git，svn學習了解。
主戰場 —— 移動混合開發
随着移動浪潮的興起，業務在移動端App 的需求量迅速擴大，應用疊代更新的頻率也随之極速攀升，但與此同時純 Native 的開發和更新成本成為了業務增長難以逾越的瓶頸。是以，引入一種開發更高效、成本更低的解決方案勢在必行。
在目前的移動網際網路環境下，iOS 和 Android 上的 App 已經成了每個網際網路産品的标配。如果一個使用者端産品并不提供相應 App 版本，幾乎會直接定義成一個不完整的産品。而被網際網路人尊為鐵律的『唯快不破』—— 快速開發、高速疊代、低成本上線，同時也是移動時代每個開發團隊所追求的目标。綜合以上兩點原因，『Native 搭台，Web 唱戲』的 Hybrid 開發模式，以『快』的特點赢得了大家的青睐，并紛紛投入大量開發力量，使這種開發模式迅速走紅。目前最常見的技術架構方案有以下三種：
基于 Web 的 Hybrid 解決方案：例如微信浏覽器、各公司的 Hybrid 方案
非基于 Web UI 但業務邏輯基于 JavaScript 的解決方案：例如 React-Native
基于 Web UI，但是為了追求運作效率，對 UI 展現邏輯和業務邏輯的 JavaScript 進行了隔離的解決方案：微信小程式
對于一個前端，筆者感覺每個人必須了解這三種常見方案的實作方式和優缺點，這樣才能在開發移動端業務的時候，更為清楚自己所要注意、所要學習的地方。當然，僅僅了解實作方式是不夠的，你要有環境去實踐你學習的東西。再拿去哪兒為例，去哪兒現在大多數業務都是移動端的，Hybrid 和 RN 方案都在被使用。是以，作為一個應屆生，你很有可能去做一些 Hybrid 或者 RN 的項目。做 Hybrid 項目時，你更多要考慮的是『如何高效地操作 Dom』；反之，做 RN 項目，你更多要考慮的則是『如何減少和 Native 的通信』。這兩點，最終都會反應在項目的使用者體驗上。
這裡，會出現一個問題，我隻是前端，需不需要去學習 Node？筆者的答案是 需要。前端興起已經很多年，已經從遊擊隊亂槍打鳥的階段逐漸變為規模化、工程化的時代。在這個時代中，尤其是在工具和流程方面，Node 起到了很大的作用，扮演很重要的角色。諸如 Webpack、Gulp、NPM 這些工具，他們被運用在各個公司的各類前端項目中。學習 Node 其實就是去學習前端的工具，去學習前端的工程化。
我目前是在職前端開發，如果你現在也想學習前端開發技術，在入門學習前端的過程當中有遇見任何關于學習方法，學習路線，學習效率等方面的問題，你都可以申請加入我所在的前端學習交流裙：前面：42137 後面：4697。裡面聚集了一些正在自學前端的初學者,轉行者，初階者，裡面也有我整理的一些前端書籍PDF、前端面試題、前端開發源碼教程等PDF文檔書籍教程,需要的話都可以找裙豬擷取。