可以搜索各大公司前端校招筆試面試題作為練習(xí)題或者他人總結(jié)的前端面試題還有個(gè)人總結(jié)的面試題(帶參考答案)
http://code.tutsplus.com有各種各樣的教程
MDN也有很多教程，更重要的是里面有詳細(xì)的文檔，需要查找某個(gè)功能時(shí)在Google搜索：xxx site:https://developer.mozilla.org
http://www5rocks.com/zh/也有很多優(yōu)質(zhì)教程
http://www.sitepoint.com/
http://alistapart.com/
原生javascript是需要重點(diǎn)掌握的技能，在掌握原生javascript的基礎(chǔ)上推薦熟練掌握jQuery，在實(shí)際工作中用處很大，這方面的書籍有《Learning jQuery》或者去jQuery官網(wǎng)
建一個(gè)https://github.com/賬號(hào)，保存平時(shí)學(xué)習(xí)中的各種代碼和項(xiàng)目。
有了一定基礎(chǔ)之后可以搭建一個(gè)個(gè)人博客，記錄學(xué)習(xí)過(guò)程中遇到的問(wèn)題和解決方法，方便自己查閱也為其他人提供了幫助。也可以去http://www.cnblogs.com/或者h(yuǎn)ttp://www.csdn.net/這樣的網(wǎng)站注冊(cè)賬號(hào)，方便實(shí)用
經(jīng)常實(shí)用Google搜索英文資料應(yīng)該經(jīng)常找到來(lái)自http://stackoverflow.com/的高質(zhì)量答案，與到問(wèn)題可以直接在這里搜索，如果有精力，注冊(cè)一個(gè)賬號(hào)為別人解答問(wèn)題也能極大提高個(gè)人能力。
經(jīng)典書籍熟讀之后，可以打開(kāi)前面必備基礎(chǔ)技能部分的鏈接。認(rèn)真讀對(duì)應(yīng)標(biāo)準(zhǔn)，全面掌握知識(shí)
繼續(xù)提高
有了前面的基礎(chǔ)之后，前端基本算是入門了，這時(shí)候可能每個(gè)人心中都有了一些學(xué)習(xí)方向，如果還是沒(méi)有。 可以參考前面必備技能部分提到的那兩個(gè)項(xiàng)目，從里面選一些進(jìn)行發(fā)展學(xué)習(xí)。以下是一些不錯(cuò)的方面：
Grunt：前端自動(dòng)化工具，提高工作效率
less css：優(yōu)秀的CSS預(yù)處理器
bootstrap：優(yōu)秀的CSS框架，對(duì)沒(méi)有設(shè)計(jì)師的團(tuán)隊(duì)很不錯(cuò)，與less結(jié)合使用效果完美
requirejs：AMD規(guī)范的模塊加載器，前端模塊化趨勢(shì)的必備工具
Node.js：JavaScript也可以做后臺(tái)，前端工程師地位更上一步
AngularJS：做Single Page Application的好工具
移動(dòng)端web開(kāi)發(fā)：智能手機(jī)的普及讓移動(dòng)端的流量正在逐步趕超PC端
Javascript內(nèi)存管理：SPA長(zhǎng)期運(yùn)行需要注意內(nèi)存泄露的問(wèn)題
High Performance JavaScript(Build Faster Web Application Interfaces)
Best Practices for Speeding Up Your Web Site：重要技能
一些個(gè)人經(jīng)歷
LingyuCoder的學(xué)習(xí)經(jīng)歷
上面的大神都總結(jié)得差不多了，我這里就胡扯一些吧
工具
chrome dev tools：前端開(kāi)發(fā)調(diào)試?yán)?，著重注意幾個(gè)功能：
console(廢話)
elements:元素樣式調(diào)整，很常用
sources：代碼中添加斷點(diǎn)，單步調(diào)試，以及單步調(diào)試過(guò)程中查看內(nèi)存中的對(duì)象
watch expression：通過(guò)表達(dá)式查看當(dāng)前內(nèi)存中的值
call stack：查看調(diào)用棧，開(kāi)啟async，可以看異步調(diào)用棧(這個(gè)非常有用，尤其是ajax調(diào)試的時(shí)候)
scope variables：作用域鏈上的變量，非常有用
network：抓包查看每個(gè)請(qǐng)求，非常重要，前后端聯(lián)調(diào)必備
timeline：分析渲染、js執(zhí)行等等各個(gè)階段，性能優(yōu)化利器
emulation：模擬移動(dòng)端環(huán)境，mobile頁(yè)面開(kāi)發(fā)必備
一些插件:
liveload: 修改頁(yè)面后自動(dòng)刷新，不用按F5
dimensions：直接在頁(yè)面上測(cè)量的利器
livestyle：css樣式修改后自動(dòng)起效果，不需要刷新，elements修改后也能同步到代碼中
image tool：測(cè)量，取色
UC二維碼：移動(dòng)端調(diào)試掃碼必備
pagespeed，YSlow：頁(yè)面性能分析和優(yōu)化插件
馬克飛象：優(yōu)秀的在線markdown編輯器，快速寫周報(bào)，做記錄
sublime text2：編碼方便，插件多，速度快，性能好
emmet：提升html編碼速度必備
sublimelinter + 各種語(yǔ)言的lint和hint：代碼糾錯(cuò)
一些snippets：自動(dòng)補(bǔ)全，提升開(kāi)發(fā)效率
Intellij IDEA和WebStorm：集成開(kāi)發(fā)環(huán)境，集成了各種功能，開(kāi)發(fā)比sublime要方便，但會(huì)比較吃性能
Mark Men：測(cè)量、取色、標(biāo)注利器，拿到視覺(jué)稿之后第一個(gè)打開(kāi)的軟件
GFW Fucker：我用紅杏，可以的話買個(gè)虛擬服務(wù)器當(dāng)梯子
iHosts：非常優(yōu)秀的hosts管理軟件，輕松修改hosts，開(kāi)發(fā)調(diào)試必備
Charles：Mac 平臺(tái)最好用的抓包分析工具
Rythem：AlloyTeam出品的代理抓包軟件，非常輕量，安裝簡(jiǎn)單，移動(dòng)端(真機(jī))開(kāi)發(fā)調(diào)試很好用
Wunderlist：一個(gè)非常不錯(cuò)的Todo List，任務(wù)、需求多的時(shí)候管理起來(lái)很方便