Webpack:

[webpack-howto]

[webpack]

[http://www.infoq.com/cn/articles/react-and-webpack]

?

JS相關：

[javascript weekly]

[javascript標準參考教程] --阮一峰的參考教程，可讀性很好，非常不錯的

[QuirksMode-DOM]

[深入理解JAVASCRIPT系列] ??

[User Timing API （window performence）]

?

關注ES6(ES2015):

[ES6 入門]--from 阮一峰

[UnderstandingES6] --?Nicholas Zakas 正在寫的書

[ES6 features] ?--ECMAScript 6 Features 中文版

[get started with ES6]

?

移動相關：

[聊聊前端跨平臺開發的各種技術]

[mobileTouch]--司徒正美的移動端學習資料

[手機淘寶可伸縮布局方案]

[無線滾動插件] -- 蠻好用，挺流暢 ?

[Hybrid架構下的H5應用加速方案]--十分棒的方案

?

CSS相關：

[Animate.css]--超棒且直觀的css動畫

[Animation Generator] -- 集成在chrome中的動畫生成器

[40個漂亮又免費的css Table樣式]--table有時候還是很有用的~

[css彈出框效果]--都挺好看的

[css基線之道]--你所不知道的css baseline

[BFC詳解]--深入理解BFC

[css定位機制之普通流]--了解css的布局機制

[學習css?layout]--css layout布局

[CSS 相對|絕對(relative/absolute)定位系列（一）]
[CSS 相對|絕對(relative/absolute)定位系列（二）]
[CSS 相對|絕對(relative/absolute)定位系列（三）]
[CSS 相對|絕對(relative/absolute)定位系列（四）]
[CSS 相對|絕對(relative/absolute)定位系列（五）]

[FlexBox很全的指南] ?

[cubic-bezier曲線生成] -- 我們在寫css動畫的時候常用的cubic-bezier曲線，調試生成~

[svg 繪制路徑]

[純css實現打地鼠游戲]

[in-depth understanding css]

[征服高級CSS選擇器]

[how to write effecient css]

[creating style sheets]

[自定義滾動條詳解]

[自定義滾動條實例]

?

NodeJS:

[awesome-Nodejs]

[七天學會Nodejs]--入門教程

[Nodejs 中文版API]

[KOAjs-GitHub]?

[KOA workshop]

[Nodejs+express+mongodb入門教程]

[Nodejs+express+mongodb進階教程]

[HTML轉jade]

[node-inspector]--nodejs debugger

[nodejs koa gulp started]

[knowthen]

[常見的nodejs面試題]

?

RESTful API:

[https://scotch.io/tutorials/build-a-restful-api-using-node-and-express-4]

[http://www.vinaysahni.com/best-practices-for-a-pragmatic-restful-api]

[http://webapplog.com/tutorial-node-js-and-mongodb-json-rest-api-server-with-mongoskin-and-express-js/]

[http://webapplog.com/express-js-4-node-js-and-mongodb-rest-api-tutorial/]

?

Gererator:

[https://strongloop.com/strongblog/node-js-callback-hell-promises-generators/]

[https://strongloop.com/strongblog/promises-in-node-js-with-q-an-alternative-to-callbacks/]

[co 的含義和用法]

[sync 的含義和用法]

[細嗅promise]

[Generator in good use]

?

React-Native:

[React 入門指南] --阮一峰的React入門指南，簡單易懂，有很多demo

[facebook/ReactNative-GitHub]

[ReactNative布局]--react學起來~

[React Native學習指南]--收集了蠻多學習資料 ?

[如何評價RectNative] ?

[對React Native的一些看法]

[react.js的virtual dom]

[reactjs-first-try]

?

源碼閱讀：

[underscore.js]

?

工具和手冊 ：

[caniuse.com]--瀏覽器的特征檢測，覆蓋了css，js，html5，svg等等

[ES5.1 standard]--ES標準手冊

[css參考手冊]

[clip-path maker]--玩轉css clip-path屬性

[TinyPng]--圖片壓縮利器

[GitBook]--用GitBook寫本書吧~

[http://asciiflow.com/]--程序員畫圖利器

?

測試與調試：

[小黃鴨調試法] -- 維基百科說：小黃鴨調試法是軟件工程中使用的調試代碼方法之一。就是在程序的調試、糾錯或測試過程中，耐心地向小黃鴨解釋每一行程序的作用，以此來激發靈感。

[編寫可測試的javascript]

?

有內涵的前端網站：

[codrops]--get各種酷炫技能

[http://thecodeplayer.com/]--我們可以看到代碼是怎樣一行一行寫出來的

[http://www.freshdesignweb.com/]--好多很好的效果，很實用，就是加載有點慢...

[http://www.quirksmode.org/blog/]--我在上面看一些移動相關的知識，研究的很仔細

[css-tricks]

?

我喜歡的博客:

[阮一峰的網絡日志]--有文學氣息的程序猿，讀書日志我也很喜歡~

[web技術研究所]--每日一篇，值得學習

[小胡子的微分享]--get各種神技巧

[taobao ued blog]

[http://www.alloyteam.com/]

[HTML5夢工廠]

[前端觀察]

[百度fex]

?

?

前端雜談：

[git style guide-git最佳使用實踐]

[chrome開發者技巧]

[代碼質量ESLint] ?

[grunt新手一日入門]

[getting started with gulp]--gulp快速入門指南

[用js給圖片加水印]

[關于polyfills]?

[polyfills和shim的區別]

[rgb顏色與16進制顏色的轉換]

[30天學習30種新技術]

[bower]

[前端模塊管理器簡介]?

愛閱讀：

[推酷]

?

《新程序員》：云原生和全面數字化實踐50位技術專家共同創作，文字、視頻、音頻交互閱讀

總結

以上是生活随笔為你收集整理的前端资源的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。