cdnjs(cdnjs.com)とは
世界で最も利用されている「無料のCDN(コンテンツ配信ネットワーク)型ライブラリ配信サービス」のひとつです。
jQuery、Swiper、GSAP、Vue.js など、Web制作でよく使われる JavaScript・CSS ライブラリを 高速・安定・無料 で読み込むことができます。
Cloudflare が提供しているため、配信スピードが非常に高速で、商用利用も追加契約なしで可能です。
初心者が JavaScript のライブラリを使う際によく利用する、非常に便利なサービスです。
主な機能・特徴
| 数万種類のライブラリを配信 | jQuery、GSAP、Swiper、Bootstrap、Font Awesomeなど有名なライブラリがほぼコンプ! |
| 高速配信 | 世界中のサーバーから配信されるため、読み込みが速く安定 |
| バージョンを自由に選べる | 過去バージョンも含め、必要なバージョンを選んで読め込めます |
| コピペで導入可能 | スクリプトタグやリンクタグをコピーして HTML に貼るだけ |
| 無料で利用可能 | 個人、商用問わず無料!登録やログインも不要 |
活用例
- Query や Swiper を Webサイトで使いたい
- サーバーにファイルを置かずにライブラリを読み込みたい
- 高速で安定した CDN を使いたい
- GSAP などアニメーションライブラリを簡単に導入したい
- ブログやLPで軽量に外部ライブラリを使いたい
特に 初学者がjQuery・Swiperを使う時の最も簡単な読み込み方法として使われます。
使い方
インストール不要、ログイン不要!
cdnjs は「スクリプトURLをコピーして HTML に貼るだけ」で利用できます。
1.必要なライブラリ名を検索
サイトへアクセスし、トップページ、または「Libraries」の検索ボックスで必要なライブラリ名を検索。
「jquery」「swiper」「gsap」「bootstrap」などスペルミスには要注意!

2.ライブラリを選ぶ
検索結果から目的のライブラリをクリック!
3.バージョンを選ぶ
ページ内に「最新バージョン」や「過去バージョン」が表示されます。
通常は 最新(一番上) を選んでOKです。

4. コードをコピー
「Copy URL」や「Copy Script Tag」などのボタンがあるので、クリックしてコピー!
※Swiper のように CSS と JS の両方が必要な場合は、両方コピーします
5. HTML に貼り付ける
「head」内、または「body」の直前に貼りつけ!
サービスについて
cdnjs 自体の利用は無料で、特に個人・商用の区別もなく利用できます。
注意点:
- ・配信されているライブラリごとのライセンスに従う必要がある
- ・Cloudflare の一般的な利用規約が適用される
- ・利用停止の保証はない(あくまで無償サービス)
一般的なWeb制作の範囲であれば、問題なく利用できます。
| 料金 | 無料 |
| 対応レベル | 初級者~上級者 |
| 登録・ログイン | 不要 |
| 規約等 | 公式サイト |
※掲載内容は変更される場合があります。必ず【公式サイト】で確認後、自己責任でご利用ください。
注意点
※外部CDNに依存するため、オフラインでは動作しないため、ネットがない環境やローカルプレビューだけでは読み込めない場合があります
※まれに最新バージョンが未登録の場合があります
※セキュリティアップデートは手動(使用しているバージョンは自動更新されず、最新にしたい場合は自分で変更)

