書籍転載:JavaScriptライブラリ実践活用[厳選111]

書籍『Software Design plusシリーズ JavaScriptライブラリ実践活用[厳選111]』から18本の記事を転載。【完結】

WINGSプロジェクト
  • このエントリーをはてなブックマークに追加

書籍転載について

 本コーナーは、技術評論社発行の書籍『JavaScriptライブラリ実践活用[厳選111]』の中から、特にBuild Insiderの読者に有用だと考えられる項目を編集部が選び、同社の許可を得て転載したものです。

 『JavaScriptライブラリ実践活用[厳選111]』の詳細や購入は技術評論社のサイトをご覧ください。

 本書は、数あるJavaScriptのライブラリやjQueryプラグインから厳選したものを、その特徴からサンプルソースを付けた使用例まで111個を紹介します。取り上げるライブラリはそれぞれ「UI(ユーザインタフェース)編」「スマートフォン編」「フレームワーク編」「テスト編」「小ネタ編」に分けられており、デザイナも含むWebデベロッパー必携のライブラリ便覧です。

Part1 イントロダクション

はじめに~本書を活用するために
HTML5の基本
jQueryの基本

Part2 UI編

1 リストをリッチなメニューに整形する(Apycom Menu)
2 Googleマップと連携したページを手軽に作成する(Gmap3)
3 Twitterへのツイートをキーワード検索する(monitter widgets)
4 HTMLテーブルから棒グラフや折れ線グラフなどを生成する(Visualize)
5 レーティングバーを作成する(Star Rating)
6 画像/動画をズームアップ表示する(Zoombox)
7 画像スライダーを作成する(SliderKit)
8 はてなブックマークやTwitter/Facebookボタンをページに設置する(SocialButton)
9 RSSフィードをリスト表示する(zRSSFeed)
10 ティッカー式のニュースリストを生成する(vTicker)
11 コードリストを綺麗に表示する(Snippet)
12 フォームに検証機能を付与する(Validation)
13 ソート/ページング対応のリッチなグリッド表を作成する(TableFixedHeader)
14 ファイルアップローダーを作成する(Plupload)
15 本をめくるような動作を実装する(Booklet)
16 フラットなフォームをウィザード形式に整形する(FormToWizard)
17 動画サイトのコンテンツを簡単に取り込みたい(jquery.createvideo)
18 MP3ファイルの再生プレイヤーを設置したい(jMP3)
19 かっこいいセレクトボックスを作る(Chosen)
20 HTMLにclassを指定をするだけでグリッドレイアウトを実現する(Twitter Bootstrap)
21 HTMLにclassを指定をするだけでCoolなコンポーネントを作る(Twitter Bootstrap(コンポーネント))
22 HTMLにclassを指定をするだけで動的なUIを実現する(Twitter Bootstrap用カスタムjQueryプラグイン)
23 吹き出し風にツールチップを表示する(bubble-tooltip)
24 ドラッグ&ドロップで編集可能なフォルダーツリーを表示する(Folder tree with drag and drop)
25 モーダルダイアログを表示する(modal message)
26 スライドダウン(アコーディオン)メニューを表示する(slidedown-menu2)
27 縦書き表示にする(竹取JS)
28 Google Calendarライクなカレンダーコンポーネント(FullCalendar)
29 多彩な美しいグラフを描画する(jqPlot)
30 複数ファイルに対応したアップロードスクリプト(uploadify)
31 インタラクティブなグラフを表示する(Flot)
32 jQuery UIで典型的なUIをコーディングレスで作成したい(jQuery UI)
33 アコーディオン式のパネルを生成する(Accordion)
34 テキストボックスにオートコンプリート機能を付与する(AutoComplete)
35 日付選択ボックスを実装する(Datepicker)
36 汎用的なダイアログボックスを表示する(Dialog)
37 スライダーを作成する(Slider)
38 リサイズ可能なパネルを作成する(Resizable)
39 ドラッグ&ドロップ操作を可能にする(Draggable&Droppable)
40 クリック&ドラッグ操作で選択可能なリストを作成する(Selectable)
41 ドラッグ操作で要素の並び順を変更する(Sortable)
42 展開可能なメニューを生成する(Menu)
43 タブパネルを作成する(Tabs)
44 ツールチップを表示する(Tooltip)
45 LightBox風に角丸で画像をポップアップする(Facebox)
46 高機能なグリッドを表示する(jqGrid)
47 複数のメッセージを整列してポップアップ表示する(jquery-notice)
48 操作可能なドアノブ風グラフが描画できるライブラリ(jQuery Knob)
49 わずか6KBのカレンダーピッカー(jQuery.calendarPicker)
50 カーソル付近にローディング中アイコンを表示する(prettyLoader)
51 簡単にポップアップを実現するjQueryプラグイン(prettyPopin)
52 フォーム要素の見栄えを改善する(Uniform)

Part3 スマートフォン編

