前端收集
在前端路上摸索前行，在這裏分享自己長期關注的前端開發相關的優秀網站、博客、以及活躍開發者。歡迎更新，以下各排名不分先後順序。
自己 RSS 長期訂閱了一些IT 和技術相關博客，這裏是我Feedly 輸出的opml，可直接導入一些RSS 閱讀器:
https://github.com/foru17/luolei-dotfiles/blob/master/feedly.opml
前端收集圖譜
此部分爲@jikeytang 貢獻
- clone https://github.com/hjzheng/front-end-collect
- cd front-end-collect
- bower install
- 放入你喜歡的web容器,訪問index.html即可
- 你也直接可以訪問: http://get-set.cn/front-end-collect/
- 支持Chrome, Firefox and IE10&11以上瀏覽器
聚合&&週報訂閱
| 名稱 | 訂閱地址 | 介紹 |
|---|---|---|
| 英文推送 | ||
| Html5 Weekly | http://html5weekly.com/ | Html 技術類 |
| CSS Weekly | http://css-weekly.com/ | |
| Javascript Weekly | http://javascriptweekly.com/ | JS相關，同樣有 html,css 和工具相關 |
| Web Design Weekly | http://web-design-weekly.com/ | 設計、技術、技巧、工具聚合 |
| UX Weekly | http://uxwkly.com/ | 用戶體驗、網頁設計推送 |
| Web Tools Weekly | http://webtoolsweekly.com/ | Js，工具推送 |
| RESPONSIVE DESIGN NEWSLETTER | http://re | |
| sponsivedesignweekly.com/ | 每週推送一次響應式設計相關 | |
| Tutorialzine | http://tutorialzine.com/ | 精品教程和資源推送 |
| Sidebar | http://sidebar.io/ | 每天、每半周、每週推送5條設計相關 |
| The Hacker News Newsletter | http://www.hackernewsletter.com/ | HN 每週精選 |
| Design News | https://news.layervault.com/ | F2類資訊聚合 |
| Css Animations | http://cssanimation.rocks/ | 關於CSS動畫的訂閱 |
| HACKDESIGN | http://hackdesign.org/ | 每週發佈一個設計類課程 |
| 中文推送 | ||
| 稀土:掘金 | http://gold.xitu.io/ | 國內十分用心的開發者技術分享、交流平臺 |
| SegmentFault精選 | http://segmentfault.com/ | 國內開發者技術問答社區每週精選問答 |
| FE Weekly | http://www.feweekly.com/ | 每週一次，內容主要是英文的，不過有中文導讀 |
| EchoJs_News | http://www.echojs.com/ | 每天推送若干好文，都是英文的，JS技術類 |
| 碼天狗週刊 | http://weekly.codetengu.com/ | 臺灣的，一份開發者導向的IT 技術週刊，適合所有患有資訊焦慮症、氣血循環不順以及性受挫的軟體工程師們。 |
| Github Issue Blog Reader | https://gitissue.com | Github Issue 博客聚合平臺，每天更新內容，可及時關注閱讀 |
專業博客
注:此處活躍度爲博客更新頻率，原創度指的是作者原創或者翻譯的文章所佔博文比例。請尊重原創，大量轉載其他網站資訊的網站和聚合類網站不做推薦。
中文博客
| 名稱 | 活躍度 | 原創度 | 維護者 | 其他 |
|---|---|---|---|---|
| W3Cplus | ★★★★★ | ★★★★★ | 攜程 @大漠 | 國內最優秀的前端博客，原創居多 |
| W3Cfuns | ★★★★★ | ★★★★☆ | # | 專注於web前端開發行業的綜合性門戶網站 |
| 前端觀察 | ★★★★☆ | ★★★★☆ | 騰訊 ISUX @神飛 | 曾經最優秀，最近更新不頻繁了 |
| 騰訊web前端 AlloyTeam 團隊 | ★★★★ | ★★★★ | @騰訊AlloyTeam | 來自於騰訊SNG(社交網絡事業羣) |
| 張鑫旭-鑫空間-鑫生活 | ★★★★☆ | ★★★★★ | 張鑫旭 | 重構很厲害，不少經典文章經驗 |
| ria之家 | ★★★★☆ | ★★★★☆ | 淘寶 @明河 | # |
| 大前端 | ★★★★☆ | ★★★★☆ | # | # |
| CSS森林 | ★★★★☆ | ★★★★☆ | 關於 | # |
| 設計達人 | ★★★★☆ | ★★★☆☆ | # | 更新較頻繁，但轉載也較多 |
| 阮一峯博客 | ★★★★☆ | ★★★☆☆ | # | 牛人一個 |
| Be For Web - 爲網而生 - 原創譯文博客 | ★★★★☆ | ★★★★☆ | @C7210 | 關注移動應用及互聯網產品、用戶體驗設計、前端開發 |
國外博客
| 名稱 | 活躍度 | 原創度 | 維護者 | 其他 |
|---|---|---|---|---|
| Smashing Magazine | ★★★★★ | ★★★★★ | # | 業界權威，web 設計很贊 |
| Tuts | ★★★★★ | ★★★★★ | - | 國外知名開發者網站 |
| DeveloperDrive | ★★★★★ | ★★★★★ | - | 優質前端技術信息 |
| CSS-TRICKS | ★★★★★ | ★★★★★ | Chris Coyier | 左邊這位是大神 |
| Web Designer Wall | ★★★★★ | ★★★★★ | Nick La. | 優質 Html5,CSS3等教程 |
| Tutorialzine | ★★★★★ | ★★★★★ | # | 大量 web 教程和資源 |
| Inspect Element | ★★★★★ | ★★★★★ | # | CSS,wordpress 相關教程挺多 |
| Codrops | ★★★★★ | ★★★★★ | # | 設計、交互、CSS |
| Jake Rutter | ★★★★★ | ★★★★★ | Jake Rutter | Jquery 作者，不解釋了 |
| Paul Irish | ★★★★★ | ★★★★★ | Paul Irish | 大神,Google Chrome團隊,Yeoman |
| Krasimir Tsonev | ★★★★★ | ★★★★★ | Krasimir Tsonev | html5,ccs3,javascript |
| NCZOnline | ★★★★★ | ★★★★★ | Nicholas C. Zakas | html5,ccs3,javascript |
| HTML5 Rocks | ★★★★★ | ★★★★★ | # | html5權威網站 |
| A List Apart | ★★★★★ | ★★★★★ | # | 可以改變世界的文章 |
| hakim | ★★★★★ | ★★★★★ | HAKIM EL HATTAB | ccs3,javascript |
| DailyJS | ★★★★★ | ★★★★★ | # | javascript |
活躍微博
| ID | 公司 | 簡介 |
|---|---|---|
| @稀土圈 | # | 強烈推薦，分享一些技術文章和Github項目 |
| @w3c中國 | # | 萬維網聯盟中國辦事處官方微博 |
| @TheFrontEnd | # | JavaScript技術資訊、新聞、教程、深度文章。 |
| @前端快爆 | 阿里巴巴 | 有HTML5、CSS3、JS |
| @HTML5中國 | # | 中國www.html5cn.org官方微博 |
| @GitHubDaily | # | 專注於分享 GitHub 最新的優質開源項目:sparkles: |
開發者博客
微博微信流行後，明顯感覺到寫博客的人還是越來越少了，下面推薦的這些開發者屬於在網上比較活躍的，或者博客積累了大量優質資源的。
國內開發者
國內開發者一塊歡迎大家 Fork提交推薦，最好能推薦一些在前端界較活躍的的開發者。
| ID | 博客 | 微博 | Github | 公司 | 關鍵字 | ||||
|---|---|---|---|---|---|---|---|---|---|
| 小鬍子哥 | barretlee | @Barret李靖 | @barretlee | # | # | 阿里巴巴 | |||
| 小魚 | sofish | @sofish | # | # | # | 餓了麼前端 | |||
| 屈光宇 | Jerry Qu的小站 | 屈光宇 | # | # | # | 奇虎360前端,HTTP,Node。js | |||
| 郭宇 | Einmal ist keinmal | @郭宇 | @guo-yu | @turingou | 今日頭條 | Node.js | |||
| hzlzh | 自力博客 | @hzlzh | @hzlzh | @hzlzh | 騰訊 | 前端開發 | |||
| TQ | http://targetkiller.net/ | @Piser-TQ | @tqtan | @targetkiller | 騰訊 微信 | 前端 | |||
| 張鑫旭 | 張鑫旭博客 | @張鑫旭 | @zhangxinxu | @zhangxinxu | 閱文(騰訊文學) YUED | 前端開發 | |||
| foru17 | 羅磊的獨立博客 | @羅羅磊磊 | @foru17 | @foru17 | 閱文(騰訊文學) YUED | ||||
| LOO2K | LOO2K | @LOO2K | LOO2K | LOO2K | 騰訊 CDC | 前端 | |||
| 阮一峯 | 阮一峯博客 | @ruanyf | @ruanyf | @ruanyf | 上海金融學院國際金融學院 | 教師，博客寫作人，翻譯人，《黑客與畫家》的譯者 | |||
| 老趙 | http://blog.zhaojie.me/ | @老趙 | # | # | 摩根大通（香港） | 資深碼農 | |||
| 玉伯 | 歲月如歌 | @玉伯也叫射鵰 | @lifesinger | @lifesinger | 支付寶 | 大牛 | |||
| kejun | http://hikejun.com/ | @kejunz | @kejunz | # | 豆瓣 | 前端大神 | |||
| 寒冬winter | winter-cn | @寒冬winter | # | # | # | # | |||
| 左耳朵耗子 | 酷殼 | @左耳朵耗子 | # | @haoel | 淘寶 | # | |||
| fool2fish | # | @fool2fish | # | # | 支付寶 | # | |||
| 樸靈 | Html5fiy | @樸靈 | JacksonTian | # | 阿里巴巴 | 《深入淺出Node.js》作者,大牛 | |||
| Cat Chen | 陳廣琛 | @CatChen | @CatChen | @CatChen | 大牛 | ||||
| BYVod | Beyond the Void | @BYVoid | @byvoid | @BYVoid | Facebook 英國 | 《Node.js 開發指南》作者,大牛 | |||
| 勾三股四 | # | @勾三股四 | # | # | 淘寶 | # | |||
| cnberg | 冰山一角 | @berg | @cnberg | @cnberg | 百度 | 騎行 | |||
| 大貓 | 意淫筆記 | @daemao | @Damao | @13igcat | 騰訊 | 知乎 | |||
| C7210 | beforweb.com/ | @C7210 | @C7210 | @C7210 | # | UX、交互設計師、視覺與前端 | |||
| kejun | http://hikejun.com/ | # | # | # | 騰訊 | 前端開發 | |||
| lucifr | http://lucifr.com/ | @lucifr | @lucifr | @lucifr | # | Mac,ios | |||
| smallni | http://www.smallni.com/ | # | @Smallni | # | 騰訊 | 前端開發 | |||
| qiqiboy | qiqiboy | @qiqiboy | # | # | 老虎證券 | 吐槽清理大師開發者 | |||
| 周愛民 | aimingoo專欄 | # | # | # | 支付寶 | JavaScript語言精髓與編程實踐作者 | |||
| 李松峯 | 爲之漫筆 | # | # | # | # | 高程2等書的譯者 | |||
| 99css | 99css | @ytzong | # | # | # | 騰訊一牛 | |||
| 秦歌 | Kaven | # | @kavenyan | # | # | js語言精粹譯者 | |||
| linxz | linxz | # | # | # | # | css那些事兒的作者 | |||
| Along | Along's Blog | @newwave | # | # | # | Opera 歐朋一牛 | |||
| 安記 | cssha | @hanan321 | hanan198501 | # | # | 去哪網一牛 | |||
| 餘弦 | EVILCOS | 餘弦 | evilcos | # | 知道創宇 | 安全（黑客）、架構、團隊的各種觀點與分享 | # | 馮大輝 | 現在就職於丁香園 (http://dxy.cn) ，擔任技術團隊負責人. |
一些社區
| 名稱 | 地址 | 介紹 |
|---|---|---|
| V2EX | http://v2ex.com/ | 小衆活躍社區 |
| 稀土掘進 | https://juejin.im/ | 程序員同性交友社區 |
| 知乎 | http://www.zhihu.com/ | 綜合問答社區 |
| 前端亂燉 | http://www.html-js.com/ | 專業的前端知識平臺 |
| segmentfault | http://segmentfault.com/ | 綜合問答社區 |
| 果殼問答 | http://www.guokr.com/ask/pending/ | 綜合問答社區 |
| Ruby | http://ruby-china.org/ | 同 V2EX 氛圍類似，不侷限於Ruby |
| Node.js 中文社區 | http://cnodejs.org/ | Node.js 國內最活躍的社區 |
| Code Wall | https://coderwall.com/ | 國外技術社區 |
| DIV.IO | http://div.io/ | 國內前端技術社區 |
| w3ctech | http://www.w3ctech.com/ | 國內前端技術社區，常有一些線下活動發佈 |
企業官方博客
在開頭我的 Feedly 訂閱 opml 文件裏比較全面。
| 名稱 | 公司 | 部門 | 活躍度 | 簡介 | 微博 |
|---|---|---|---|---|---|
| ISUX 社交用戶體驗設計 | 騰訊 | ISUX | ★★★★☆ | 負責騰訊的社交網絡相關產品的用戶體驗設計與研究。 | # |
| 騰訊 CDC | 騰訊 | CDC | ★★★★☆ | 簡介 | # |
| 騰訊Web前端 Alloy 團隊 Blog | 騰訊 | SNG | ★★★★☆ | 主要負責手機QQ、QQ互聯、騰訊Q+、WebQQ項目的團隊。 | alloyteam |
| TID-財付通設計中心 | 騰訊 | TID | ★★★★☆ | 簡介 | # |
| 騰訊MXD移動互聯網設計中心 | 騰訊 | MXD | ★★★★☆ | 簡介 | @騰訊MXD |
| 凹凸實驗室 | 京東 | FED | ★★★★★ | 簡凹凸實驗室(Aotu.io，英文簡稱O2) 始建於2015年10月，是一個年輕基情的技術團隊。 | # |
| 微博UDC | 新浪 | UDC | ★★★★☆ | 簡介 | @微博UDC設計中心 |
| 新浪UED | 新浪 | UED | ★★★★☆ | 簡介 | # |
| 網易用戶體驗設計中心 | 網易 | UED | ★★★★☆ | 簡介 | # |
| 阿里巴巴（中國站）用戶體驗設計部博客 | 阿里巴巴 | UED | ★★★★☆ | 簡介 | @Alibaba-UED |
| 攜程UED-攜程旅行前端開發團隊 | 攜程網 | UED | ★★★☆☆ | 攜程UED,攜程前端開發團隊,UED,Javascript,重構,ux | # |
| 百度FEX | 百度 | FEX | ★★★★☆ | 百度前端團隊Blog,關注前端技術，還更重視全端及全棧的能力。 | # |
| 淘寶UED | 淘寶網 | UED | ★★★★☆ | 用戶體驗、交互設計、視覺設計、前端技術博客 | @淘寶UED |
書籍
| 名稱 | 作者 | 價格 | 出版社 | 簡評 |
|---|---|---|---|---|
| Web標準設計 | 劉傑（嗷嗷） | RMB 60.00 | 清華大學出版社 | 基礎入門 |
| 大巧不工 : Web前端設計修煉之道 | 賴定清 / 林堅 | RMB 59.00 | 機械工業出版社 | 適合入門，瞭解前端全局 |
| 高性能網站建設指南:前端工程師技能精髓 | Steve Souders | RMB 35.00 | 電子工業出版社 | 能從原理層理解各種方法 |
| 高性能網站建設指南:Web開發者性能優化最佳實踐 | Steve Souders | RMB 49.80 | 電子工業出版社 | # |
| Web站點優化 : Web站點優化 | 金 | RMB 55.00 | # | # |
| Node.js開發指南 | 郭家寶 | RMB 45.00 | # | 作者很牛 |
| JavaScript高級程序設計 | Nicholas C. Zakas | RMB 99.00 | 人民郵電出版社 | 適合沒事就翻翻 |
| JavaScript權威指南 | 弗拉納根 | RMB 109.00 | 機械工業出版社 | 犀牛書 |
| JavaScript語言精粹 | Douglas Crockford | RMB 35.00 | 電子工業出版社 | 絕對經典，相信看完後，對Javascript這門語言有了重新認識，原來這個語言是這麼的美麗！ |
| 深入淺出node.js | 樸靈 | RMB 69.00 | 人民郵電出版社 | 一本從前端通往全端的好書 |
| CSS開發王 | 張亞飛 | RMB 49.00 | 電子工業出版社 | 適合有一定基礎後CSS進階用 |
| JavaScript DOM編程藝術 | Jeremy Keith /Jeffrey Sambells | RMB 49.00 | 人民郵電出版社 | 適合Javascript入門看 |
線上文檔參考
| 書名 | 地址 | 作者 | 譯者 | 介紹 |
|---|---|---|---|---|
| JavaScript祕密花園 | http://bonsaiden.github.io/JavaScript-Garden/zh/ | 伊沃·韋特澤爾&張易江 | 三生石上 | 完整書籍，界面美觀，有詳細demo |
| Material Design 中文版 | http://design.1sters.com/ | Google設計手冊 | 協同翻譯 | Google I/O 2014 發佈的 Material Design 官方手冊的中文翻譯 |