久保田です。『HTML5ハイブリッドアプリ開発[実践]入門』という本を書きました。技術評論社より12月20日付けで発売されます。
![[iOS/Android対応] HTML5 ハイブリッドアプリ開発[実践]入門 (Software Design plus)]()
HTML5ハイブリッドアプリとは、通常のiOSアプリやAndroidアプリと同じようにストアからインストールできるけれども、アプリの内側ではHTML5などのウェブ技術で開発されているアプリです。AndroidやiOSなどの複数のプラットフォームに対応できる点や、標準化されているHTML5などのウェブ技術によって開発でき、かつモバイルOSのネイティブAPIを利用できる点などで注目を浴びています。
本書は、今までHTML5ハイブリッドアプリを開発したことがない人向けの入門的な内容から、ハイブリッドアプリの裏側の仕組みなどのアプリ開発に関わるエンジニアのための高度な知識まで、HTML5ハイブリッドアプリ開発に関することの多くを網羅した実践的な一冊です。
本書の内容は前半の基礎編と後半の実践編のふたつに分かれています。
基礎編では、HTML5によるハイブリッドアプリの概要、iOSやAndroidアプリの開発環境の構築、ハイブリッドアプリを開発するためのフレームワークであるApache Cordova(PhoneGap)の導入などの入門的な内容を解説しています。
後半の実践編では、より良いモバイルアプリを開発するための実践的なノウハウの紹介、モバイルアプリ特有の事情の紹介、ハイブリッドアプリ特有のデバッグ手法やセキュリティに関する知識、アプリ開発に使える各種ストレージの解説、WebViewを使ったハイブリッドアプリの裏側の仕組み、WebViewの使い方などの実際にアプリを開発する際に必要となる知識を解説しています。
筆者が実際に関わったHTML5ハイブリッドアプリ開発やハイブリッドアプリ開発プラットフォームであるMonacaでの開発で得られた知識やノウハウなどをこの一冊に集約しています。本のタイトルには「入門」という言葉がついていますが、入門的な内容だけではなくHTML5ハイブリッドアプリに関する高度な内容も多く記述しています。
以下、目次です。
発売日は12月20日ですが早い書店だともう並んでいるようです。Kindle版も同時発売です。HTML5ハイブリッドアプリに興味がある方は是非読んでみてください。
![[iOS/Android対応] HTML5 ハイブリッドアプリ開発[実践]入門 (Software Design plus)](http://ecx.images-amazon.com/images/I/51IqDrBDBsL.jpg)
HTML5ハイブリッドアプリとは
HTML5ハイブリッドアプリとは、通常のiOSアプリやAndroidアプリと同じようにストアからインストールできるけれども、アプリの内側ではHTML5などのウェブ技術で開発されているアプリです。AndroidやiOSなどの複数のプラットフォームに対応できる点や、標準化されているHTML5などのウェブ技術によって開発でき、かつモバイルOSのネイティブAPIを利用できる点などで注目を浴びています。
本書は、今までHTML5ハイブリッドアプリを開発したことがない人向けの入門的な内容から、ハイブリッドアプリの裏側の仕組みなどのアプリ開発に関わるエンジニアのための高度な知識まで、HTML5ハイブリッドアプリ開発に関することの多くを網羅した実践的な一冊です。
内容
本書の内容は前半の基礎編と後半の実践編のふたつに分かれています。
基礎編では、HTML5によるハイブリッドアプリの概要、iOSやAndroidアプリの開発環境の構築、ハイブリッドアプリを開発するためのフレームワークであるApache Cordova(PhoneGap)の導入などの入門的な内容を解説しています。
後半の実践編では、より良いモバイルアプリを開発するための実践的なノウハウの紹介、モバイルアプリ特有の事情の紹介、ハイブリッドアプリ特有のデバッグ手法やセキュリティに関する知識、アプリ開発に使える各種ストレージの解説、WebViewを使ったハイブリッドアプリの裏側の仕組み、WebViewの使い方などの実際にアプリを開発する際に必要となる知識を解説しています。
筆者が実際に関わったHTML5ハイブリッドアプリ開発やハイブリッドアプリ開発プラットフォームであるMonacaでの開発で得られた知識やノウハウなどをこの一冊に集約しています。本のタイトルには「入門」という言葉がついていますが、入門的な内容だけではなくHTML5ハイブリッドアプリに関する高度な内容も多く記述しています。
以下、目次です。
- PART
1 基礎編 第1章 ▶ HTML5ハイブリッドアプリとは - 1.1
HTML5ハイブリッドアプリの概要 - 1.2
アプリ開発の課題 - 1.2.1
マルチプラットフォーム対応の必要性 - 1.2.2
マルチプラットフォーム対応の難しさ - 1.3
HTML5ハイブリッドアプリの登場 - 1.4
アプリケーションの型 - 1.4.1
ネイティブアプリ - 1.4.2
Webアプリ - 1.4.3
ハイブリッドアプリ - 1.5
ハイブリッドアプリの仕組み - 1.6
ハイブリッドアプリの利点 - 1.7
ハイブリッドアプリの欠点 - 1.8
ハイブリッドアプリの事例 - 1.9
まとめ - 第2
章 ▶ ハイブリッドアプリ開発の基盤 - 2.1
Web 技術 - 2.1.1
HTML - 2.1.2
CSS - 2.1.3
JavaScript - 2.1.4
ライブラリ・フレームワーク - 2.2
WebKitレンダリングエンジンの開発環境 - 2.3
iOSの開発環境 - 2.3.1
iOSアプリの開発環境を構築する - 2.3.2
必要とする環境 - 2.3.3
Xcodeをインストールする - 2.3.4
Xcodeを起動する - 2.3.5
新しいプロジェクトを作成する - 2.3.6
プロジェクトを編集する - 2.3.7
プロジェクトを実行する - 2.3.8
実機での開発 - 2.4
Android の開発環境 - 2.4.1
Android（Android SDK＋Eclipse）の開発環境を構築する - 2.4.2
必要とする環境 - 2.4.3
Android SDKをインストールする - 2.4.4
プロジェクトの作成 - 2.5
まとめ - 第3
章 ▶ ハイブリッドアプリ開発のためのフレームワーク - 3.1
フレームワークの概要 - 3.2
フレームワークは何をしてくれるのか - 3.3
Cordova（PhoneGap） - 3.4
Triaina - 3.5
フレームワークを利用しない場合 - 3.6
サーバ・クラウド環境 - 3.6.1
PhoneGap Build - 3.6.2
Trigger.io - 3.6.3
Monaca - 3.6.4
Icenium - 3.7
まとめ - 第4章
▶ Cordovaを用いたアプリ開発の流れ - 4.1
Cordovaを用いた開発環境を構築する - 4.1.1
Node.js のインストール - 4.1.2
cordova のコマンドラインツールをインストールする - 4.1.3
プロジェクトを作成する - 4.1.4
Android 向けのコンポーネントをインストールする - 4.1.5
プロジェクト構造を確認する - 4.1.6
Androidエミュレータを利用する - 4.1.7
iOSシミュレータを利用する - 4.1.8
実機でプロジェクトを実行する - 4.1.9
基本的な開発の流れを理解する - 4.1.10
ブラウザで確認する - 4.1.11
cordovaコマンドの管理 - 4.2
Cordovaを用いてアプリを開発する - 4.2.1
www ディレクトリ以下の構造を確認する - 4.2.2
index.html - 4.2.3
cordova.js - 4.2.4
devicereadyイベント - 4.3
アプリの設定 - 4.3.1
config.xmlの構造 - 4.3.2
アプリに関する設定 - 4.3.3
設定を反映させる - 4.3.4
Android 特有の設定項目 - 4.3.5
iOS 特有の設定項目 - 4.3.6
アプリのアイコンを設定する - 4.3.7
アプリのスプラッシュスクリーンを設定する - 4.3.8
ドメインホワイトリストを設定する - 4.4
プラットフォームごとにカスタマイズする - 4.4.1
HTML5 側をプラットフォームごとに切り替える - 4.4.2
ネイティブ側をプラットフォームごとに切り替える - 4.5
Cordovaプラグインを利用する - 4.5.1
プラグインを導入する - 4.5.2
プラグインを管理する - 4.5.3
プラグインのインストールを理解する - 4.5.4
プラグインの仕組み - 4.5.5
組み込みプラグインの一覧 - 4.5.6
Android 向けのCordovaプラグインを実装する - 4.5.7
Android 向けのプラグイン開発の詳細 - 4.5.8
iOS 向けのCordovaプラグインを実装する - 4.5.9
cordovaコマンドからインストールできるプラグインを実装する - 4.6
その他のコマンドの解説 - 4.7
既存のアプリにCordovaを組み込む - 4.7.1
Cordovaフレームワークのダウンロード - 4.8
Android のプロジェクトにCordovaフレームワークを導入する - 4.8.1
画面の一部でCordovaを用いる - 4.9
iOSのプロジェクトにCordovaフレームワークを導入する - 4.9.1
画面にCordovaを用いる - 4.9.2
wwwディレクトリに配置する - 4.9.3
Cordovaフレームワークを呼び出すコードを記述する - 4.10
plugmanコマンドを使ってCordovaプラグインを導入する - 4.10.1
plugmanコマンドのインストール - 4.10.2
plugmanコマンドを使ってCordovaプラグインを導入する - 4.11
まとめ - PART
2 実践編 第5章 ▶ より良いアプリを開発するためのテクニック - 5.1
aタグやclickイベントは使わない - 5.1.1
Tappableを使う - 5.1.2
FastClickを使う - 5.2
jQueryの代わりにZepto.jsを利用する - 5.2.1
Zepto.js の導入 - 5.2.2
Zepto.jsを利用する - 5.3
ダイアログを表示する - 5.3.1
Cordova のNotificationプラグインを利用する - 5.4
タップ時のハイライトを消す - 5.5
ポップアップメニューを消す - 5.6
ユーザが文字を選択できないようにする - 5.7
コンテンツの一部に慣性スクロールを用いる - 5.8
iOS版よりもAndroid 版を先に開発する - 5.9
インジケータを利用する - 5.9.1
Spin.jsの導入 - 5.10
文字の大きさの自動調整を無効にする - 5.11
DOMツリーに加える変更を減らす - 5.11.1
再描画のコストを減らす - 5.11.2
DOM 操作の繰り返しが描画を遅くする - 5.11.3
DOM への挿入を一度にまとめる - 5.11.4
一度DOMツリーから切り離して操作した後に挿入する - 5.12
レイアウトの再計算のコストを抑える - 5.12.1
レイアウトの再計算について - 5.12.2
要素の大きさを固定する - 5.12.3
絶対位置を指定する - 5.12.4
CSS Transformsを用いる - 5.12.5
DOMツリーを複雑にしない - 5.13
実機で確認する - 5.13.1
iOSシミュレータの欠点 - 5.13.2
Androidエミュレータの欠点 - 5.14
JSONを扱う - 5.14.1
JSONをパースする，JSON に変換する - 5.14.2
JSON の文法 - 5.14.3
JSON の誤ったパース - 5.15
CSSアニメーションを利用する - 5.15.1
JavaScriptでアニメーションしない - 5.15.2
CSSアニメーションとは - 5.15.3
transitionスタイルプロパティを使う - 5.15.4
JavaScriptからCSSアニメーションを利用する - 5.15.5
CSSアニメーション関連のイベントを把握する - 5.15.6
CSSアニメーションをJavaScriptからキャンセルする - 5.15.7
CSSアニメーションをより滑らかに描画する - 5.15.8
iOS 端末でのちらつきを抑える - 5.16
アプリを実行している端末の情報を得る - 5.16.1
ユーザエージェントからプラットフォームを判別する - 5.16.2
Cordova（PhoneGap）を用いて端末の情報を取得する - 5.17
Android 4.03のWebViewとassetに関するバグに対処する - 5.17.1
バグを再現する - 5.18
Androidデバイスのボタンに対応する - 5.18.1
Cordovaを使っている場合 - 5.18.2
WebViewの場合 - 5.19
イベントの移譲 - 5.19.1
イベントバブリング - 5.19.2
イベントの移譲 - 5.19.3
Zepto.jsを使ったイベントの移譲 - 5.20
HTML5とネイティブの切り分け - 5.20.1
HTML5だけですべて実装できない状況 - 5.20.2
ある画面・ある箇所のみネイティブで実装する - 5.20.3
HTML5とネイティブとの弱点を補い合う - 5.21
まとめ - 第6章
▶ ストレージ - 6.1
ストレージの概要 - 6.2
WebStorage - 6.3
LocalStorage - 6.3.1
HTML5 ハイブリッドアプリでの利用 - 6.3.2
Android のWebViewで利用する - 6.3.3
iOS のUIWebViewクラスで利用する - 6.3.4
データを保存する - 6.3.5
データにアクセスする - 6.3.6
データを削除する - 6.3.7
容量の制限 - 6.3.8
残りの容量を知る - 6.3.9
利用シーン - 6.4
SessionStorage - 6.4.1
性質 - 6.4.2
LocalStorageと同じAPI - 6.4.3
Android，iOS のWebViewで利用する - 6.4.4
容量 - 6.4.5
利用シーン - 6.5
ファイルストレージ - 6.5.1
ファイルストレージAPIとは - 6.5.2
実装されているAPI - 6.5.3
セットアップ - 6.5.4
ファイルストレージAPI の利用 - 6.5.5
ファイルの読み込み - 6.5.6
ファイルを書き込む - 6.5.7
ファイルをテキストとして読み込む - 6.5.8
ファイルやディレクトリの移動・コピー・削除・その他の操作 - 6.5.9
ファイルストレージの詳細 - 6.5.10
制限 - 6.5.11
利用シーン - 6.6
WebSQLデータベース - 6.6.1
WebSQLデータベースの概要 - 6.6.2
Androidで利用する - 6.6.3
iOSで利用する - 6.6.4
CordovaのWebSQLデータベースを用いる - 6.6.5
利用できるSQL - 6.6.6
データベースの利用 - 6.6.7
データベーステーブルの作成 - 6.6.8
トランザクションの発行 - 6.6.9
トランザクション内でロールバックする - 6.6.10
明示的にロールバックする - 6.6.11
読み込み専用のトランザクションを発行する - 6.6.12
SQLを発行する - 6.6.13
プレースホルダ - 6.6.14
マイグレーション - 6.6.15
SQLite のバージョンを調べる - 6.6.16
外側から実体ファイルを取り出してSQLiteで操作する - 6.6.17
利用シーン - 6.7
モバイルBaaS - 6.7.1
モバイルBaaSがやってくれること - 6.7.2
モバイルBaaS の紹介 - 6.7.3
オープンソースのモバイルBaaS - 6.7.4
利用シーン - 6.8
まとめ - 第7
章 ▶ モバイル特有の事情 - 7.1
タッチの検知 - 7.1.1
JavaScriptから扱うイベント - 7.1.2
touchenter，touchleaveイベント - 7.1.3
イベントのプロパティ - 7.1.4
タッチオブジェクト - 7.1.5
タッチ座標を得る - 7.1.6
スクロールを防止する - 7.1.7
Chromeでタッチイベントを発生させる - 7.1.8
マウス関連のイベントの兼ね合い - 7.1.9
マウス関連のイベントを利用しない - 7.1.10
Androidでtouchstartイベントとtouchendイベントがしばしば対応しない - 7.2
ジェスチャの検知 - 7.2.1
ジェスチャイベント - 7.2.2
Androidでもジェスチャを検知するには - 7.3
ジェスチャを判別するライブラリ - 7.4
端末のオリエンテーション - 7.4.1
端末のオリエンテーションを知る - 7.4.2
端末のオリエンテーションが変わるときを検知する - 7.4.3
端末のオリエンテーションをメディアクエリから扱う - 7.4.4
Android 4.03 のメディアクエリにオリエンテーションを指定するときのバグ - 7.4.5
オリエンテーションを判別するメディアクエリをJavaScript から呼び出す - 7.4.6
オリエンテーションに対応しないという選択肢もある - 7.5
viewportに対応する - 7.5.1
viewportとは - 7.5.2
基本 - 7.5.3
パラメータ - 7.5.4
iPhone，iPod touch 向けベストプラクティス - 7.5.5
Androidでのviewport - 7.5.6
target-densitydpiパラメータを指定する - 7.5.7
densityの違いを検証する - 7.5.8
target-densitydpiパラメータを指定したときのレイアウト - 7.5.9
width パラメータをJavaScriptでエミュレーションする - 7.6
まとめ - 第8
章 ▶ デバッグ - 8.1
weinreによるWebインスペクタ - 8.1.1
weinreでできること - 8.1.2
weinre の導入 - 8.2
iOSでのリモートWebインスペクタ - 8.2.1
利用できる機能 - 8.2.2
利用するための準備 - 8.2.3
リモートWebインスペクタを開く - 8.3
Chrome のリモートWebインスペクタ - 8.3.1
Android 4.4 以降でChrome のインスペクタを利用する - 8.4
AndroidでJavaScript のエラーやログを記録する - 8.4.1
Androidアプリのログを取得する - 8.4.2
エラーログを記録する - 8.5
まとめ - 第9
章 ▶ メモリの計測・節約 - 9.1
メモリ節約の重要性 - 9.1.1
メモリスワッピングを利用できないiOSとAndroid - 9.2
iOSやAndroid 端末のメモリ容量 - 9.2.1
iOS 端末の持つメモリ容量 - 9.2.2
Android 端末の持つメモリ容量 - 9.3
メモリ使用量を計測する - 9.3.1
仮想メモリ - 9.3.2
iOSでメモリを計測する - 9.3.3
Androidでメモリを計測する - 9.4
メモリを節約するテクニック - 9.4.1
HTML5 ハイブリッドアプリが消費するメモリ - 9.4.2
JavaScript のメモリ管理 - 9.4.3
サイズの大きな画像の利用を抑える - 9.4.4
オブジェクトをプールする - 9.4.5
JavaScriptで必要のない参照をしない - 9.5
まとめ - 第10
章 ▶ HTML5ハイブリッドアプリのセキュリティ - 10.1
Webアプリとは違ったHTML5ハイブリッドアプリのセキュリティ問題 - 10.2
Android・iOSのサンドボックス - 10.2.1
サンドボックスとは - 10.2.2
iOS のサンドボックス - 10.2.3
Android のサンドボックス - 10.3
HTML5ハイブリッドアプリでのXSSの危険性 - 10.3.1
XSSを通じてネイティブブリッジを利用される - 10.3.2
iOS の場合の危険性 - 10.3.3
Android の場合の危険性 - 10.4
改ざんやコードをのぞかれる可能性を考慮する - 10.4.1
Android のapkパッケージに含まれているリソースを取り出す - 10.4.2
iOS のipa パッケージに含まれているリソースを取り出す - 10.4.3
パッケージの内容の盗難・改ざんを考慮する - 10.5
console.logメソッドを用いて大事な情報を書き込まない - 10.6
まとめ - 第11章
▶ JavaScriptとネイティブとのブリッジ - 11.1
JavaScript からネイティブの機能を呼び出すいくつかの方法 - 11.2
ネイティブブリッジに必要とされる要件 - 11.3
addJavascriptInterface 方式 - 11.3.1
実装 - 11.3.2
値の受け渡し - 11.3.3
Java 側ではスレッドセーフにする - 11.3.4
適用範囲の制限 - 11.3.5
セキュリティ上の懸念 - 11.3.6
公開するメソッドを制限する - 11.4
ネイティブからJavaScriptへ値を渡す - 11.4.1
iOS の場合 - 11.4.2
Android の場合 - 11.4.3
値を渡す - 11.5
カスタムURL スキーム方式 - 11.5.1
Androidでの実装 - 11.5.2
iOSでの実装 - 11.6
iOSで特定のページの読み込みを制限する - 11.6.1
webView:shouldStartLoadWithRequest:navigationType:を用いる - 11.6.2
NSURLProtocolクラスを用いる - 11.7
JsAlert 方式 - 11.7.1
実装 - 11.8
ローカルHTTPサーバ方式 - 11.8.1
ローカルにHTTP サーバを構築する - 11.8.2
トークンによる利用の制限 - 11.9
まとめ - 第12
章 ▶ WebViewを使ってHTML5ハイブリッドアプリを開発する - 12.1
Android のWebViewを使ってHTML5ハイブリッドアプリを開発する - 12.1.1
WebViewを表示する - 12.1.2
WebViewを設定する - 12.1.3
WebSettingsを設定する - 12.1.4
WebViewClientを設定する - 12.1.5
WebChromeClientを設定する - 12.1.6
ダイアログを設定する - 12.1.7
consoleオブジェクトの挙動を設定する - 12.1.8
アクティビティのライフサイクルに対応する - 12.1.9
WebViewからJavaScriptを実行する - 12.2
iOSのWebViewを使ってHTML5ハイブリッドアプリを開発する - 12.2.1
基本となるコード - 12.2.2
UIWebViewクラスを設定する - 12.2.3
UIWebViewDelegateを設定する - 12.2.4
ViewControllerクラスが破棄されたときにUIWebViewオブジェクトを破棄する - 12.3
まとめ - コラム：アプリのマーケット公開のポイント
終わりに
発売日は12月20日ですが早い書店だともう並んでいるようです。Kindle版も同時発売です。HTML5ハイブリッドアプリに興味がある方は是非読んでみてください。