在前端技術(shù)眼花繚亂的時代，作為一個小白該如何學(xué)習(xí)、提高?在這里我結(jié)合自己的十年從業(yè)經(jīng)歷，來簡單分享一下自己的經(jīng)驗看法。

淺談前端

一、關(guān)于前端

我們必須糾正一下大家對于前端固有的錯誤印象。很多人總是以為前端人員就是寫寫頁面這么簡單，其實不是這樣的，現(xiàn)代的前端崗位是一個綜合素質(zhì)要求很高的行業(yè)。

前端工程師

首先，作為前端程序員，不僅要掌握開發(fā)語言、數(shù)據(jù)結(jié)構(gòu)、算法等編程素養(yǎng)，現(xiàn)在的前端應(yīng)用場景復(fù)雜程度非常高，這就要求我們必須像后端程序員那樣，具備很高的軟件架構(gòu)能力。

其次，前端的程序是直接跟用戶交互的，現(xiàn)在的互聯(lián)網(wǎng)競爭激烈，產(chǎn)品是否美觀、操作是否友好，是吸引用戶的重要因素，所以，還必須具備UI、美工、用戶體驗等多方面的設(shè)計能力。

最后，很多情況下，前端工程師要參與到產(chǎn)品運營推廣工作中，這又要求總結(jié)、歸納、文案寫作等能力，甚至是對數(shù)據(jù)的統(tǒng)計、分析能力等等。

有了對前端工作的正確認知后，我們接下來開始具體講解。

二、技術(shù)學(xué)習(xí)路線

前端小白最好給自己規(guī)劃一條合適的技術(shù)學(xué)習(xí)路線，以下是我個人的技術(shù)發(fā)展過程，我覺得還是能適合大多數(shù)的前端人員：

1.基礎(chǔ)掌握

前端開發(fā)三劍客必須掌握：html、css、javascript。html負責(zé)組織頁面結(jié)構(gòu)及數(shù)據(jù)的承載，css是對外觀顯示效果的處理，javascript則是對行為、業(yè)務(wù)邏輯的處理。這些基礎(chǔ)知識經(jīng)過長期的迭代，目前已經(jīng)發(fā)展到html5、css3、es6，大家必須掌握好。

2.進階能力

對于進階知識學(xué)習(xí)，這里推薦大家一些組件庫、UI庫，例如jquery或zepto(雖然他們以后會被取代)、ajax、bootstrap、less、sass等，這些內(nèi)容的學(xué)習(xí)，不僅能直接提升你對基礎(chǔ)知識的掌握、提高開發(fā)效率，并且能夠?qū)崿F(xiàn)大部分傳統(tǒng)web應(yīng)用場景的開發(fā)。

3.前端框架

這里的框架，指的是架構(gòu)級別的基礎(chǔ)框架，它必須對前端開發(fā)的各個方面提供支持，主流的框架以Vue、React、Angular為代表，這里推薦大家學(xué)習(xí)Vue，它提供了模板語法、組件、路由、監(jiān)聽、狀態(tài)等一整套方案?？蚣艿膶W(xué)習(xí)，讓我們的編程思維得到更大的提升，對模塊化、組件化、mvvm的開發(fā)思想會有新的認識。

4.前端工程化

現(xiàn)在越來越流行用工程化思想，來管理前端項目，這里的推薦組合是nodejs+webpack。通過webpack自動化搭建項目架構(gòu)、組件安裝及管理、測試管理以及代碼壓縮、混淆、編譯、打包等。甚至跟一些諸如基于Vue的腳手架工具配合使用，能夠搭建起開箱即用的項目架構(gòu)。

5.技術(shù)加持

建議大家對諸如微信公眾號、微信小程序等跟前端相關(guān)技術(shù)的學(xué)習(xí)，對自己的技術(shù)能力是很好的加持。

6.全棧開發(fā)

學(xué)有余力的同學(xué)，可以考慮一下全棧開發(fā)，目前阿里云和騰訊云等，提供了基于nodejs的云開發(fā)環(huán)境(云函數(shù)、云數(shù)據(jù)庫、云存儲等)，可直接使用前端的js技術(shù)進行后端開發(fā)。

三、開發(fā)工具

俗話說，工欲善其事、必先利其器，下面對前端開發(fā)中的一些工具進行簡單介紹：

1.WebStorm

被稱為Web前端開發(fā)神器，對初學(xué)者非常友好，默認就提供了強大的功能，不需要像其它工具那樣進行大量的插件安裝，建議剛接觸前端開發(fā)的同學(xué)使用。但是，這款工具比較消耗性能，內(nèi)存占用大。

2.Sublime

這是我使用過的最輕量化的前端開發(fā)工具，對性能要求比較高的同學(xué)的首選，需要手動進行插件安裝配置，才能發(fā)揮出強大的功能。

3.Vscode

這個是我個人強烈推薦的，除了性能外，各方面都比Sublime強大，特別是操作體驗、習(xí)慣適合大部分人，另外，它還能用于c++/java等的開發(fā)。

四、前端發(fā)展方向

1.Web開發(fā)

Web開發(fā)自然是不用多說，不僅能進行電腦端網(wǎng)站開發(fā)，由于HTML5的響應(yīng)式、移動適配能力，也能開發(fā)手機端的網(wǎng)頁。

2.游戲開發(fā)

HTML5游戲開發(fā)，游戲開發(fā)向來都是很有前景的方向，這方面需要掌握html5的canvas、WebGL、SVG等技術(shù)，以及一些html5的游戲引擎。

3.多屏多端開發(fā)

現(xiàn)在的前端，已經(jīng)可以用于Android應(yīng)用、IOS應(yīng)用、微信小程序、支付寶小程序等不同操作系統(tǒng)、不同應(yīng)用平臺的開發(fā)，甚至可以做到一套代碼，就能發(fā)布為不同平臺的應(yīng)用。有興趣多屏多端開發(fā)的同學(xué)，推薦學(xué)習(xí)uni-app框架。

另外，除了流行的移動端開發(fā)，通過Electron框架，也能使用前端技術(shù)，進行桌面端程序的開發(fā)。