新年新氣象！新益求新的前端週刊（第十四期）

前端週刊是一份專爲前端從業人員，以及對前端、設計領域感興趣的朋友們打造的技術週刊。程小獅會精選出前端、設計領域近期相關的資訊、熱點以及技術乾貨，與你們一同分享。

前端週刊專一於前端領域技術分享。但願這份週刊可以成爲你成長的得力助手與夥伴。

真是新年新氣象。1 月 9 日小程序的正式發佈，除了對原生 App 產生必定的衝擊，在整個創投圈它也產生了很大的影響。雖然初期的體驗並非那麼好，但咱們也看到了更多的可能。在流量愈來愈貴，移動端流量更是金貴的今天，如何更好的鏈接線下，依然是值得思考的事情。

那麼，2017 年還會出現哪些驚喜呢？讓咱們拭目以待。

2017 年《前端週刊》第一期正式爲你們奉上。

前端技術集——前端乾貨彙集地

HTML

1. HTML5 Canvas 實現彩虹畫筆繪畫板指南
地址：http://t.cn/RMUt15y
做者：緝熙Soyaine

一塊兒來挑戰！用 HTML5 中的 Canvas 的路徑繪製實現一個繪畫板。

2. 10 個 HTML 5.1 的新功能
地址：http://t.cn/RMK240H
譯者：Bibi

一塊兒來了解 HTML 5.1 提供的新方法以及其應用。

CSS

1. 如何書寫整潔的 CSS 代碼？只需十步！（一）
地址：http://t.cn/RMJi0jT
譯者：王子建

書寫整潔的 CSS 代碼的 10 個簡單方法（第一部分）。

2. 如何書寫整潔的 CSS 代碼？只需十步！（二）
地址：http://t.cn/RMJi8pu
譯者：王子建

書寫整潔的 CSS 代碼的 10 個簡單方法（第二部分）。

3. 深刻理解 CSS 中的層疊上下文和層疊順序
地址：http://t.cn/R491den
做者：張鑫旭

深刻了解 CSS 層疊上下文、層疊水平、層疊順序以及如何進行層疊上下文的建立等內容。

4. 可視化熱門 CSS 屬性學習指南：CSS Reference
地址：http://t.cn/RMIGb95
做者：Jeremy Thomas

一個可視化 CSS 屬性學習指南。本指南爲英文版，Flexbox 部分的內容已完成翻譯：http://t.cn/RMIUePm

JavaScript

1. 2017 前端開發者必學清單
地址：http://t.cn/RMqdlr1
譯者：壯壯

一些我的的前端學習經驗，以及 2017 年的學習計劃分享。

2. Vue.js 的設計思想
地址：http://t.cn/RMbrvEf
做者：浩南

通俗易懂的瞭解 Vue.js 及其設計思想。

3. JS 正則表達式一條龍講解 
地址：http://t.cn/RMSop49
做者：StinsonZhao

本文既然取題爲「一條龍」，就要對得起」龍」，故將分享包括正則原理、語法一覽、JS(ES5)中的正則、ES6 對正則的擴展、實踐正則的總體思路。

4. JavaScript 中的模塊化開發
地址：http://t.cn/RMP9xmh
做者：iceman_dev

做者經過五個方面（爲何會有模塊化、模塊化開發的演變過程、模塊化規範等）與你們分享 JavaScript 中的模塊化開發。

5. Node.js 最佳實踐 -在2017年如何成爲一名更好的 Node.js 開發者
地址：http://t.cn/RMUhnIB
譯者：淨化

本文中，咱們將展望 2017 年 Node.js 的最佳實踐、最熱話題以及須要關注什麼來提高自身能力。

其餘推薦

1. 前端性能清單 2017
地址：http://t.cn/RMpUoFS
譯者：陳威特

一份全面的前端性能優化清單。它能夠做爲你的指南，幫助你根據實際的狀況，進行測試和監控你的項目。

2. 從 React 談 Web UI 開發
地址：http://t.cn/RIFoXhR
做者：Randy Lu

瞭解 React 的本質，思考 Web UI 的開發。

3. 11 個你應該知道的 npm 技巧
地址：http://t.cn/RMZrbWF
譯者：踏月流星

11 個在任何項目中使用 npm 會事半功倍的技巧。

4. 看懂前端腳手架你須要這篇 Webpack
地址：http://t.cn/RMbVxTZ
做者：二口南洋

一篇文章帶你看懂前端腳手架。

5. 2016 年我最喜歡的前端工具
地址：http://t.cn/RMwQqL9
譯者：IT程序獅

一些不錯的前端開發工具，但願對你們有所幫助。

6. 從零開始：微信小程序新手入門寶典《一》
地址：http://t.cn/RMGvZRR
做者：扶桑木下

全面、詳細的微信小程序新手入門指南。

前端新手家園——前端新人好幫手

1. 前端篇: 前端演進史
地址：http://t.cn/RM6pqhw
做者：前端開發攻城獅

一篇文章瞭解前端開發的淵源與演進。

2. JavaScript 風格指南
地址：http://t.cn/RMIy1UM
譯者：alivebao

JavaScript 的軟件工程原則《Clean Code JavaScript》的譯文，值得參考借鑑。

3. 前端資源整合
地址：http://t.cn/RqzOgaV
做者：軒楓閣

一個聚集了一些不錯的前端資源的網站，涉及優秀站點、前端合輯、設計與體驗以及工具文檔等內容，適合新手收藏備用。

4. Chrome DevTools 中文文檔
地址：http://t.cn/RMI7r60
譯者：愚人碼頭

跟隨文檔詳細瞭解 Chrome DevTools 的方方面面。

5. 從零開始構建 JavaScript 技術棧
地址：http://t.cn/RVBXsbA
譯者：pd4d10

一個簡單直接的 JavaScript 技術棧構建指南。旨在將全部的工具結合起來使用，併爲每一個工具提供最簡單的示例。

前端猿與射雞屍——設計的那些事

1. 100 本改變你設計命運的書籍
地址：http://t.cn/RIuSlEQ
做者：設計達人網

拿 18000+ 去培（song）訓（qian），不如老老實實讀幾本書。

2. 2017 年十大網頁設計趨勢
地址：http://t.cn/RM6n6fK
譯者：IT程序獅

2017 年裏，你須要瞭解的一些網頁設計趨勢。

3. 面對大型項目，設計師該作些什麼？
地址：http://t.cn/RMIYLbv
做者：蟈蟈蟈

在大型項目中，視覺設計師如何發揮本身最大的做用，找到本身的最佳定位，並保證高質量高效率的完成項目呢？這篇文章會給你答案。

程序人生——程序員的成長與故事

1. 小程序想要什麼？
地址：http://t.cn/RMfH9nY
做者：Jason Ng

隨阿禪來了解微信小程序的用途以及其應用場景。

2. 據說 2017 你想寫前端？
地址：http://t.cn/RMC7pIb
做者：滬江UED

四部份內容帶你瞭解 2017 年如何更好的學習前端。

若是你喜歡本期內容，不妨點個贊，謝謝！ 與你相約，下一期不見不散。

往期回顧

• 揮別 2016！展望 2017 的前端週刊（第十三期）
• 年度盤點！暢想將來的前端週刊（第十二期）
• 鍥而不捨！與君同行的前端週刊（第十一期） 
• 月末推薦！精益求精的前端週刊（第十期）