紀錄前端常會有用的 plugin / framework

JS Framework

• AngularJS
  • https://angularjs.org/
• jQuery
  • https://jquery.com/

HTML Framwork

• Bootstrap
  • http://getbootstrap.com/

Table

• DataTables
  • https://datatables.net/
• AngularJS DataTables
  • https://l-lin.github.io/angular-datatables/
• Angular UI Grid
  • http://ui-grid.info/
  • https://github.com/angular-ui/ui-grid

Checkbox / RadioButton

• iCheck
  • http://icheck.fronteed.com/

Dropdown

• Bootstrap Multiselect
  • http://davidstutz.github.io/bootstrap-multiselect/

Slider

• slick
• http://kenwheeler.github.io/slick/
• https://github.com/kenwheeler/slick/

Chart

• HighCharts
  • http://www.highcharts.com/

Editor

• Summernote
  • http://summernote.org/
• TinyMCE
  • https://www.tinymce.com/

Drag and Drop

• jQuery UI sortable
  • https://jqueryui.com/sortable/
• GridStack.js
  • https://troolee.github.io/gridstack.js/

Font Icon

• Font Awesome
  • http://fontawesome.io/

ToolTip

• powertip
• https://stevenbenner.github.io/jquery-powertip/
• https://github.com/stevenbenner/jquery-powertip

Tag

• Bootstrap Tags Input
  • https://bootstrap-tagsinput.github.io/bootstrap-tagsinput/

Autocomplete

• Typehead.JS
  • https://github.com/twitter/typeahead.js/

Tree

• jsTree
  • https://www.jstree.com/

Validate

• Bootstrap Validator
  • http://1000hz.github.io/bootstrap-validator/

File upload

• DropzoneJS
  • http://www.dropzonejs.com/
  • https://github.com/enyo/dropzone

Dialog boxes

• Bootstrap Bootbox.js
  • http://bootboxjs.com/

Confirmation dialogs

• Bootstrap Confirmation
  • https://ethaizone.github.io/Bootstrap-Confirmation/

Scroll

• slimScroll
  • http://rocha.la/jQuery-slimScroll
  • https://github.com/rochal/jQuery-slimScroll
• perfect-scrollbar
• http://noraesae.github.io/perfect-scrollbar/
• https://github.com/noraesae/perfect-scrollbar

Block

• BlockUI
  • http://jquery.malsup.com/block/

Animate

• jQuery Easing
  • http://gsgd.co.uk/sandbox/jquery/easing/
• Animate.css
• https://daneden.github.io/animate.css/
• https://github.com/daneden/animate.css

Date library

• Moments.js
  • http://momentjs.com/

Map

• TinyMap
• https://code.essoduke.org/tinyMap/
• https://github.com/essoduke/jQuery-tinyMap

File Create

• jsPDF
• http://rawgit.com/MrRio/jsPDF/master/
• https://github.com/MrRio/jsPDF
• 心得
• TeHsien: 在 html to PDF 這一段，目前仍存在不少問題待解決，還不是很好用。
• html2Canvas
• http://html2canvas.hertzen.com/
• https://github.com/niklasvh/html2canvas
• 心得
• TeHsien: 目前有解析度不佳、瀏覽器相容性的問題。
• html2pdf
• https://github.com/eKoopmans/html2pdf
• 範例
• https://jsfiddle.net/tvyux7eo/1/
• 心得
• TeHsien: 相依於 jsPDF 與 html2Canvas，是作者整合2者後的套件。且還額外在 html2Canvas 加入解析度、縮放比例的參數，可讓原生套件解析度不佳的問題改善(但還是不完美)。

Promise

• es6-promise
• https://github.com/stefanpenner/es6-promise
• when
• https://github.com/cujojs/when

縮放 & 裁切 圖片

• Cropper
• https://fengyuanchen.github.io/cropper/
• https://github.com/fengyuanchen/cropper

行動裝置觸控針測

*Hammer.js  * http://hammerjs.github.io/  * https://github.com/hammerjs/hammer.js