大多數野生程式員最棘手的問題就是如何依靠技術解決溫飽，通俗來講就是技術折現的問題。 如果是單純出於興趣，或者只是為了突擊某一階段或者某一項目技術壁壘，不跟就業掛鉤的自學倒也是無關痛癢。但是當上崗成為自學的終極目標和結果時，一切都就另當別論了。 前端自學者存在的學習誤區： 1、所學東西可能已過時 奉為 ...
大多數野生程式員最棘手的問題就是如何依靠技術解決溫飽，通俗來講就是技術折現的問題。
如果是單純出於興趣，或者只是為了突擊某一階段或者某一項目技術壁壘，不跟就業掛鉤的自學倒也是無關痛癢。但是當上崗成為自學的終極目標和結果時，一切都就另當別論了。
前端自學者存在的學習誤區：
1、所學東西可能已過時
奉為經典的東西可能已經過時，或者已經有了更好的替代者，而你獲取信息的渠道有限，消息滯後，導致學習的內容也相對滯後。
2、學習方法盲目。
看書看不懂就找視頻類教程學習，覺得教程跟自己的口味不符就另尋他法，因為自己缺少對資源的辨識能力，總是在沒有清晰規劃學習線路的情況就盲目學習，導致無效學習時間過長而收穫寥寥。
3、只有理論，缺乏真實項目鍛煉。
對技術的理解停留在理論層次，而缺乏真實企業項目的歷練，如果沒有相關實習或工作經歷，對前端崗位具體的責任劃分和工作流程瞭解不充分。
自學前端需要掌握哪些技能，才能去工作？
所以，自學前端需要達到什麼水平才能去工作？我結合了知識點和現在前端主流崗位需求，列舉了一些，希望對大家的學習有幫助~
PC端網站佈局：HTML基礎，CSS基礎，CSS核心屬性，CSS樣式層疊，繼承，盒模型，容器，溢出及元素類型，瀏覽器相容與寬高自適度，定位，錨點與透明，圖片整合，表格，CSS屬性與濾鏡等。
HTML5+CSS3基礎：HTML5新增的元素與屬性，表單域增強元素，CSS3選擇器，文字字體相關樣式，CSS3位移與變形處理，CSS3 2D轉換與過度動畫，CSS3 3D轉換與關鍵幀動畫，彈性盒模型，媒體查詢，響應式設計等。
WebApp頁面佈局：移動端頁面設計規範，移動端切圖，文字流式/控制項彈性/圖片等比例/特殊設計的100%佈局，等比縮放佈局，viewport/meta，rem/vw的使用，flexbox詳解，移動web特別樣式處理等。
原生JavaScript交互功能開發：基本語法，迴圈語句，函數與數組，String與Date，BOM與DOM，事件，拖拽效果，cookie存儲，正則表達式，Ajax，面向對象基礎，運動與游戲開發等。
面向對象進階與ES5/ES6應用：Promise/A+，設計模式（觀察者模式等），原型鏈，構造函數，執行上下文棧與執行上下文，變數對象與活動對象，作用域鏈，閉包，this，ES5，ES6等。
JavaScript工具庫自主研發：DOM庫，事件庫，AJAX庫，原型和繼承庫，MVVM核心庫，基於SPA的路由庫等。
jQuery經典交互特效：時間軸特效，tab頁面切換效果，網頁定位導航特效，滑動門特效，焦點圖輪播特效，導航條菜單效果，瀑布流特效，彈出層效果，倒計時效果等。
PHP+MySQL後端基礎：PHP，MySQL，HTTP(s)協議詳解，Ajax進階、跨域與Defered，Apache與Nginx 環境搭建與配置，介面的定義，Mock數據，Restful，前後端聯調，前端安全(XSS,CSRF,JSON註入)等。
前端工程化與模塊化應用：Gulp，Webpack，NPM，Git/SVN，CommonJS，AMD，CMD，ES6模塊化等。
PC端全棧開發：大首頁、列表頁與詳情頁展示與交互特效、搜索、登錄與註冊、購物車、jQueryUI 與 jQuery EasyUI、Bootstrap(ACE)、Highcharts/Echarts、ArtTemplate、Velocity、Smarty、雲平臺系統前端等。
應用Vue.js開發WebApp：Vue.js基礎，模塊化，單文件組件，路由，與伺服器通信，狀態管理，單元測試與生產發佈，服務端渲染SSR與Nuxt.js，基於Vue.js企業級項目開發等。
應用React.js開發WebApp：ReactJS基礎，JSX語法，組件，flux+Redux，React，Router路由，動畫效果，基於React 企業級項目研發等。
應用Angular開發WebApp：TypeScript 基礎與進階，開發環境配置，Hello World，架構、模塊與組件，模板，元數據、數據綁定與數據顯示，表單，服務與指令，依賴註入，路由，Ionic 3 MUI框架等。
微信公眾號開發：初識微信公眾號，訂閱號的基本功能，使用百度BAE實現代碼的快速上線，使用Git完成線上代碼部署，公眾號開發許可權及功能接入，微信JSSDK介面API，微信場景項目開發與接入等。
微信小程式開發：微信小程式初探，小程式入門必學，小程式組件體驗，小程式大功能，項目實戰等。
React Native：React Native 初探，React Native 項目導航，React Native 項目文本框，React Native 項目滾動分頁，React Native 項目第三方登錄，React Native其他組件等。
各類混合應用開發：自主原生Navtive Hybrid，第三方Hybrid框架Cordova/Phone gap，第三方Hybrid框架等。
自學前端時的加分項
哦，對了還有加分項，大數據可視化！
建議大家從一些知識細節入手，數據可視化入門，數據可視化基礎，零編程工具使用：ChartBlocks、Infogram、plotly、Raw、Tableau，D3.js詳解，D3.js 入門，D3.js 高級應用，D3.js 應用工具：NVD3、n3，charts，Highcharts，FusionCharts，Polymaps等。
小編是一個有著5年工作經驗的架構師，關於web前端，自己有做材料的整合，一個完整學習web前端的路線，學習材料和工具。需要的伙伴可以加qun，前面是四八四，中間七五七，最後七六零，直接下載，免費送給大家。對於學習web前端有任何問題（學習方法，學習效率，如何就業）都可以問我。希望你也能憑自己的努力，成為下一個優秀的程式員！
自學其實就是一種手段，至於具體的學習效果，其實全在於個人，這種入門前端的方法基本是屬於最慢的，如果學習方法和方向不對，很可能是做無用功。如果是想轉行前端或者是想要進入前端這個行業，以此為職業的話，建議還是系統的培訓學習吧，因為不僅能節約時間，還能瞭解到最新的前端技術和技能，也有行業內的專業人士幫你找到最快捷的學習入門方法，不至於白學或者走彎路。這隻是個人的一點建議，僅供參考，不喜勿噴！
