2016年5月18日 ナレッジ

もっと早く、もっと簡単に。仕事がはかどるJavaScriptの最新おすすめライブラリ7選

JavaScriptの大きな魅力といえば、アニメーションやダイナミックなインターフェース、地図といったさまざまなライブラリを使うことで、仕事を簡単にそしてすばやくできることにあります。ここでは最新のおすすめJavaScriptライブラリを7つご紹介します。

 

1.VIEWER.JS

 
viewerjs
 
画像を閲覧するシンプルなイメージビューア。回転や拡大縮小、フルスクリーンモードにも対応しています。ポートフォリオや画像コンテンツを使う時に便利なライブラリですね。

動くサンプル・デモ https://fengyuanchen.github.io/viewerjs/
ドキュメント あり
GitHubでのプルリクエスト 0
GitHubでのIssue 9
GitHubのStar 1,617
GithubのURL https://github.com/fengyuanchen/viewerjs

 
 

2.JavaScript Load Image

 
JavaScript-Load-Image
 
「JavaScript Load Image」はファイルやBLOBオブジェクト、もしくはURLを経由してデータを読み込むためのライブラリ。拡大縮小やトリミングするためのツールも含まれており、またEXIF情報の解析や、サムネイルの抽出といった機能も提供されています。

動くサンプル・デモ https://blueimp.github.io/JavaScript-Load-Image/
ドキュメント あり
GitHubでのプルリクエスト 0
GitHubでのIssue 0
GitHubのStar 1,783
GithubのURL https://github.com/blueimp/JavaScript-Load-Image

 
 

3.THREE.JS

 
three
 
WebGLをJavaScriptから操作するためのライブラリです。WebGLを使ったサイトを作りたいデザイナーにもオススメです。

動くサンプル・デモ http://threejs.org
ドキュメント あり
GitHubでのプルリクエスト 113
GitHubでのIssue 558
GitHubのStar 25,038
GithubのURL https://github.com/mrdoob/three.js

 
 

4.LOUD LINKS

 
Loud-Links---A-simple-tiny-Javascript-library-to-add-interaction-sounds-to-your-website.
 
ウェブコンテンツにサウンドを追加するシンプルなライブラリ。HTML5の「audio」要素を使い、すべてのブラウザーでサポートされているmp3/oggデータを再生します。

動くサンプル・デモ http://loudlinks.rocks
ドキュメント あり
GitHubでのプルリクエスト 0
GitHubでのIssue 3
GitHubのStar 493
GithubのURL https://github.com/MahdiF/loud-links

 
 

5.jsonQ

 
jsonq
 
jsonQ」はjsonを手軽に扱う、便利な多機能ライブラリです。

動くサンプル・デモ なし
ドキュメント あり
GitHubでのプルリクエスト 1
GitHubでのIssue 2
GitHubのStar 77
GithubのURL http://ignitersworld.com/lab/jsonQ.html

 
 

6.DoSlide

 
DoSlide---A-Switch-Pattern
 
近年のリッチなウェブサイトで見られるフルサイズ表示のスクロールや、部分的なスクロール、スライダーを提供するライブラリ。非常に軽量なのも特徴です。

動くサンプル・デモ http://app.moptym.com/do-slide/
ドキュメント あり
GitHubでのプルリクエスト 0
GitHubでのIssue 0
GitHubのStar 50
GithubのURL https://github.com/MopTym/doSlide

 
 

7.pageSwitch

 
pageswitch
 
pageSwitch」はページ切り替えのエフェクトを作るためのライブラリ。シンプルなスクロールから、ぱたぱたとページが回転して切り替わるようなグラフィカルなものまで合計121ものアニメーションを搭載しています。

動くサンプル・デモ http://u.boy.im/pageswitch/pic.html
ドキュメント あり
GitHubでのプルリクエスト 0
GitHubでのIssue 3
GitHubのStar 164
GithubのURL https://github.com/qiqiboy/pageSwitch

 
 
以上、7つのJavaScriptライブラリをご紹介しましたがいかがでしたでしょうか?

最後に、ライブラリ選びのポイントの一例をご紹介します。

1. 動くサンプル・デモ,ドキュメントがあるかどうか
2. スマホ対応のライブラリであるかどうか
3. GitHubでソースが公開されている場合は★の数
4. GitHubでの最終更新日
5. GitHubでのプルリクエスト・Issueの数

皆様のお仕事のお役に立てば幸いです。
この記事の内容が良かったらシェアをお願いします!

 
 
▼おすすめ記事▼

2016-04-26
アプリ・ウェブシステムの受託開発を行いながら、自社のクラウドサービス開発を行う弊社アイスリーデザイン。既存Webシステム
2016-04-12
2月24日からGoogleの検索結果に表示されるようになった「Accelerated Mobile Pages (アクセ
2016-04-27
こんにちはi3DESIGN しばです。 先日(2016.04.26)の東京品川にて開催されたGoogle Deve