從去年12月20開始參賽，原本是30天學習30套前端技術，途中就決定不間斷持續60天，每篇只有簡短的入門，希望透過短時間就了解套件功能、是否符合專案需求等；並在過程中落實MVP(Minimal Viable Product)的思維，在有限時間內學習、篩選實用項目做出整理並分享；使用上有問題或有其他推薦的套件可在各篇下回覆，thanks。

索引上分成【程式碼和編輯器】、【表單】、【捲軸】、【動畫和繪製】、【時間】、【排版】、【建議列表】、【影音】、【圖像】、【資料】和【組件】共11個項目，並依照JavaScripting的評分排序。

程式碼和編輯器

Ace

評分: 95%
可編輯式程式碼上色

highlight.js

評分: 90%
程式碼上色

Quill

評分: 90%
HTML編輯器

TinyMCE

評分: 79%
HTML編輯器

表單

Chosen

評分: 91%
下拉式選單優化

Fine Uploader

評分: 88%
拖曳式檔案上傳

jQuery Validation

評分: 88%
表單驗證

iCheck

評分: 16%
radio、checkbox美化

Cleave.js

評分: -
表單欄位格式化

捲軸

ScrollReveal

評分: 81%
動態顯示內容

iScroll

評分: 80%
拖曳式瀏覽效果

nanoScroller.js

評分: 66%
捲軸美化

Infinite Scroll

評分: -
表單載入內容

ScrollToFixed

評分: -
當捲軸至特定高度時，則物件釘住

動畫和繪製

Chart.js

評分: 97%
圖表繪製

Leaflet

評分: 97%
地圖繪製

three.js

評分: 97%
動畫繪製

Animate.css

評分: 94%
動畫效果

p5.js

評分: 87%
繪圖效果

Hover.css

評分: 85%
當滑鼠觸碰物件時，則產生動畫效果

Textillate.js

評分: 63%
文字效果

KUTE.js

評分: 44%
動畫繪製

sketch.js

評分: -
動畫繪製

時間

Moment.js

評分: 97%
時間格式轉換

FullCalendar

評分: 85%
全版行事曆

pickadate.js

評分: 81%
日期和時間選擇器

datedropper

評分: 54%
日期選擇器

Timeline.js

評分: -
時間軸效果

排版

reveal.js

評分: 91%
投影片效果

fullPage.js

評分: 88%
全頁式導覽

Parallax

評分: 85%
視差效果

Masonry

評分: 78%
排版優化

Muuri

評分: -
可拖曳排版

建議列表

typeahead.js

評分: 85%
產生建議列表

Algolia Places

評分: -
產生地址建議列表

影音

Videos.js

評分: 97%
影片播放器

howler.js

評分: 86%
聲音播放器

圖像

Swiper

評分: 93%
幻燈片/跑馬燈效果

lightgallery.js

評分: 72%
燈箱效果

JQuery lightSlider

評分: 57%
幻燈片/跑馬燈效果

Lazy Load

評分: -
圖片分批載入優化

資料

PDF.js

評分: 94%
PDF顯示器

Sortable

評分: 91%
可拖曳、排序清單

Faker.js

評分: 90%
假資料產生器

Handlebars.js

評分: 88%
模板效果

Store.js

評分: 87%
前端資料庫

List.js

評分: 82%
資料排序、搜尋和過濾

DataTables

評分: 77%
表格排序、搜尋和過濾

Tabulator

評分: 41%
表格內容強化

組件

clipboard.js

評分: 90%
複製貼上

Intro.js

評分: 90%
引導式教學

toastr

評分: 83%
提示訊息美化

Headroom.js

評分: 80%
導覽列優化

Slidebars

評分: 50%
側邊選單效果

ALERTIFY.js

評分: 67%
提示訊息美化

Toolbar.js

評分: 53%
工具列效果

Tabslet

評分: 33%
頁籤效果

goodshare

評分: -
社群分享套件

jquery-loading

評分: -
讀取效果

Shave

評分: -
文字截斷