開発者のためのChromeガイドブック (Google Expert Series)
「開発者のためのChromeガイドブック」を読了した。著者のひとりである吉川徹さんから頂きました。ありがとうございます。著者全員のサインももらっちゃった。
本書は Chrome 使っているなら、手元にあるとても便利な1冊だと思う。
Chrome APIやChromeウェブストアを利用しない、普通のWeb開発者でもデベロッパーツールの章は役に立つ。普段からデベロッパーツールを使っているけど、知らないことがたくさんあった。
内容紹介
Googleの考えるウェブの未来、それは「ウェブはアプリケーションプラットフォームである」ということです。 Chromeブラウザにはウェブアプリケーションで従来の制約にとらわれない機能を実現するためのAPIが数多く用意されています。
加えて、Chromeウェブストアでは開発者がウェブアプリケーションを公開・配布できます。
また、Chromeのデベロッパーツールを利用すればこれらの開発/デバッグ環境として使用することさえ可能です。
本書はそのすべてを解説する史上初の書籍です!
本書は大きく3つの章がある。どれも日本語のまとまった資料が少ないので、こうやって1冊にまとまってるとうれしい。
Chrome API
「Chrome API」では Chrome拡張機能(Chrome Extension)の作り方や、Chrome アプリの作り方が、サンプルアプリとともに紹介されている。
僕は Chrome Extension を作ったことがあるけど、初めて作るとそれなりに大変だった。 基本的なHTMLやJavaScriptはわかるんだけど、自分のやりたいことを実現するために、ChromeのどんなAPIを使えばいいのか、そもそもExtensionのファイル構成はどうなっているのか、というのがわからなかったから。
例えば、こういうこと。
- content script と background page のどっちに何を書けばいいの?
- 情報を取ってきてポップアップを出したいんだけど、どこにコード書いて、取ってきた情報をどうやって埋め込めばいいの?
もちろんちゃんとドキュメント読めばできるけど。
本書では、Extensionの仕組みから、実際にどうやって書いていけばいいのか、までちゃんと書いてある。
Chrome ウェブストア
Chrome ウェブストア、使ってる人ってどれくらいいるんだろう。僕はCodeGridを購読しているくらい。
Chrome ウェブストア自体の概要や、アプリケーションの登録の仕方が丁寧に解説されている。 テスターアカウントという仕組みがあるのは初めて知った。テスターアカウントを作ることで、クローズドβテストもできる。
Chrome ウェブストアの魅力は、マネタイズの方法がちゃんと準備さていることだと思う。アプリ自体の販売には、Chromeウェブストア決済が利用できる。拡張機能はChromeウェブストア決済ができない。
この Chromeウェブストア決済 の手順などが、本書では詳しく解説されている。こういうお金が絡むところは、けっこう複雑だり、全体の流れがわかりにくかったりするので、Chromeウェブストア決済を利用したいのであれば、とても参考になると思う。
デベロッパーツール
個人的にはいちばん参考になった。デベロッパーツールは毎日のように使っているけど、Chromeのアップデートとともにどんどん新しい機能が増えているから、知らないことも多かった。たくさんある機能を、ちゃんと使っていかなくては。
地味だけど知って嬉しかったこと。
- 表示位置設定ボタンを長押しすると、縦・横・新しいウィンドを選べる
縦と新しいウィンドは知っていたけど、長押しできたとは…。なんか一時期横にしか出なくなって、困ってた。初期設定が変わったか、知らないうちに長押ししてたんだろうな。
- 全文検索(Mac:Commnd+Alt+f, Win:Ctrl+Shift+f)
普通の検索はよく使っていたけど、全文検索があったこと自体知らなかった…。当たり前だけど、これは便利だ。
こういうの、知ってる人はたくさんいると思うけど、知らなければ知らないまま使っていけちゃう。でも知ってるとぜんぜん違う。いろいろな機能が紹介されているので、デベロッパーツールをよく使っている人でも、知らないものもいくつかあるんじゃないかな。
地味だけどよく使うのはこんな機能。
- 適用されているスタイルを表示する Computed Style
- Styleの右上にあるボタンを押すと :hover や :focus なんかの状態を指定できること
- JavaScriptのデバッグで、要素が変更されたときにブレークするDomブレークポイント
- ミニファイされたコードの整形
JavaScriptのデバッグの章では、いろいろなブレークポイントの使い方が書いてあって参考になる。あるのは知ってたけど使ったことのないものも多くて、こんなふうに使えばいいのか、ということがわかった。
あとは普段あまり使わない Timelineパネル の使い方も参考になった。そんなにごりごり動くようなJavaScriptは書かないので。
Profileパネルは使うんだけど、なんとなく見ていてい、それぞれの項目の意味をちゃんと理解していなかった。あと関数のフォーカスとか非表示とか、あまり使ったことなかったけど、使ったら便利そう。
まとめ
最近いちばん使っているツールは、Chrome と SublimeText2。触れる時間の長いものほど、効率的に使えれば効果が高い。
ツールはどんどん進化していくから、それを使う側もいろいろ覚えていかなくてはいけない。Chromeについて、これほどまとまった情報はないと思う。
この本のお陰で、これまでよりもっと Chrome を使いこなせそう。