前端工具

基於 Electron 的前端文件處理工具

一鍵拖拽並在當前目錄下生成處理後的文件，處理零碎的前端文件從未如此輕鬆~

看懂前端腳手架你須要這篇webpack

it's not webpack step by step（webpack2） 打個廣告，歡迎你們訂閱我司尚妝github博客，不按期乾貨輸出哦。 分割webpack配置文件的多種方法 ###（一） 將你的配置信息寫到多個分散的文件中去，而後在執行webpack的時候利用--c…

讓我爲你介紹一個神器：Chimee，一套可擴展的 H5 視頻播放器解決方案

Chimee（讀「奇米」, [tʃɪ'mɪ:]）是由奇舞團開源的一套 H5 視頻播放器解決方案，由奇舞團視頻雲前端團隊結合在業務和視頻編解碼方向的沉澱積累傾心打造。
Chimee 支持 MP四、M3U八、FLV 等多種媒體格式，同時它也幫咱們解決了大部分的兼容性、差別化問題，包…

騰訊 AlloyTeam 出品的優秀 Web 前端導航站（歡迎推薦 / 建議）

聚合優秀 Web 資源，歡迎推薦 ：D

70% 以上業務由 H5 開發，手機 QQ Hybrid 的架構如何優化演進？

大前端 - 5 分鐘帶你讀懂 Hexo 源碼設計模式

Hexo 命令行設計
Hexo 入口模塊設計
Hexo 編譯模塊設計

3D GIS 應用開發 —— 基於 Mapbox GL 的實踐總結

最近在折騰的 web 端的可視化項目，因爲相關業務的須要，用到了 Mapbox 這一地圖開發的神器。在此先奉上項目 Demo 的一段小短片： 片斷01 片斷02 片斷03 片斷04 是否是趕腳效果還闊以（此處自吹自擂）？下面咱們從這個項目一步步來介紹 Mapbox 的前端 GI…

IntelliJ IDEA 簡體中文專題教程

比較完善的 IDEA 中文教程，本套教程適用於：IntelliJ IDEA 1四、1五、201六、2017 版本

webpack：從入門到真實項目配置

自從出現模塊化之後，你們能夠將本來一坨代碼分離到個個模塊中，可是由此引起了一個問題。每一個 JS 文件都須要從服務器去拿，由此會致使加載速度變慢。Webpack 最主要的目的就是爲了解決這個問題，將全部小文件打包成一個或多個大文件，官網的圖片很好的詮釋了這個事情，除此以外，Web…

基於 Docker 打造前端持續集成開發環境

本文將以一個標準的 Vue 項目爲例，徹底拋棄傳統的前端項目開發部署方式，基於 Docker 容器技術打造一個精簡的前端持續集成的開發環境。 1. CI（持續集成）：阮一峯老師的關於 CI 的介紹 2. Docker： Docker 快速入門 1. 代碼無需在本地構建 2. 只…

手把手教你如何使用webpack 生成css sprites

咱們在開發網站的時候，一般會把經常使用的圖標合併成css sprite(雪碧圖)，能夠有效的減小站點的http請求數量，從而提升網站性能。 下面讓咱們一塊兒來學習一下如何使用webpack合併sprite圖。 好了，以上就是webpack生成css sprite的辦法了，是否是覺着很…

走進網頁虛擬現實 WebVR

最近幾年，虛擬現實 VR 的概念火了一把，各類 VR 概念的遊戲、設備、視頻受到人們的普遍關注。筆者在逛商場的時候也常常會看到有 VR 設備體驗的地方讓遊人體驗一把，各類酷炫的頭盔和酷炫的設備着實抓人眼球。可是做爲一個前端工做者，咱們確定也但願在咱們的網頁裏也能看到這麼酷炫的效果，不經意間…

webpack 的新年禮物—— webpack 官方中文社區成立

webpack中文官網
https://webpack-china.org/

gulp 和 webpack 的完美結合

gulp 負責 css 等，webpack 負責 js

教你一步步從零構建 webpack 開發多頁面環境

教你一步一步搭建 webpack 開發的多頁面項目

chrome插件開發簡介（一）——開發入門

chrome做爲目前最流行的瀏覽器，備受前端推崇，緣由除了其對於前端標準的支持這一大核心緣由以外，還有就是其強大的擴展性。 基於其開發規範實現的插件現在已經很是龐大，在國內也是欣欣向榮，如天貓開發了大量的擴展，用於檢測頁面質量以及頁面性能，淘寶開發了許多的擴展以供運營工具的優化…

分享7款個性化jQuery/HTML5地圖插件

如今咱們常常會用到一些地圖應用，不管是在網頁上仍是手機App中，地圖貌似是一個不可或缺的應用。本文將帶領你們一塊兒來看看一些基於jQuery和HTML5的個性化地圖插件，有幾款地圖比較實用，有些則是具備抽象的概念，頗有個性化。
這是一款基於HTML5的世界地圖應用，它的特色是能夠…

很是專業的 JavaScript 分類庫大全集錦

又大又全的 javascript 分類庫集錦， 包含前端，後端，移動端，博客等。自帶 github 關注度更新。包括 vue, react, node.js, angular 等知名框架以及相關。

溫馨的前端開發環境是怎樣一種體驗？

做者：Nicolas (滬江Web前端） 本文爲原創文章，轉載請註明做者及出處 本文的 webpack 代碼示例根據 webpack 2.7.0 編寫，並在 Mac 上正常運行。 去年一篇《在 2016 年學 JavaScript 是一種什麼樣的體驗？》嚇壞了不少想要入行新同窗…

[[譯] 前端調試技巧與訣竅](https://juejin.im/entry/5901e...

原文地址：Debugging Tips and Tricks 原文做者：SARAH DRASNER 譯文出自：掘金翻譯計劃 譯者：lsvih 校對者：loveky,ymz1124 前端調試技巧與訣竅 編寫代碼其實只是開發者的一小部分工做。爲了讓工做更有效率，咱們還必須精通 de…

還在爲線上 bug 沒法快速修復而被客戶抱怨嗎? 老司機帶你開發一個簡單的 chrome 插件輕鬆搞定.

由線上的一個工單想到的關於問題快速處理的解決方案: 採用 chrome 插件, 快速解決客戶的線上 bug; 注意: 這種方式的目的就是快速解決客戶的問題, 而且只是臨時修改. 修復補丁將會在下一次正式線上版本經過發佈後被忽略;

Stylelint: 咱們日夜期盼的樣式表Linter

每個程序員，不管他是寫哪一門語言的，都但願本身寫出乾淨整潔、一致性好的代碼。所以不少開發者習慣於對諸如Javascript和Python一類的編程語言啓用linter，可是卻很好少有人使用linter來規範樣式表。那麼在這篇文章中，就讓咱們來一睹stylelint1（一個應用於樣式表的linter）的真面目。

同時咱們也將瞭解到在樣式表中啓用校對的關鍵性，以及它是如何讓一個樣式表有序和避免錯誤的。最後，咱們將學會如何使用stylelint並儘快上手。
原文地址： https://www.smashingmagazine....

【譯】2017 年 6 月：15 個有趣的 JS 和 CSS 庫

6 月份，Tutorialzine 上的一些前端新鮮貨，但願你能找到喜歡的庫。

使用 CI 構建和發佈全平臺 Electron 應用

介紹一種簡單高效的方法構建併發布安裝包

【翻譯向】webpack2 指南（中）

webpack2 已經發布了，翻譯了一下官方指南。
包括內容：

• 動態模塊替換
• 開發環境配置
• 爲生產環境構建
• React 懶加載
• Public Path

內存分析與內存泄漏定位

不管是分佈式計算系統、服務端應用程序仍是 iOS、Android 原生應用都會存在內存泄漏問題，Web 應用天然也不可避免地存在着相似的問題。雖然由於網頁每每都是即用即走，較少地存在某個網頁長期運行的問題，即便存在內存泄漏可能表現地也不明顯；可是在某些數據展現型的，須要長期運行…

【翻譯向】webpack2 指南（下）

webpack2 官方指南翻譯，包括內容：

• 緩存
• 墊片（Shimming）
• 編寫一個庫

前端國際化

講解了前端國際化，何爲國際化以及國際化的方案。

webpack 基礎入門

webpack 基礎入門

讀前端中文文檔，來印記中文就對了，最權威的中文開發文檔

Vue/React/Webpack/PostCSS...咱們還在不斷地整合社區資源，同官方開展合做，爲中文社區開發者們提供最新最可靠的中文開發文檔，也歡迎有能力的同窗加入咱們一塊兒翻譯校對文檔。

代碼質量管控 -- 複雜度檢測

代碼的複雜度是評估一個項目的重要標準之一。較低的複雜度既能減小項目的維護成本，又能避免一些不可控問題的出現。然而在平常的開發中卻沒有一個明確的標準去衡量代碼結構的複雜程度，你們只能憑着經驗去評估代碼結構的複雜程度，好比，代碼的程度、結構分支的多寡等等。當前代碼的複雜度究竟是個什…

淘寶前端國際化方案探索

全球化、農村、雲計算大數據是咱們目前集團很是明確的將來戰略。全球化會讓咱們服務更多的人，服務全球範圍內的人。落實到咱們前端這塊就須要有一套國際化的方案，能爲海外用戶提供很是好的體驗，推動集團全球化進展。

活兒好又性感的在線 Mock 平臺 - Easy Mock

今天的數據，感謝你們的支持，有問題能夠加QQ羣反饋，實時答覆：595325417 什麼是 Easy Mock Easy Mock 是一個極其簡單、高效、可視化、而且能快速生成模擬數據的在線 mock 服務。以項目管理的方式組織 Mock List，能幫助咱們更好的管理 Moc…