前端相關彙總

簡介

前端發展迅速，開發者富有的創造力不斷的給前端生態注入新生命，各類庫/框架/工程化構建工具層出不窮，眼花繚亂，不盲目追求前沿技術，學習框架和庫在知足本身開發需求的基礎上，而後最好能夠對源碼進行調研，瞭解和深刻實現原理，從中能夠得到更多的收穫

隨着前端發展，前端的職責也跟着變化，再也不僅僅是設計稿切圖+JS實現交互，已經能夠涉獵到後端，微信小程序，原生APP等領域，大前端，全棧開發，小程序開發，前端架構師，帶來了更多崗位選擇的同時，也是對自身技術一種挑戰

【前端彙總】這裏會對前端相關技術教程，開源框架，庫，工具等相關資源，進行分類記錄，持續更新，經過記錄共享能夠方便你們找到想要資源

---

IDE

• vscode 推薦
• sublime

---

LESS

• less css 預處理語言

---

SASS

• sass 成熟、穩定、強大的 css 擴展語言

---

JavaScript

• 前端資源教程 i5ting
• 廖雪峯JavaScript教程
• JavaScript 標準參考教程（alpha） -阮一峯
• JavaScript Promise迷你書 -azu
• 前端的異步解決方案之Promise和Await Async
• You Don't Know JS (book series)
• You Don't Need jQuery jQuery API 替代的方法
• JavaScript 祕密花園
• JavaScript 設計模式 系列 AlloyTeam

---

ES2015(ES6)

• 《ECMAScript 6入門》 -阮一峯
• EcmaScript6 全規範（含node） -ouvens
• 30分鐘掌握ES6/ES2015核心內容（上）
• 30分鐘掌握ES6/ES2015核心內容（下）

---

TypeScript

• TypeScript語法

---

NodeJS

• 七天學會NodeJS -Nanqiao Deng
• Node入門到精通 i5ting
• 高可用架構專用《全棧工程師之路-Node.js》 i5ting
• 先後端分離的思考與實踐

---

Babel

• babel 入門教程

---

Bower

• 基礎教程

---

Yeoman

• yeoman 安裝和使用 - 快速構建web應用

---

Gulp

• Gulp學習總結
• Gulp不徹底入門教程

---

Grunt

• 用grunt搭建自動化的web前端開發環境-完整教程

---

Webpack

• Webpack 官網
• Webpack 中文指南 -趙達
• Webpack，101入門體驗 -Yika
• Webpack 入門指迷 -題葉

---

Parcel

• 官方教程 Web應用打包工具，不須要任何配置

---

Vue

• vue2.0官方教程
• vue2.0 探索之路 生命週期和鉤子函數的一些理解

---

React

• react教程 中文版

---

AngularJS

• AngularJS入門教程
• AngularJS 菜鳥教程

---

微信小程序

• wepy 讓小程序支持組件化開發的框架 微信官方框架
• iview-weapp 一套高質量的微信小程序 UI 組件庫
• vant-weapp 贊移動端組件庫 Vant 的小程序版本
• minui 基於規範的小程序 UI 組件庫，自定義標籤組件，簡潔、易用、工具化
• wux-weapp 微信小程序自定義 UI 組件
• taro 支持用 React 的開發方式編寫一次代碼，生成能運行在微信小程序、H五、React Native 等的應用

---

測試

• Mock.js 生成隨機數據，攔截 Ajax 請求
• 測試框架 Mocha 實例教程 阮一峯

---

模塊化

• CommonJS 規範 阮一峯

---

Git

• Git教程

---

GitBook

• Gitbook 國外的在線markdown可編輯成書

---

經常使用前端插件

1.圖片：

• zooming 圖片縮放插件
• viewer 圖像查看器

2.富文本編輯器：

• kindeditor
• ueditor

3.日期插件：

• bootstrap-datepicker

4.表單驗證庫：

• jquery-validate 基於jquery
• 15個最佳的 JavaScript 表單驗證庫

5.圖表：

• echart 百度開源
• chartjs
• highcharts 商用收費

6.特效：

• swiper 滑動特效插件，內容觸摸滑動
• impress.js 幻燈片，前端裝X利器
• parallax 視覺差特效引擎
• fullPage 全屏滾動特效 jquery

7.各類功能：

• layer 彈窗（層）解決方案
• clipboard.js 複製,黏貼
• draggable 拖拽
• json editor json轉表單編輯

---

前端UI框架

• Element UI 基於vue2.0
• Vant 輕量、可靠的移動端 Vue 組件庫
• Bootstrap 當前最新到V4
• Layui UI組件
• WeUI 爲微信Web 服務量身設計

---

其餘

• iconfont [矢量圖標] 阿里雲矢量圖標庫，能夠在平臺裏構建本身的圖標庫

---

博客搭建

• Hugo[Go] 靜態網站生成器，託管第三方git平臺 Pages
• Hexo[nodejs] 可託管第三方git平臺 Pages
• Ghost [nodejs]
• jekyll 可託管第三方git平臺 Pages
• WordPress 須要服務器環境

---

Windows開發必備神器

• Cmder 一款超好用的工具cmder
• Scoop 軟件包管理系統，像 Mac 上的 Homebrew， Chocolatey，Homebrew-Cask
• Chocolatey 像一個軟件包管理工具（背後使用 Nuget ）

---

首發博客

歡迎star：《大話WEB開發》 Github