2012.05.30
Greasemonkey(グリースモンキー)で実感できるプログラミングの素晴らしさ
プログラミングをこれから始めたいという人は、hello world とかなんちゃら数列とかでなく、greasemonkey スクリプトから始めるのが一番だと個人的に思ってる。「プログラミングってすげー」と思うこと間違いなし
— Junya Ishiharaさん (@jishiha) 5月 30, 2012
とツイートしたところ、反応をいくつかもらったので詳しく書いてみたいと思います。
Greasemonkey(グリースモンキー)は、ブラウザで開いたWebページを好きなようにカスタマイズできるツールです。Greasemonkeyだけではまったく役に立たなくて、これにJavascriptというプログラミング言語を使って書かれたスクリプト(小さなプログラム)とセットになって威力を発揮します。
userscripts.org などで探せば、他のひとがつくった便利なスクリプトをたくさん見つけることはできますが、自分専用のスクリプトを書くのが一番の醍醐味です。
普段使うページを自分用にカスタマイズすることによって劇的(?!)に便利になる例を挙げてみましょう。
電車を使って外出するとき、僕はいつも「駅探」を使ってどのくらいの時間がかかるかをチェックします。
便利なサイトですが、使ってて不満に思うことがありました。家から使うことがほとんどなので、乗車駅は最寄りの駅とほぼ決まっているにも関わらず、毎回入力しなければいけないのが面倒くさい。
そこで、駅探用のGreasemonkeyスクリプトを書いて自分専用にカスタマイズしました。
駅探のページを開いたら最初から最寄り駅が入力された状態に、なおかつ下車駅にカーソルが移っている状態にし、すぐ入力できるようにしたのです。
一回あたり1秒か2秒の節約かもしれないですが、これが毎日使っているサイトだと、積もり積もってだいぶ時間節約になるんじゃないかと思います。
駅探用のスクリプトは以下の通り、とてもシンプルです。
// ==UserScript== で囲まれた最初の部分は、スクリプトのタイトルや説明などの情報で、大事なプログラムの部分は最後のニ行だけです。
document.getElementById('sfname').value = '柴崎';
で乗車駅を入力した状態にし、
document.getElementById('stname').select();
で下車駅にカーソルがあたった状態にしています。
GreasemonkeyはもともとFirefoxの拡張機能で、Firefoxを使っていれば、ここからインストールできます。また、Greasemonkey用のスクリプトはそのままChromeにも読み込むことができて、こちらの場合は特に準備は必要ありません。
FirefoxでGreasemonkeyをインストールしたら、あるいはChromeを使っている場合は、以下のリンクをクリックして、上記の駅探用のサンプルスクリプトを読み込んで試してみることができます。
また、実際にスクリプトが動いている様子を動画に撮ってみましたのでよかったら見て下さい。
プログラムを書くことができれば、このようにちょっとした不便を改善することができるということがわかってもらえたでしょうか?
なかでもGreasemonkeyスクリプトは、それほどたくさんのコードを書かなくても、工夫次第で普段使っているサイトを劇的に便利にする可能性を持っています。
普段の生活で使っているサイトはもちろん、たとえば業務で使っている会社内専用のサイトで、要望を出してもなかなか聞き入れてもらえないような不便なところを自分専用に直してしまう、といったことができてしまいます。
Amazonのページに、その本が近くの図書館で借りられるかどうかを表示する
というツールを開発して公開していますが、これももともとは、図書館の検索ページが使いにくかったために自分専用に書いたGreasemonkeyスクリプトが始まりでした。
最初は自分専用でも、こうして改良していった上で公開され、いまでは多くの人に便利に使ってもらえるものが作れる、というところもプログラミングの素晴らしさじゃないかなと思っています。
2012/05/30 10:00:48