前端常常用到的UI framework、library

 

• [Day 01]Bootstrap - 最受歡迎的CSS framework
• [Day 02]Materialize - 遵循Google Material Design實作的CSS framework
• [Day 03]Office UI Fabric - 打造與Office365相同樣式的UI框架
• [Day 04]Animate.css - 1秒鐘為你的網站加上動畫特效
  • Hover.css
• [Day 05]WOW.js - 動畫很炫，也要看得到才行啊！
• [Day 06]loader.css - 就算loading中，也要很美觀才行
  • CSSPIN
  • SpinKit
  • Ladda
  • CSS Loader
• [Day 07]CKEditor - 最好用的Web版文字編輯器
  • TinyMCE
  • Summernote
  • Draft.js
• [Day 08]linkify.js - 自動加上超連結的小幫手
  • Autolinker.js
• [Day 09]highlight.js - 前端也能讓程式碼highlight顯示
• [Day 10]jquery.qrcode.js - 只靠前端也能產生QRCode
  • Browser Console QRCode
• [Day 11]FontAwesome - 最受歡迎的Icon Font - 超豐富圖示字型
  • WeatherIcons
  • IonIcons
  • Themify Icons
  • Material Icons
• [Day 12]toastr.js - 美化你的通知訊息
  • HubSpot Messenger
• [Day 13]SweetAlert - 變化萬千的Dialog library
  • Bootbox.js
  • Vex
  • SweetAlert for Bootstrap
  • ngSweetAlert
• [Day 14]Reveal.js - 用前端技術完成酷炫簡報
  • Deck.js
  • fullPage.js
• [Day 15]Intro.js - 把建好的UI直接變成說明文件
  • Focusable
  • BootstrapTour
• [Day 16]placehold.it - 規劃中網站用來暫時放圖片的線上服務
  • temp.im
  • lorempixum
  • Dummy Image
  • placekitten
  • Unsplash It
• [Day 17]Dropzone.js - 上傳檔案的好幫手
  • FineUploader：
  • jQueryFileUpload
  • Bootstrap File Input
  • Bootstrap Filestyle
• [Day 18]GitGraph.js - 畫出精美的Git分枝樹狀圖
• [Day 19]Dragula - 一步完成Drag & Drop
  • Sortable
  • Nestable
• [Day 20]screenfull.js - 全螢幕顯示就是這麼簡單
• [Day 21]FullCalendar - 輕鬆完成專業級行事曆
• [Day 22]Onsen UI - 專注於mobile web的UI框架
• [Day 23]Awesomplete - AutoComplete就這麼做
  • typeahead.js
• [Day 24]Switchery - 打造iOS風格的checkbox
• [Day 25]X-editable - 瀏覽、新增、修改三個願望一次滿足
• [Day 26]ClockPicker - 更直覺的時間選擇器
• [Day 27]jQuery Knob - 酷炫的數字選擇器
• [Day 28]PDF.js - 前端也能輕鬆顯示PDF
• [Day 29]jsPDF - 前端直接產生PDF也沒問題！
• [Day 30]Chart.js - 輕鬆完成資料視覺化
  • D3.js
  • C3.js
  • morris.js
  • jVetor Map
  • Highcharts

資料來源：https://ithelp.ithome.com.tw/users/20020617/ironman/988