隨著Web前端的飛速發(fā)展,學(xué)習(xí)web前端的人員也是越來越多,在移動(dòng) 互聯(lián)網(wǎng) 時(shí)代,相信我們每個(gè)人的手機(jī)上都裝有數(shù)十個(gè)APP,這些APP的開發(fā)其實(shí)也和當(dāng)下熱門的 Web 前端開發(fā)息息相關(guān)。事實(shí)上,如今一半以上的APP都是采用Hybrid混合模式開發(fā),即結(jié)合安卓和Web端技術(shù)開發(fā)。而純 Web開發(fā) 的APP也不在少數(shù),除了APP,我們在手機(jī)端??吹降腍5頁面,也是主要運(yùn)用了Web端的 HTML5 技術(shù)開發(fā)。 當(dāng)然,Web前端現(xiàn)在也不僅僅局限于前端網(wǎng)頁和APP,服務(wù)器端、桌面級應(yīng)用甚至是VR都有涉及。首先講一下Web前端開發(fā)所需要的知識技能及學(xué)習(xí)路徑。
1. HTML5 + CSS3 + JavaScript
Web開發(fā)基礎(chǔ)中的基礎(chǔ),HTML是負(fù)責(zé)網(wǎng)頁結(jié)構(gòu),CSS負(fù)責(zé)網(wǎng)頁樣式,JS則負(fù)責(zé)邏輯交互。前兩者更像是標(biāo)記語言,沒有什么邏輯,JS才是前端的重中之重。 HTML5 新增的技術(shù)大部分需要結(jié)合JS學(xué)習(xí)。
每個(gè)人學(xué)習(xí)進(jìn)度可能不同,這個(gè)階段主要是多仿站,熟悉基礎(chǔ),試試用CSS寫響應(yīng)式頁面,了解JS深入性的知識,比如原型鏈、閉包、 設(shè)計(jì)模式 等需要更多的積累,逐漸理解并實(shí)踐掌握。
2. JQuery + BootStrap + Ajax + Json
jQuery是JS的一個(gè)應(yīng)用庫,能夠提升原生JS開發(fā)效率。Bootstrap則是響應(yīng)式框架,更簡單的實(shí)現(xiàn)手機(jī)/平板/PC多個(gè)設(shè)備的頁面支持。Ajax技術(shù)用于異步交互,不刷新頁面就能更新數(shù)據(jù),比如
地圖 應(yīng)用等。Json是一種數(shù)據(jù)格式,被廣泛應(yīng)用在各大編程語言中。
jQuery 和 bootstrap 會(huì)簡化很多編寫的代碼量,用著不亦樂乎,但對于基礎(chǔ)還不是很扎實(shí)的人建議還是少用。 Ajax 和 json 通常用于和后端交互,在實(shí)際業(yè)務(wù)中也經(jīng)常用到。
3. Git/SVN
版本管理工具,主要用于團(tuán)隊(duì)開發(fā)時(shí)避免文件沖突,也可回檔。前端推薦學(xué)習(xí)Git。
4. Nodejs + Mysql /MongoDB(可選)
運(yùn)行在服務(wù)器端的JavaScript。Express是其拓展MVC框架。其中nodejs常用到的就是npm包管理器,不用到各個(gè)網(wǎng)站去下載資源包。
數(shù)據(jù)庫 的學(xué)習(xí)可以選擇MongoDB或者M(jìn)ySQL,前者與Nodejs的契合度更好,不過現(xiàn)在大多數(shù)網(wǎng)站都是 PHP
+Mysql的組合,如果有學(xué)PHP的打算的話,可以先學(xué)習(xí) Mysql 。
5. ECMAScript 6
JavaScript 的語言標(biāo)準(zhǔn)。ES6中加入了很多新的概念,也彌補(bǔ)了之前版本中JS的很多缺陷,越來越多的項(xiàng)目開始運(yùn)用ES6進(jìn)行開發(fā)。學(xué)之前把ES5先搞懂了,目前實(shí)際項(xiàng)目中考慮到兼容性,ES6是需要通過Babel將其編譯為ES5來部署的。
6. Angular/React/Vue
前端三大框架,各自也有著各自的生態(tài)系統(tǒng),根據(jù)需求自行選擇學(xué)習(xí)。目前企業(yè)需求量較大的仍然是Angular,但近期趨勢來看react和vue則更受歡迎。因?yàn)楝F(xiàn)在前端技術(shù)發(fā)展太過于突飛猛進(jìn),工具和框架的更新比翻書還快,建議學(xué)習(xí)還是看文檔比較好。學(xué)習(xí)過程中也會(huì)遇到很多用到各種構(gòu)建工具的時(shí)候。
7. 其他常用工具
這個(gè)一樣是根據(jù)需求自行選擇學(xué)習(xí)。比較常用的現(xiàn)在有 Web
pack,可以將多個(gè)不同編程風(fēng)格的文件打包,比如ES6/AMD/CMD之類的模塊化都能識別并編譯成 瀏覽器
能運(yùn)行的文件。Sass/Less,CSS預(yù)編譯框架,可以用帶有邏輯性的方式編寫CSS代碼。Gulp/Grunt構(gòu)建工具,可以自動(dòng)化對代碼進(jìn)行壓縮合并等工作。
8. 其他后端編程語言
目前市場對前端基本都要求會(huì)一門后端語言, PHP / JAVA / Nodejs / Python 等。
學(xué)習(xí)編程重要的還是實(shí)踐,多敲代碼,多去嘗試。獨(dú)立解決問題的能力、探究鉆研的精神是必不可少的。有興趣的話也可以自己搭建一個(gè)技術(shù)博客 ,往 github上傳幾個(gè)開源項(xiàng)目,這些都是不錯(cuò)的加分點(diǎn)。