53 iPhone風UIのスマホサイトを作成する(iUI)
54 多彩なアニメーションで画面遷移できる(jqMini)
55 モバイルに特化したjQuery互換ライブラリでモバイルサイトを作成する(JqMobi)
56 スマートフォン向けのイベントを簡単に実装できる(QUOjs)
57 jQuery互換ライブラリZepto.JSを使用したモバイルサイトを作成する(Zoey)
58 Canvasを使ってFlashのような動きのあるコンテンツを作成する(jAction)
59 HTML5を使ってスマートフォン向けゲームを作成する(jAction(処理編))
60 モダンブラウザ用に最適化されたjQuery互換ライブラリで作成する(Zepto.JS)

Part4 小ネタ編

61 JavaScriptでクッキーを簡単に操作する(jquery.cookie)【2013年6月27日公開】
62 短くかつ安全で高性能なコードを書く(CoffeeScript)【2013年6月20日公開】
63 オブジェクト指向でコードを記述する(CoffeeScript)【2013年6月20日公開】
64 処理を短く記述する(CoffeeScript)【2013年6月27日公開】
65 HTML5+JavaScriptベースでゲームを作る(enchant.js)【2013年7月4日公開】
66 ブラウザ上でローカルにストレージを作る(jStorage)
67 SVG、VMLのグラフィックスライブラリ(Raphael)
68 入力補完ライブラリ(suggest.js)
69 JavaScriptベースのデータベース(TaffyDB)【2013年7月4日公開】

Part5 フレームワーク編

70 HTMLそのものをテンプレートとして動的な表示を実現する(Angular.js)【2013年5月23日公開】
71 ビューとコントローラーを紐付け、DOM更新のコードを省略する(Ember.js)【2013年5月16日公開】
72 Node.jsでWebアプリケーションを作る(Express.js(基礎編))
73 フレームワークを使ってNode.jsで効率的にWebアプリケーションを作る(Express.js)
74 RIA(Rich Internet Application)を開発する(Ext JS)
75 リッチな画面レイアウトを作成する(Ext JS)
76 シンプルで軽量なNode.js向けのフレームワーク(flatiron.js)
77 URLによって処理を分割する(Sammy.js)【2013年5月23日公開】
78 さまざまなライブラリを使って、高機能なWebアプリケーションを構築する(Yahoo! User Interface Library)
79 データをキー/値のペアでキャッシュする(【YUI】Cacheモジュール)
80 JSONPなど外部リソースからデータを取得する(【YUI】DataSourceモジュール)
81 ドラッグ&ドロップを実現する(【YUI】ドラッグアンドドロップモジュール)
82 ページのリフレッシュなしで遷移履歴を扱う(【YUI】Historyモジュール)
83 画像を必要なタイミングで読み込む(【YUI】ImageLoaderモジュール)
84 タブUIを実現する(【YUI】Tabviewウィジェット)
85 大規模なフレームワークでAjaxアプリケーションを作成する(qooxdoo)
86 MVCパターンでアプリケーションを構築する(Backbone.js)【2013年5月9日公開】
87 Backbone.jsのModelを操作し、イベントを購読する(Backbone.js)【2013年5月9日公開】
88 Backbone.jsのCollectionを操作し、イベントを購読する(Backbone.js)【2013年5月16日公開】
89 MVVMパターンでアプリケーションを構築する(Knockout)【2013年5月30日公開】
90 LINQ形式でコレクションを操作する(linq.js)
91 linq.jsのEnumerableとjQueryを相互に変換する(linq.jquery.js)
92 CoffeeScriptでMVCフレームワークを使う(batman.js)
93 CoffeeScriptで動的なアプリケーションを作成する(batman.js)
94 フレームワークを使って開発を楽にする(Spine.js)
95 MVCでアプリケーションを設計できる(Spine.js)
96 LINQ形式でObserverパターンを処理する(RxJS)
97 DOMイベントを起点とした処理をクエリ形式のメソッドチェーンで定義する(RxJS)
98 非同期処理をクエリ形式のメソッドチェーンで処理する(RxJS)
99 外部ファイル、Webサービスから取得したテンプレートとオブジェクトをバインドする(SNBinder)
100 さなざまなコレクション操作を行う(Underscore.js)【2013年6月6日公開】
101 テンプレートとオブジェクトから文字列を生成する(Underscore.js)【2013年6月6日公開】

Part6 テスト編

102 サーバを立ち上げ各ブラウザでテストができる(Buster.JS)
103 assert、should、expectという3種類の表現方法でテストをする(chai.js)
104 さまざまなブラウザ環境でJavaScriptのテストを行うことができる(JSTestDriver)
105 Node.jsでもブラウザでもシンプルにテストが記述できる(Mocha)
106 スタブやモック、フェイクオブジェクトを扱うライブラリ(Sinon.js)
107 さまざまな環境でのテスト結果を管理する(TestSwarm)
108 RSpec風の構文でBDD用のテストコードを記述する(Jasmine)【2013年6月13日公開】
109 JasmineのSpy機能でテストダブルを作成する(Jasmine)【2013年6月13日公開】
110 スタブ、モック、スパイといったテストダブルを作成する(JsMockito)
111 テストコードを実行し、ブラウザで結果を確認する(QUnit)【2013年5月30日公開】
サポートページ

Twitterでつぶやこう!


Build Insider賛同企業・団体

Build Insiderは、以下の企業・団体の支援を受けて活動しています(募集概要)。

ゴールドレベル

  • 日本マイクロソフト株式会社
  • グレープシティ株式会社