摘要：不是一下子能看完綜合使用編程是一番怎樣的體驗(yàn)學(xué)習(xí)筆記網(wǎng)站前端開發(fā)基礎(chǔ)算法題如何優(yōu)雅地使用如何優(yōu)雅地使用零度博客碼農(nóng)網(wǎng)伯樂在線什么是頁面渲染國(guó)外先更到這，還有太多網(wǎng)址，先歸類一下再補(bǔ)充。

最近在復(fù)習(xí)JavaScript知識(shí)時(shí)遇到以前就不懂的閉包、上下文，雖然比以前理解深了一點(diǎn)，但還是懵，想緩一下。。就去看了其他。。把Git、Grunt、Gulp、jQuery、jQuery UI、React給入門了（React的入門略困難。。）

原本想記錄一下Grunt/Gulp的安裝和命令配置的，發(fā)現(xiàn)SF及網(wǎng)上有太多文章了，以后有空簡(jiǎn)短寫一下就可以了。

然后最近又入坑FreeCodeCamp。。原來慕課網(wǎng)的編程練習(xí)就是模仿他的啊。。

本篇文章主題是記錄網(wǎng)址，因?yàn)樽约禾潱惶煜聛泶蜷_了很多覺得有用的網(wǎng)頁，但又沒時(shí)間看，如下圖

所以決定把一些記事本里記錄的網(wǎng)址發(fā)上來。。。不然實(shí)在是眼花繚亂

老牌：https://jsfiddle.net/

在線JS代碼調(diào)試工具是一個(gè)老牌的支持javascript、css、html代碼可視化在線調(diào)試工具，支持多種應(yīng)用多種主流框架，用起來非常方便，而且還可以將調(diào)試好的結(jié)果以非常簡(jiǎn)潔的頁面直接嵌入在其他網(wǎng)頁里。
對(duì)于網(wǎng)頁設(shè)計(jì)師來說需要寫演示用的JavaScript實(shí)例代碼的時(shí)候，就完全可以在jsFiddle里面直接完成編寫后調(diào)試，再將結(jié)果直接嵌入Blog正文里即可了，真的是很方便的選擇。
除了可以調(diào)試代碼外，還可以方便的發(fā)布到社區(qū)，論壇或者社交媒體上與朋友們分享或者提問。整合了很多的不同的類庫(kù)供大家選擇。
類似的工具還有jsbin.com，也非常不錯(cuò)。

新秀：http://codepen.io/

CodePen.io網(wǎng)站前端設(shè)計(jì)開發(fā)平臺(tái)是一個(gè)針對(duì)網(wǎng)站前端代碼設(shè)計(jì)的開發(fā)工具，提供多種效果的網(wǎng)站前端代碼設(shè)計(jì)工具，豐富的案例特效，用戶可以demo的基礎(chǔ)上開發(fā)自己的前端設(shè)計(jì)。

Codepen教學(xué)：http://www.zhangxinxu.com/wor...

其實(shí)用sublime text3插件也可以的，HTML-CSS-JS Prettify

在線代碼格式化：http://tool.oschina.net/codef...

CSS3+Html5在線測(cè)試以及實(shí)用教程酷站分享：http://www.25xt.com/html5css3...

兩個(gè)都不同，都很龐大。。不是一下子能看完
1、https://segmentfault.com/a/11...

2、http://blog.csdn.net/qq_34348...

使用 freeCodeCamp 編程 是一番怎樣的體驗(yàn)？https://www.zhihu.com/questio...
學(xué)習(xí)筆記：freeCodeCamp網(wǎng)站前端開發(fā)基礎(chǔ)算法題http://ce.sysu.edu.cn/hope/It...
如何優(yōu)雅地使用 Stack Overflow？https://www.zhihu.com/questio...
如何優(yōu)雅地使用Sublime Text？http://www.html5cn.org/articl...
零度博客：http://www.lingdublog.cc/cate/1
碼農(nóng)網(wǎng)：http://www.codeceo.com/
伯樂在線：http://web.jobbole.com/
什么是頁面渲染：http://www.zhihu.com/question...

國(guó)外：
http://career.guru99.com/top-...
https://www.toptal.com/javasc...

先更到這，還有太多網(wǎng)址，先歸類一下再補(bǔ)充。澄清一下，不是推薦網(wǎng)址！只是我沒來得及看得網(wǎng)址匯總而已

