# 好用插件、外掛、套件、工具

###### tags:

## 1. [GitHub Copilot AI自動程式碼工具](https://useme.medium.com/%E8%83%BD%E7%AF%80%E7%9C%81%E5%9B%9B%E6%88%90%E9%96%8B%E7%99%BC%E6%99%82%E9%96%93%E7%9A%84%E5%B7%A5%E5%85%B7-github-copilot-%E7%9A%84%E4%BB%8B%E7%B4%B9%E8%88%87%E5%BF%83%E5%BE%97%E5%88%86%E4%BA%AB-2a07e8ce8f6d)
Copilot 是 GitHub 於 2021/06/29 推出的 AI 程式碼工具，基於 OpenAI 加上 GitHub 上大量的原始碼，在你寫程式的時候依照內文給予你相對應的建議。只要條件正確的確可以達到無腦 coding 的狀態

## 2.[Swiper](https://www.swiper.com.cn/)
[Swiper 使用方法](https://www.swiper.com.cn/usage/index.html)
[Swiper 基础演示](https://www.swiper.com.cn/demo/index.html)
常用于移动端网站的内容触摸滑动
Swiper是纯javascript打造的滑动特效插件，面向手机、平板电脑等移动终端。
能实现触屏焦点图、触屏Tab切换、触屏轮播图切换等常用效果。

## 3.[slick.js輪播套件](http://kenwheeler.github.io/slick/)
[官方中文版](https://www.slickjs.cn/)
[IT邦幫忙說明](https://ithelp.ithome.com.tw/articles/10277686)

## 4.[LIGHTBOX2 燈箱](https://lokeshdhakar.com/projects/lightbox2/)
點擊圖片會跳出圖片視窗

## 5.[Fancybox 燈箱](https://fancyapps.com/)
[中文說明](https://salongweb.com/fancybox3.html)
燈箱Fancybox、輪播圖Carousel、圖片放大Panzoom

## 6.[JQ Smoove 滾動效果](https://smoove.js.org/)
CSS3 滾動效果
Smoove可以輕鬆實現令人敬畏的CSS3過渡效果，使您的內容在您向下滾動頁面時平滑地滑入視圖。

## 7.[Locomotive Scroll 更流暢的視差滾動效果](https://github.com/locomotivemtl/locomotive-scroll)
[Demo](https://locomotivemtl.github.io/locomotive-scroll/)
[IT僧解說](https://it-monk.com/locomotive-scroll-%E6%9B%B4%E6%B5%81%E6%9A%A2%E7%9A%84-%E8%A6%96%E5%B7%AE%E6%BB%BE%E5%8B%95%EF%BC%8C%E5%8F%AA%E8%83%BD%E7%94%A8%E5%BE%AE%E5%A6%99%E5%BD%A2%E5%AE%B9%E7%9A%84%E6%BB%BE%E5%8B%95%E6%84%9F/)

## 8.[里程表odometer 套件](https://github.hubspot.com/odometer/)

## 9.[文字打字顯示效果 程式碼codepen](https://codepen.io/Chenyukai/pen/vyqXVy)

## 10.[Validate.js 驗證套件](https://validatejs.org/)
[助教講義](https://quip.com/6wbCAvu5OTmJ)

---
# 產生器

## 1.[簡易SVG動畫產生器vivus-instant](https://maxwellito.github.io/vivus-instant/)
在沒有JavaScript的情況下製作筆觸繪製動畫。
只需拖放基於筆觸的SVG並設置您的選項。
## 2.[CSS button generator 按鈕產生器](https://www.htmlcssbuttongenerator.com/css-button-generator.html)