2019年前端學習路線

zhoutk 發布于2019-08-02 14:15 / 2838人閱讀

摘要：也就是我們常見的瀏覽器以及內置瀏覽器，比如微信打開的大型移動端網頁。這個以微信小程序為例，主要是微信團隊基于前端基礎來做的封裝語法，主要的還是語法。學習路線放一下給大家。前端開發學習不是單一的，內容比較多，同樣應用的場景也非常多。

近兩年來，前端開發工程師越來越火了，
2019年已經到來了，很多準備入行前端開發工程師的小伙伴們，不知道準備得怎么樣了呢？有的朋友在想方設法的學習，爭取在年后的金三銀四能靠實力找到一份滿意的工作！還有的小伙伴很迷茫，想學前端，卻沒有方向！

今天來給大家講講，在2019年，我們學習前端開發，如何才能高效學會前端開發？

零基礎起步

首先，無論學任何一個技術，都是從零基礎開始的，前端開發也是一樣。做軟件開發，是從事編程開發工作，必須先從語法基礎開始學習，通過語法組成產品效果。
前端開發的基礎語法，由HTML+CSS+JavaScript組成，這是前端開發最基本的3個語言。
網頁布局基礎：HTML+CSS
HTML就是超文本標記語言，組成網頁內容的最基本語言。你可以直接說他是網頁的骨架，網頁的圖片、文字、視頻、音頻、程序都需要他引入到網頁中體現。

光是HTML做網頁，只是有了內容，當然是遠遠不夠的。因為只是HTML的話，只能用Table做布局才能勉強做出個成型的網頁來。但是從Web2.0時代開始，都是盒子模型布局法了，也就是用DIV+CSS來實現布局了。
CSS就是層疊樣式表。通過樣式屬性來對標簽進行布局規范，在不再使用table布局的時候，只要CSS樣式對網頁標簽進行對應的布局實現才是正確的開發方式了。

HTML(div)+CSS布局，是基礎入門的基本步驟，在這個階段，你需要學習的內容，包括有：
1.標簽語義化，SEO
2.頁面加載的流程和原理
3.網頁結構
4.盒子模型（W3C盒子模型和IE盒子模型）
5.CSS選擇器
6.CSS布局浮動、定位

在剛剛開始的階段，大家學習的布局方式基本都是以px為單位的靜態布局方法。熟悉好布局方法，先給自己一個小目標，做一個簡單的電商網頁的基本結構出來，不用特效，不需要交互。

瀏覽器腳本語言：JavaScript
JavaScript是我們學習前端開發中非常重要的一個內容，也是一個大家經常掉坑里的難點。JavaScript現在可以說是互聯網時代使用率最高的腳本語言了，在網頁中，所有的數據渲染，特效的交互都需要利用JavaScript，來影響瀏覽器的顯示。

JavaScript不只是開發網頁特效和渲染數據的重要內容，在學習前端開發的后期，大量使用算法和框架的時候，對JavaScript基礎的考驗也是很多的。
在基礎階段，我們學習JavaScript需要注意：
1.基本關鍵字指令
2.基本數據類型、數組
3.函數
4.面向對象編程
5.原型鏈、閉包
6.JSON
7.Ajax
8.DOM(文檔對象模型原生DOM操作)
9.事件捕獲、冒泡、代理
10.常用函數方法
11.ES5、6、7

在JavaScript部分學習，主要還是要去理解好交互的原理，把原理分析清楚，真的理解語法，那寫出多復雜的邏輯也是手到擒來。

JavaScript經典類庫jQuery
說到學習JavaScript，很多小白同學肯定會很頭痛他的原生寫法。每次邏輯業務都需要手動寫，也就是用一次就造一次輪子。覺得很麻煩。如果能簡單一點就好了。
因為JavaScript有可以封裝的特性，所以在后面也出現了很多用JavaScript封裝的類庫、插件。比如說最經典的類庫就是jQuery了。
jQuery類庫就是在類庫里面封裝好了很多JavaScript的事件方法。jQuery通過封裝，減輕了遍歷、對象選擇等等很多的問題。把網頁特效的實現變得簡單化，通過調用方法就可以了。

在學習jQuery的時候，需要重點認識的有:
1.jQuery語法和JavaScript原生語法的差異
2.Dom對象和jQuery對象
3.jQuery的入口函數和JavaScript的入口函數的差異
4.jQuery事件的執行邏輯。
學習jQuery，最需要達到的效果就是能快速的完成網頁的特效，比如說輪播圖、手風琴菜單、旋轉木馬、放大鏡等等這些特效。能完成一個電商網站的布局+特效開發是最基本的要求了。

這些就是零基礎學習必備的一些基本內容，在入門前端開發最基本需要掌握的東西，把基礎理解好，才能為后面的學習做更多的準備。

多終端進階學習

除了基礎的PC端，目前移動端可以說是非常火的了。
比PC端單一的網頁不同，在移動端的技術可以應用到WEB-APP,小程序，Hybrid-App等等。
Web-App
也就是我們常見的瀏覽器（以及內置瀏覽器，比如微信）打開的大型移動端網頁。比如我們常見的電商網站，功能性網站，管理網站，在布局和功能上都有APP的效果。
做好Web-App開發，最基本的很多人肯定會說響應式布局，但是前端開發是又5種布局法的，除了出名的響應式，還有在移動端最重要的彈性布局法，也就是很多人頭疼的rem布局。

除了布局方法之外，在H5新特性和觸屏事件和設備兼容性問題也是需要信手拈來。
小程序
這個也不用多說，現在可以說是非常火的，各大平臺都有在做自己的小程序，各種砍價，搶票，電商，游戲都有運用。這個以微信小程序為例，主要是微信團隊基于前端基礎來做的封裝語法，主要的還是ES語法。小程序目前很多公司都是招聘前端開發，目前還沒有獨立的小程序開發工程師，所以小程序可以說是前端工程師高薪就業的加分技能，換句話說就是成熟開發必備了。