補(bǔ)充幾個(gè)感覺挺全面的地址
css,js的學(xué)習(xí)分享：http://www.cnblogs.com/jikey/...
（特點(diǎn)：同一個(gè)知識(shí)點(diǎn)把相關(guān)的文章都?xì)w類了，例如閉包這一個(gè)知識(shí)點(diǎn)就有10篇，可能你會(huì)覺得，這么多沒必要啊。。基本大同小異，但像我這種接受知識(shí)相對(duì)慢的人來說，多一篇文章，就是多一個(gè)讓我更快理解知識(shí)點(diǎn)本質(zhì)的機(jī)會(huì)）

原生js制作的各種實(shí)例：http://www.fgm.cc/learn/
（特點(diǎn)：發(fā)現(xiàn)網(wǎng)上其實(shí)有很多這種的了，但是覺得這個(gè)對(duì)新手或者對(duì)JS理解不夠的可以用來練手，有少量中文注釋，個(gè)人感覺還不錯(cuò)，然后當(dāng)時(shí)復(fù)制時(shí)把作者原話(?)也復(fù)制了，所以順便貼在下面吧）

寫一堆作品，比如以下這樣，然后寫的當(dāng)中，你會(huì)遇到問題，這時(shí)候不要著急，遇到問題，解決問題，就是成長(zhǎng)的過程。然后享受這個(gè)過程，這些解決問題的經(jīng)驗(yàn)，將來是你面試的資本，是工作中賴以生存的根本。也是促使你向更高技術(shù)攀登的動(dòng)力，正因?yàn)閏ss,js如此好玩，所以我們一直不能停止追逐他的步伐。然后我個(gè)人感覺，css,js是學(xué)不完的，技術(shù)隨著需求的不斷變化而不斷迭代，最主要還是基礎(chǔ)打好，以不變以萬變。

Web前端開發(fā)規(guī)范文檔你需要知道的事：http://itindex.net/detail/396...
Web前端：11個(gè)讓你代碼整潔的原則：http://itindex.net/detail/386...

由于上上周要考證，上周又病了好幾天，沒時(shí)間更新，F(xiàn)CC和github都沒空弄。。唉
明天要旅游，這次要更多些~

Fiddler介紹：http://www.aliued.cn/2010/04/...
Fiddler實(shí)例：http://www.aliued.cn/2010/04/...
（就是用于前端調(diào)試。。曾在學(xué)習(xí)Ajax時(shí)用來測(cè)試客戶端向服務(wù)器請(qǐng)求數(shù)據(jù)的具體情況，簡(jiǎn)化版:http://www.cnblogs.com/shijin...）

時(shí)間定格1：http://www.cnblogs.com/NetSos...
時(shí)間定格2：http://www.html5jscss.com/
（特點(diǎn)：文章涉及的知識(shí)很廣很雜亂。。某些技術(shù)總結(jié)不錯(cuò)的，但只適合像雜志一樣隨便看下就好）
（缺點(diǎn)：很舊很舊，前者大部分文章已經(jīng)是2010年，后者大多數(shù)停在2014年）

月光博客：http://www.williamlong.info/
（如果覺得前面那個(gè)博客有點(diǎn)過時(shí)，最多只適合新手瀏覽一下，那這個(gè)博客你應(yīng)該不會(huì)這么說了，要是真的很熱愛互聯(lián)網(wǎng)方面知識(shí)，月光博客真的很不錯(cuò)，也是當(dāng)雜志看，不過資訊很新鮮，基本每天更一篇）

知識(shí)庫(kù)：http://lib.csdn.net/（這個(gè)涉及面很廣，內(nèi)容很多，有空多逛逛）
伯樂在線：http://hao.jobbole.com/（這個(gè)也是內(nèi)容很多=.=有空多逛逛）

https://devdocs.io/
無意中找到的一個(gè)挺好的開發(fā)文檔集合的網(wǎng)站，可以在線查詢多種編程語言及框架的API。感覺非常好用，不過我這個(gè)是英文版，要中文版的童鞋自己私下找找吧，好像可以選擇離線查看的。

https://developer.mozilla.org...
在freecodecamp刷題時(shí)官方提供的語法地址來自這里，第一次知道這個(gè)網(wǎng)站，感覺挺好，我個(gè)人覺得是升了幾級(jí)的w3school哈哈哈

                                                                   ————WEB前端學(xué)習(xí)，代碼讀百遍其義必見。