全國(guó)統(tǒng)一學(xué)習(xí)專線 9:00-21:00
所有知識(shí)框架，那肯定是一個(gè)結(jié)構(gòu)型的展現(xiàn)，就是一棵樹(shù)。web前端的知識(shí)點(diǎn)非常多，也非常散，需要好幾層結(jié)構(gòu)來(lái)組織這個(gè)體系，否則就會(huì)顯得很亂。那么如何組織、把誰(shuí)和誰(shuí)放在一塊兒？這是真正值得我們?nèi)ニ伎嫉?，你也可以自己?lái)思考一下這個(gè)問(wèn)題。
在我總結(jié)的這個(gè)知識(shí)框架中，首先*層我劃分為：理論知識(shí)，類庫(kù)框架，編碼開(kāi)發(fā)，運(yùn)行環(huán)境。如下圖：
接下來(lái)給大家解釋一下：
這個(gè)圖要從下往上看，為何？——因?yàn)橄旅媸巧厦娴幕A(chǔ)；
首先，我們需要一定的理論知識(shí)，不管是你聽(tīng)別人講授、自己看書(shū)還是網(wǎng)上淘資料，你都需要一定的理論知識(shí)，每一種程序開(kāi)發(fā)，都避免不了。
第二，有了這些理論知識(shí)我們就可以編碼了——不錯(cuò)——but，沒(méi)有人能抵擋住第三方框架和類庫(kù)的誘惑，例如jquery；
第三，有了這些理論知識(shí)和協(xié)助我們的類庫(kù)框架，我們就可真正的編碼了。大家可能以為編碼開(kāi)發(fā)不就是寫(xiě)代碼嗎，還有啥？——這里面道道多著呢；
*，開(kāi)發(fā)程序的目的，最終是為了能高效、穩(wěn)定的運(yùn)行在相應(yīng)的環(huán)境中，這其中又有哪些事情需要我們?nèi)プ?？?qǐng)期待；
理論知識(shí) 包括“軟知識(shí)”和“硬知識(shí)”
“軟知識(shí)”和“硬知識(shí)”大家可能覺(jué)得詞陌生，其實(shí)我一說(shuō)大家就能明白。
所謂“軟”的就是能在各個(gè)程序開(kāi)發(fā)中都用到的，算是基本功、內(nèi)功，例如數(shù)據(jù)結(jié)構(gòu)、算法、設(shè)計(jì)模式、面向?qū)ο蟮鹊龋?/p>
所謂“硬”的就是能直接用于本程序開(kāi)發(fā)的。用C語(yǔ)言你就得學(xué)C語(yǔ)言語(yǔ)法，此時(shí)學(xué)java沒(méi)用。我們web前端開(kāi)發(fā)所需要的硬知識(shí)其實(shí)都包含在三個(gè)標(biāo)準(zhǔn)里面：http標(biāo)準(zhǔn)、W3C標(biāo)準(zhǔn)和標(biāo)準(zhǔn)；
聊一聊web前端開(kāi)發(fā)中的“硬知識(shí)”
“軟知識(shí)”的內(nèi)容非常多，也是我們*時(shí)代學(xué)習(xí)的重點(diǎn)（沒(méi)學(xué)好是另回事兒，畢業(yè)再惡補(bǔ)）。我們本次主要討論的是web前端這一個(gè)方向，因此就點(diǎn)到為止，讓大家知道這些知識(shí)也在知識(shí)體系中扮演重要角色。
剛才說(shuō)道，硬知識(shí)有三個(gè)標(biāo)準(zhǔn)：http標(biāo)準(zhǔn)、W3C標(biāo)準(zhǔn)和標(biāo)準(zhǔn)，那咱們就挨個(gè)聊聊這三個(gè)標(biāo)準(zhǔn)。
1. http標(biāo)準(zhǔn)
為什么做web前端要了解http標(biāo)準(zhǔn)？——因?yàn)闉g覽器要從服務(wù)端獲取網(wǎng)頁(yè)，網(wǎng)頁(yè)也可能將信息再提交給服務(wù)器，這其中都有http的連接。web系統(tǒng)既然和http鏈接有瓜葛，你就必須去了解它。
我的意見(jiàn)是：你不必去非常了解http的詳細(xì)內(nèi)容，但是你要了解web前端開(kāi)發(fā)常用的一些http的知識(shí)——就是上圖中我列出來(lái)的那些。當(dāng)然，我知識(shí)列了一個(gè)綱，詳細(xì)內(nèi)容還得靠你自己去查閱（本文章講的是知識(shí)框架，不會(huì)涉及任何知識(shí)點(diǎn)的詳細(xì)內(nèi)容）
關(guān)于這方面的知識(shí)，建議去查閱《圖解http》這本書(shū)，淺顯易懂的講述了這些內(nèi)容，我曾經(jīng)也看過(guò)。
2.W3C標(biāo)準(zhǔn)
如果說(shuō)你只知道web前端的一個(gè)標(biāo)準(zhǔn)，估計(jì)肯定是W3C標(biāo)準(zhǔn)了（據(jù)我了解，貌似大部分人真的都只知道這一個(gè)標(biāo)準(zhǔn)）。它的內(nèi)容非常多，看看www.w3.org/TR/這個(gè)頁(yè)面。
寫(xiě)到這里讓我想起了一句話：2/8原則——20%的功能滿足80%的需求。我覺(jué)得這句話用到這里非常合適，我們?cè)谄綍r(shí)開(kāi)發(fā)過(guò)程中根本用不到這么多東西。反而，你要把平時(shí)用的多的東西搞懂了。
下圖的這些知識(shí)，我想不用再過(guò)多解釋了，這就是我文章開(kāi)發(fā)說(shuō)的“三大塊”（html、css、js）?，F(xiàn)在你要知道，它們只不多是W3C標(biāo)準(zhǔn)的一部分，而W3C標(biāo)準(zhǔn)也只是web前端開(kāi)發(fā)知識(shí)體系中的一部分而已。
（下圖沒(méi)有完全展開(kāi)，想看權(quán)展開(kāi)的圖，可下載本文一開(kāi)始提供的附件）
關(guān)于CSS的基礎(chǔ)知識(shí)，毛遂自薦一下自己之前的一篇系列博客：《CSS知多少》
3.
簡(jiǎn)稱ES，寫(xiě)全稱太麻煩了。
有些人可能只知道，而不知道ES——其實(shí)，js是在ES的基礎(chǔ)上，為web瀏覽器做了一部分封裝（增加了DOM操作、BOM操作等）。
如上圖中的這些概念，大家可能平時(shí)都在中看到，其實(shí)他們是ES的內(nèi)容。只不過(guò)繼承了ES的這些特性，并且用的比較廣泛，因此才會(huì)在js中討論的多一些。
還是那個(gè)“2/8原則”。其實(shí)ES中的內(nèi)容也非常多，而且更新很快，現(xiàn)在都到ES6了。但是我上圖中列出來(lái)的這些都是最重要的概念。如果你不懂原型、閉包和作用域，那就說(shuō)明你還不完全了解ES，也就是不完全會(huì)用。
在此毛遂自薦自己之前的一篇系列博客，大家可以去參考：《深入理解原型和閉包系列》
5. 框架和類庫(kù)
前面已經(jīng)描述完了web前端開(kāi)發(fā)所需要的理論知識(shí)。如何實(shí)踐呢？——不能蠻干——還得繞世界去看看，有哪些大牛已經(jīng)為我們做出了如此多的貢獻(xiàn)。
用下面的這些類庫(kù)或者框架，能大大提高你的開(kāi)發(fā)效率。
首先，jquery一定是大部分web前端開(kāi)發(fā)者不可或缺的工具。而我利用jquery不僅僅停留在只使用它的API和插件上，我還會(huì)自己去寫(xiě)jquery插件，我還會(huì)去讀jquery的源碼、了解jquery的設(shè)計(jì)思路。如果你也能那樣做，請(qǐng)相信我，你會(huì)收獲到意想不到的效果。如果有一個(gè)問(wèn)題：怎樣才能最最透徹的理解的事件系統(tǒng)？*答案之一：讀幾遍（一遍可能讀不懂）jquery關(guān)于事件處理部分的源碼！
bootstrap不用再過(guò)多解釋了吧，從github上的排名也能看出道道來(lái)。甚至連我們公司的UI設(shè)計(jì)師，都從bootstrap上截圖作為素材。
是全世界最強(qiáng)大的圖標(biāo)系統(tǒng)。相比于css制作圖標(biāo)來(lái)說(shuō)，這個(gè)要好很多倍，不管是開(kāi)發(fā)、效率還是維護(hù)上。icomoon.io能讓我自定義選擇自己的圖標(biāo)文件。
requirejs和seajs這種模塊定義系統(tǒng)，也一定是你系統(tǒng)中不可或缺的。我曾經(jīng)看過(guò)一個(gè)教程，講師就說(shuō)：requirejs帶來(lái)了既jquery之后的第二次前端技術(shù)變革。
其他的，backbone、angular、react這些也慢慢的開(kāi)始發(fā)揮了他們的價(jià)值，此處精力有限就不再贅述了——但是，他們很重要——你至少要試著去了解它們。
6. 編碼開(kāi)發(fā)
要問(wèn)編碼IDE哪家強(qiáng)，當(dāng)然要屬微軟的visual studio！但是即便是微軟的VS*版本，它也代替不了下面要說(shuō)的這套開(kāi)發(fā)環(huán)境。
如果你專門(mén)做web前端，就不要在用vs了，當(dāng)然要選擇sublime。寫(xiě)html語(yǔ)句還用手動(dòng)一條一條寫(xiě)嗎？你得需要zencoding的協(xié)助，否則效率太差了。
另外，針對(duì)html、css、js的壓縮、合并、語(yǔ)法檢查，文件的清除、復(fù)制這些操作，你還要手動(dòng)去做嗎？——你需要grunt或者gulp的幫助。
在此毛遂自薦自己的教程《用grunt搭建自動(dòng)化web開(kāi)發(fā)環(huán)境》，講的比較詳細(xì)，適合初學(xué)者學(xué)習(xí)。
如果你的系統(tǒng)中有比較多的js代碼或者文件，請(qǐng)選擇一個(gè)合適的模塊定義規(guī)范——CMD / AMD
請(qǐng)用git來(lái)幫助你做文件版本管理，最簡(jiǎn)單的就是使用github。
調(diào)試、測(cè)試，也都有專門(mén)的工具，都是需要學(xué)的……
——我的天哪……這些字寫(xiě)到現(xiàn)在寫(xiě)的我的手都酸了，別說(shuō)要學(xué)習(xí)這些知識(shí)了——再也別說(shuō)我們web前端是“三大塊”了！
7. 運(yùn)行環(huán)境
當(dāng)系統(tǒng)真正到了運(yùn)行環(huán)境中，當(dāng)你覺(jué)得終于完事兒的時(shí)候，其實(shí)還有好幾個(gè)知識(shí)點(diǎn)需要你掌握。看下圖：
首先，你要知道web系統(tǒng)雖然大部分是在瀏覽器下運(yùn)行，但是js可能會(huì)被運(yùn)行在node環(huán)境。
在瀏覽器環(huán)境下，最重要的兩點(diǎn)是：web安全和性能優(yōu)化。需要注意的綱要我都列出來(lái)了，如果想了解推薦兩本書(shū)《白帽子將web安全》《高性能網(wǎng)站建設(shè)指南》
8. 其他
以上這些是全部的知識(shí)體系。如果你想成為一名合格的、讓leader喜歡的程序猿，你除了知道這些知識(shí)之外，我覺(jué)得還需要以下幾點(diǎn)：
要了解敏捷軟件開(kāi)發(fā)流程（如SCRUM）和項(xiàng)目管理知識(shí)（如考取PMP），這也屬于一種“軟”知識(shí)吧；
要學(xué)會(huì)在網(wǎng)上和別人交流（博客、qq群、開(kāi)源項(xiàng)目），交流能讓自己看到自己的不足；
要學(xué)會(huì)自我反省和自我學(xué)習(xí)。就像我現(xiàn)在一樣，試著自己總結(jié)一下屬于自己的東西，隨時(shí)反省隨時(shí)進(jìn)步
Web前端可以做的工作，可以分為以下幾點(diǎn)：
Web前端是網(wǎng)站前臺(tái)部分，運(yùn)行在PC端，移動(dòng)端等瀏覽器上展現(xiàn)給用戶所瀏覽的網(wǎng)頁(yè)。
用我們的話來(lái)說(shuō)，前端就是網(wǎng)頁(yè)給訪問(wèn)網(wǎng)站的人看的內(nèi)容和頁(yè)面，Web前端開(kāi)發(fā)意思就是這些內(nèi)容的制作，也就是代碼的實(shí)現(xiàn)。
WEB前端
簡(jiǎn)而言之Web前端就是實(shí)現(xiàn)客戶端（手機(jī)和電腦）上看到的頁(yè)面和一些交互效果（比如點(diǎn)擊、查看詳情、查看更多）等，從事WEB網(wǎng)頁(yè)開(kāi)發(fā)、HTML5頁(yè)面開(kāi)發(fā)。
2、Web前端開(kāi)發(fā)具體要做什么前端開(kāi)發(fā)最主要的是掌握三種基本能力，HTML、CSS，。前端的開(kāi)發(fā)中，在頁(yè)面的布局時(shí)， HTML將元素進(jìn)行定義，CSS對(duì)展示的元素進(jìn)行定位，再通過(guò)實(shí)現(xiàn)相應(yīng)的效果和交互。
Web 前端開(kāi)發(fā)三大技術(shù) html，css，js
還運(yùn)用大量的 js 庫(kù)，可以將前端的交互效果做得更加炫酷，除了基本語(yǔ)言，還要掌握各種開(kāi)發(fā)工具的應(yīng)用。：，Sublime，HBuilder等都是比較熱門(mén)的工具。
前端開(kāi)發(fā)需要掌握的能力很多，知識(shí)范圍很廣，要付出的代價(jià)很多。不過(guò)，前端的前途也是相當(dāng)光明的，前端現(xiàn)在正在走向工程化發(fā)展，無(wú)論權(quán)是大小公司企業(yè)，對(duì)前端開(kāi)發(fā)的需求都是越來(lái)越大了，也越來(lái)越專業(yè)了。
Web 前端除了最基本的 html，css，js 還有大量的技術(shù)內(nèi)容，也會(huì)運(yùn)用到一定的框架，而朗沃教育的 WEB 前端開(kāi)發(fā)一般會(huì)學(xué)到這些內(nèi)容。
HTML/CSS 基礎(chǔ)和高級(jí)
基礎(chǔ)語(yǔ)法和高級(jí)應(yīng)用
Node 服務(wù)端開(kāi)發(fā)
Web前端框架開(kāi)發(fā)（React 技術(shù)棧，Vue 技術(shù)棧）
移動(dòng)端開(kāi)發(fā)（React Native，跨端開(kāi)發(fā)框架之微信小程序開(kāi)發(fā)，F(xiàn)lutter，PWA 等）
前端運(yùn)維（Docker 與 Linux 基本操作等）
詳細(xì)課程請(qǐng)瀏覽朗沃教育Web前端課程。
WEB前端是什么？零基礎(chǔ)可以學(xué)嗎？初期階段只是了解一些Web前端基礎(chǔ)內(nèi)容，后面會(huì)涉及到一些Web前端交互的內(nèi)容，再涉及到服務(wù)器的一些知識(shí)，*再學(xué)習(xí)Web前端的三大框架，再加上一些前端項(xiàng)目。
1、行業(yè)發(fā)展好。
就說(shuō)我們目前*所有行業(yè)，可以說(shuō)任何一個(gè)行業(yè)都離不開(kāi)互聯(lián)網(wǎng)，現(xiàn)在的人們對(duì)于互聯(lián)網(wǎng)的依賴很大，互聯(lián)網(wǎng)行業(yè)在*無(wú)疑是現(xiàn)在發(fā)展前景*的沒(méi)有之一。web前端現(xiàn)在雖然競(jìng)爭(zhēng)大，剛開(kāi)始工作并不是那么好找，但是它未來(lái)所需要的人才是可觀的，只有你擁有這個(gè)技術(shù)，作為web互聯(lián)網(wǎng)+時(shí)代，用戶體驗(yàn)現(xiàn)在成為了企業(yè)的*標(biāo)準(zhǔn)，web前端當(dāng)然待遇是水漲船高的。
2、人才需求大。
現(xiàn)在的人們離不開(kāi)手機(jī)，我們現(xiàn)在手機(jī)的各種應(yīng)用都是用代碼寫(xiě)成的，互聯(lián)網(wǎng)對(duì)人們的影響越來(lái)越大，根據(jù)新聞報(bào)道未來(lái)*20年，需要軟件開(kāi)發(fā)，美工設(shè)計(jì)，web前端開(kāi)發(fā)人才2000W人才，各類職業(yè)也需求更多，前端的人才需求比以前也有了質(zhì)的飛躍。
3、薪資待遇高。
web前端開(kāi)發(fā)工程師的薪資待遇平均工資已經(jīng)突破一萬(wàn)，因?yàn)槠渌袠I(yè)確實(shí)工資漲幅不大，所以必然會(huì)吸引了大批想要月薪過(guò)萬(wàn)的人來(lái)轉(zhuǎn)行學(xué)習(xí)。我想引用喬布斯的一句話：WEB就是人類的未來(lái)，我們身為前端開(kāi)發(fā)工作者也是未來(lái)，相信WEB前端開(kāi)發(fā)的明天會(huì)更好。
二? ? 零基礎(chǔ)小白應(yīng)該怎么學(xué)習(xí)前端才能少走彎路？? ? 關(guān)于前端這一塊的學(xué)習(xí)，我不主張自學(xué)，因?yàn)榍岸说闹R(shí)體系是很龐大的，如果你自學(xué)，遇到一些問(wèn)題，你自己很難解決，至少需要有專業(yè)的前端人士指導(dǎo)你，站在高手的肩膀上，才能看的更高更遠(yuǎn)，當(dāng)然很多小伙伴會(huì)說(shuō)，我也知道學(xué)習(xí)前端有高手指點(diǎn)挺好啊，可是我怎么知道去哪里找高手，高手又為什么愿意指導(dǎo)我呢？
? ?這個(gè)問(wèn)題問(wèn)的好，其實(shí)現(xiàn)在是互聯(lián)網(wǎng)時(shí)代，網(wǎng)上有很多的相關(guān)視頻和直播課，我平時(shí)就經(jīng)常去上網(wǎng)聽(tīng)一些前端高手講課。我可以給大家分享一下我在網(wǎng)上聽(tīng)課的地方，老師挺厲害的，每天晚上在網(wǎng)上免費(fèi)講兩個(gè)小時(shí)的直播課，也很適合零基礎(chǔ)小白，講的很透徹通俗易懂，讓人感覺(jué)，原來(lái)前端是這么回事，沒(méi)有想象的那么難，想聽(tīng)前端直播課的同學(xué)，可以進(jìn)入他的前端教程資料裙：首先位于開(kāi)頭的一組數(shù)字是：655，其次處于中間地帶的一組數(shù)字是：567，*位于尾部的一組數(shù)字是：613，把以上三組數(shù)字按照先后順序組合起來(lái)即可。作為想從事前端這個(gè)行業(yè)的小伙伴，一定要有一個(gè)平常心，只要能學(xué)到知識(shí)，去學(xué)就是了，不要磨磨唧唧的的做什么事情，否則什么也做不好。
三? 學(xué)習(xí)前端，你需要具備哪些素質(zhì)？（1）如果web的任何一個(gè)元素（web界面，靈活的編程風(fēng)格等）有一點(diǎn)吸引了你，讓你著實(shí)著迷，恭喜你，有了一個(gè)完美的開(kāi)始。確認(rèn)一下自己是否喜歡和合適前端，而不是為了一份看起來(lái)體面而且薪水不菲的工作。
（2）不斷學(xué)習(xí)，每日的積累，關(guān)注前端動(dòng)態(tài)，是你跟上前端潮流的主要途徑。前端的體系過(guò)于龐大，技術(shù)框架爭(zhēng)涌而出，如果你經(jīng)常抱怨累死碼農(nóng)的節(jié)奏，那就審視一下自己對(duì)前端的態(tài)度。
（3）主抓基礎(chǔ)，避免盲目。前端領(lǐng)域知識(shí)點(diǎn)很多，值得學(xué)的東西也很多，聰明的人懂得花時(shí)間學(xué)習(xí)成體系的知識(shí)并且研究得足夠深入，而不是盲目的看到別人用什么框架就去學(xué)什么。只停留在實(shí)踐運(yùn)用的階段，到頭來(lái)框架們都一個(gè)一個(gè)被淘汰，你仍在原地踏步。
（4）整理總結(jié)，先模仿后創(chuàng)造。將每日的積累做好規(guī)整，記錄到博客也好，筆記也好。多看看牛人的源代碼，等你達(dá)到了一定的層次水準(zhǔn)，自然會(huì)得心應(yīng)手。
（5）持有一顆造福前端社區(qū)的心。寫(xiě)一些有意思的小工具、插件，推廣出去， 始終堅(jiān)信，在從事前端的道路上You are not alone。
（6）要有專業(yè)人士的指導(dǎo)，尤其是學(xué)習(xí)前端找工作的，不要妄想自己一個(gè)人自學(xué)前端能找到工作，現(xiàn)在非常難，如果沒(méi)有一個(gè)明白人幫你解決一下問(wèn)題，會(huì)有非常多的彎路，中間很容易放棄，學(xué)習(xí)的不專業(yè)不說(shuō)，最重要是浪費(fèi)時(shí)間。
（7）一個(gè)好的心態(tài)和一個(gè)堅(jiān)持的心很重要，很多沖著高薪的人想學(xué)習(xí)前端，但是能學(xué)到*的沒(méi)有幾個(gè)，遇到困難就放棄了，這種人到處都是，就是因?yàn)橛械臇|西難，所以他的回報(bào)才很大，我們?cè)u(píng)判一個(gè)前端開(kāi)發(fā)者是什么水平，就是他解決問(wèn)題的能力有多強(qiáng)。
*，基礎(chǔ)部分的學(xué)習(xí)。
主要就是html、css、Java。這個(gè)其實(shí)不用多講，這些個(gè)基礎(chǔ)不學(xué)扎實(shí)了什么也干不了，可以直接從html5、css3、ES5來(lái)學(xué)習(xí)。
第二，與美工相關(guān)、后端開(kāi)發(fā)、設(shè)計(jì)相關(guān)的學(xué)習(xí)。
想做好Web前端開(kāi)發(fā)，一定搞清楚自己的工作界面在什么地方，這對(duì)你有很大幫助。每個(gè)公司可能都不一樣，所以了解邊界相關(guān)的知識(shí)就很重要。
美工相關(guān)，主要是說(shuō)ps、切圖之類的東西，photoshop還是需要會(huì)用的，至于說(shuō)你能不能搞出漂亮的圖片來(lái)那倒不是重點(diǎn)，關(guān)鍵點(diǎn)是體會(huì)美工的工作過(guò)程。如果你在公司兼了這件事，那你就得深入的學(xué)習(xí)了，別不以為然，前端的美術(shù)有修養(yǎng)還是挺重要的。
后端開(kāi)發(fā)，雖說(shuō)一般情況下，前端開(kāi)發(fā)和后端開(kāi)發(fā)是分開(kāi)的，不過(guò)二般情況也很多。這個(gè)時(shí)候就需要你在后端中選擇一條主線，很多人都在比較PHP、Python、Node.js哪種好，其實(shí)都差不多，不過(guò)從市場(chǎng)上的熱度來(lái)說(shuō)視乎Node.js更熱一些，當(dāng)然Node.js對(duì)js熟悉的前端來(lái)說(shuō)也更容易上手。
相關(guān)標(biāo)準(zhǔn)，標(biāo)準(zhǔn)這個(gè)東西很多人都很不屑。其實(shí)很重要，越大的團(tuán)隊(duì)越重要。還是熟悉熟悉養(yǎng)成好的習(xí)慣微妙。這在初期至少涉及到很多兼容性問(wèn)題，所以W3C的標(biāo)準(zhǔn)是必須了解和掌握的。
第三，各種框架類庫(kù)的學(xué)習(xí)。
jquery，bootstrap等，現(xiàn)在的框架比較多，但是jquery和bootstrap這樣級(jí)別的必須得熟練掌握，要不很多公司都沒(méi)法干活。一般類庫(kù)和框架都有垂直的網(wǎng)站可以學(xué)習(xí)，如bootstrap中文網(wǎng)之類的都很不錯(cuò)。
第四，對(duì)于工具的學(xué)習(xí)。
如Git、webpack、Gulp、github、Nginx 等等。工具本身實(shí)際上不學(xué)也能干活，從學(xué)習(xí)的角度來(lái)說(shuō)，這個(gè)時(shí)間的分配上可以少一點(diǎn)兒，但是從工作的角度來(lái)說(shuō)，如果需要的話要盡快上手，逐步熟悉。工具類的東西都不是特別難上手，幾天可能就差不多了，但是想玩的透，極大的提高效率這個(gè)還是需要投入不少時(shí)間的。
web前端開(kāi)發(fā)主要是通過(guò)html，css,js,ajax,DOM等前端技術(shù)，實(shí)現(xiàn)網(wǎng)站在客服端的正確顯示及交互功能。在眾多的前端開(kāi)發(fā)技術(shù)中，擊敗了Applet、，成為了當(dāng)下最“?！钡那岸思夹g(shù)！
在早期點(diǎn)Web前端不叫前端，而是被親切的叫做“網(wǎng)頁(yè)設(shè)計(jì)師”。
網(wǎng)頁(yè)三劍客（Flash、、Firewoks)并稱為的網(wǎng)頁(yè)制作三劍客，由于是同一公司的產(chǎn)品，因而在功能上有著一個(gè)非常緊密的結(jié)合。后來(lái)Firewoks被Adobe這個(gè)變態(tài)的巨頭收購(gòu)以后，ps就基本取代Firewoks來(lái)做設(shè)計(jì)網(wǎng)頁(yè)的工作了，雖然我知道現(xiàn)在還有人用，估計(jì)是一種懷念和某些好用的切圖功能吧。
前端工程師是互聯(lián)網(wǎng)時(shí)代軟件產(chǎn)品研發(fā)中不可缺少的一種專業(yè)研發(fā)角色。從狹義上講，前端工程師使用HTML、CSS、等專業(yè)技能和工具將產(chǎn)品UI設(shè)計(jì)稿實(shí)現(xiàn)成網(wǎng)站產(chǎn)品，涵蓋用戶PC端、移動(dòng)端網(wǎng)頁(yè)，處理視覺(jué)和交互問(wèn)題。從廣義上來(lái)講，所有用戶終端產(chǎn)品與視覺(jué)和交互有關(guān)的部分，都是前端工程師的專業(yè)領(lǐng)域。
實(shí)際上前端工程師最核心的技能還是：Html、CSS、JS，在一個(gè)典型的互聯(lián)網(wǎng)公司的產(chǎn)品研發(fā)流程中，前端工程師和其他角色的關(guān)系大致上是這樣的：
前端是最接近產(chǎn)品和設(shè)計(jì)的工程師，起到銜接產(chǎn)品和技術(shù)的作用，前端為用戶可以看到的部分負(fù)責(zé)，所以也是最接近用戶的工程師。
在多終端的時(shí)代，如果一個(gè)產(chǎn)品同時(shí)支持PC、移動(dòng)端，前端工程師還需要和更多的角色打交道：
前端要解決界面和交互問(wèn)題，實(shí)際上UI層面上的問(wèn)題一直是軟件工程方面的一個(gè)難題，因?yàn)閁I不停地在變化。瀏覽器各個(gè)版本的兼容性、Web標(biāo)準(zhǔn)、移動(dòng)設(shè)備、多終端適配，給了前端工程師很大的挑戰(zhàn)，對(duì)前端工程師的能力也有很高的要求。許多UI問(wèn)題有不只一種解決方法，許多問(wèn)題有非常巧妙的思路和精彩的解決辦法，前端在工程師群體里是屬于非常有創(chuàng)造力的一個(gè)群體，因?yàn)檫@個(gè)行業(yè)需要豐富的創(chuàng)造力和想象力。
前端工程師還是Web標(biāo)準(zhǔn)的制定者、實(shí)踐者和推動(dòng)者，而現(xiàn)在的W3C標(biāo)準(zhǔn)不僅僅局限于瀏覽器，還包括各種手持智能設(shè)備，車載設(shè)備、智能家居等等。在未來(lái)萬(wàn)物互聯(lián)的時(shí)代，前端將不僅僅是網(wǎng)頁(yè)上的工程師， 而是所有人機(jī)交互領(lǐng)域的工程師。
擴(kuò)展資料：
隨著互聯(lián)網(wǎng)的迅猛發(fā)展和普及，一個(gè)新型的行業(yè)和新興的職位正在上升到技術(shù)的層面：web前端開(kāi)發(fā)工程師
Web前端開(kāi)發(fā)工程師，除了主要職責(zé)外，還要為網(wǎng)站上提供的產(chǎn)品和服務(wù)實(shí)現(xiàn)一流的Web界面，優(yōu)化代碼并保持良好兼容性
Web前端表現(xiàn)層及與前后端交互的架構(gòu)設(shè)計(jì)和開(kāi)發(fā)
配合后臺(tái)開(kāi)發(fā)人員實(shí)現(xiàn)產(chǎn)品界面和功能
利用各種Web技術(shù)模擬開(kāi)發(fā)產(chǎn)品原型
Web新技術(shù)調(diào)研和資訊整理
精通HTML/XHTML、CSS，熟悉頁(yè)面架構(gòu)和布局，對(duì)Web標(biāo)準(zhǔn)和標(biāo)簽語(yǔ)義化有深入理解
熟悉Ajax、(或者)、DOM等前端技術(shù)，掌握面向?qū)ο缶幊趟枷?/p>
參考資料： web前端工程師_百度百科
只要一個(gè)電話
我們免費(fèi)為您回電