Hybrid-App
又稱混合式APP，可能聽說的人很少，但是18年是越來越多人去開發了，這種是能直接產出下載到終端的APP的，在體驗感上可以說已經具備傳統APP的大部分功能了。這種開發門檻較低，也就是前端開發就可以完成。多數都是大包平臺就能做，這個你可以后面了解一下。

前端主流技術框架

前面的都是基礎東西，現在去就業前端開發，不是只靠個基礎東西，搞個移動端頁面就可以算成熟了。前端3大框架，VUE、Angular、React這3個可以說是現在非常火熱的了。

基礎語法都可以寫的前端，為什么還要框架？
很多小白朋友是不懂什么是框架的，只聽過jQuery這些東西，以為就是框架。或者認為框架就是加速開發，覺得這些庫、插件就能完成框架的工作了。
其實框架的出現，是改變前端地位的重要標志。最重要的表現，就是前后端分離，在前后端分離之前，很多后端開發都是又當爹又當媽的，效果不好效率也不高，我就是在后端出身，深知痛苦。
現在的前端項目，比以前是更加復雜化、多樣化了。項目復雜了，問題也多了。
那框架到底解決了什么問題？
解決重復引用外部js，以用jQuery開發為例，很多時候都是不能單一完成一個項目的，還需要引用很多的第三方插件和庫，導致會一個項目引入很多外部JS文件。

這樣不僅讓代碼變得雜亂，而且很影響打開速度。但是用框架呢，以VUE為例，一般會和構建工具配合，然后就是一個入口文件就可以完成了，在運行時候就在入口引入一次，一勞永逸。
使用組件化開發，組件是前端框架里非常強大的功能之一，它可以擴展你的HTML，封裝可以重用的代碼塊，比如你的輪播圖、tab切換、頁面頭部、頁面底部等等。
這種獨立的組件具有了結構（html），表現（css）和行為（js）完整的功能，很大程度的節省了代碼量，提高了代碼的復用性。特別是團隊合作的時候，可以很好的提高使用效率。
減少開發周期，如果你覺得jQuery可以減少開發周期了，那其實框架可以比庫更快。比如說使用jQuery開發的時候，很多時候是需要頻繁去操作DOM，每次效果都要去查找DOM，這樣就顯得很繁瑣了。使用框架的時候，很多功能都得到了封裝，比如說很多指令都有數據綁定，數據格式化這些功能。這樣更多時候，我們開發的時候只需要關注數據的邏輯就行了。

最后
這些也就是我們學習前端開發必備的一些知識點了。學習路線放一下給大家。

前端開發學習不是單一的，內容比較多，同樣應用的場景也非常多。如果你想從事前端開發工作，就要更急專心和努力，堅持方向不動搖！
更多前端開發學習，關注公眾號【前端研究所】每天更新更多學習教程和方法。

GPU云服務器云服務器機器學習學習路線學習機器學習路線學習機器學習的路線機器學習的學習路線

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://www.hztianpu.com/yun/53675.html

2019年前端學習路線

摘要：也就是我們常見的瀏覽器以及內置瀏覽器，比如微信打開的大型移動端網頁。這個以微信小程序為例，主要是微信團隊基于前端基礎來做的封裝語法，主要的還是語法。學習路線放一下給大家。前端開發學習不是單一的，內容比較多，同樣應用的場景也非常多。近兩年來，前端開發工程師越來越火了，2019年已經到來了，很多準備入行前端開發工程師的小伙伴們，不知道準備得怎么樣了呢？有的朋友在想方設法的學習，爭取在年后...

cfanr 2019-08-30 15:55 評論0 收藏0
2019年前端學習路線

摘要：也就是我們常見的瀏覽器以及內置瀏覽器，比如微信打開的大型移動端網頁。這個以微信小程序為例，主要是微信團隊基于前端基礎來做的封裝語法，主要的還是語法。學習路線放一下給大家。前端開發學習不是單一的，內容比較多，同樣應用的場景也非常多。近兩年來，前端開發工程師越來越火了，2019年已經到來了，很多準備入行前端開發工程師的小伙伴們，不知道準備得怎么樣了呢？有的朋友在想方設法的學習，爭取在年后...

Miracle_lihb 2019-08-23 15:14 評論0 收藏0
決勝未來，2019年前端開發十大戰略性技術布局

摘要：為什么以前個人團隊的工作，現在你一個人操作就做了，你覺得工資給你翻三倍過分嗎年，第九個需要布局的技術物聯網將推進了服務器端，而不是桎梏與瀏覽器。 2010年的你，如果能學會Android開發，現在的你，薪資不會低于年薪50萬…… 2015年的你，如果能熟練使用react，現在的你，薪資不會低于月薪30K…… 看到這兩個數據，也許有人會反駁：技術剛出來，沒人敢用，而且隨便一門技術，用上三...

LeanCloud 2019-08-23 15:13 評論0 收藏0
2019 Java 全棧工程師進階路線圖，一定要收藏

摘要：結合我自己的經驗，我整理了一份全棧工程師進階路線圖，給大家參考。乾坤大挪移第一層第一層心法，主要都是基本語法，程序設計入門，悟性高者十天半月可成，差一點的到個月也說不準。技術更新日新月異，對于初入職場的同學來說，經常會困惑該往那個方向發展，這一點松哥是深有體會的。我剛開始學習 Java 那會，最大的問題就是不知道該學什么，以及學習的順序，我相信這也是很多初學者經常面臨的問題。?我...

wangdai 2019-08-16 18:34 評論0 收藏0