Google MapsとHotpepperのマッシュアップサイトを作ってみた

そもそもはスクリプト言語をやってみたくて、とりあえずPythonを選びました。昔Perlをちょっとだけやったことがあるのですが、あの->とか書いてあって一行でいろいろやっちゃうコードになじめなかったので、PythonかRubyどっちかな･･･名前がかっこいいからPythonにしてみよう、というノリで決めました。

まず、GoogleMapを使うというのでGoogleMapAPIを取得。Geekなページ：クリック処理を参考にして、クリックした地点の座標を取得できることを確認。この時点でJavaScriptが出てくるものの、やったことないので戸惑う。JavaScriptってどこに書くの？とか、イベントはどれ？とか。記法自体はECMAスクリプトで、よく使っているActionScriptと似ているのであまり問題ない。

で、なんとなくGoogleMapが使えてきたところで、CGIとの連携をやってみる。 CGIに値を送るのはどうしたらいいの、ということで再びGeekなページ：GXｍｌHttpを使ってCGIに情報を渡すを参考にやってみる。できるっぽい。でも、CGIもほとんどやったことないので今度はその勉強を始める。PythonでCGIをやるためにPython CGIプログラミングあたりを参考にさせてもらって、なんとかできる。一番ひっかっかったのは日本語で、encode('utf-8')でやると日本語表示できた。あと、さくらインターネットでサーバーを借りてやってるんですが、CGIは755にしないと動かないので注意。

必要な情報を取得できそうということで、次にそれをページの一部に動的に表示するためのAJAXの勉強。 prototype.jsが便利らしいので、サイトからダウンロードして使う。で、prototype.jsを勉強してたら、とりあえず今やろうとしてることだとpythonなんて使わなくていいんじゃないか？と思い、Ajax.RequestのurlにHotpepperAPI直接いれてみるも失敗。相対URL内のやつしかアクセスできないんだって。あたりまえなんだって。すいません。

次はPythonからどんな値を返してやるのが良いか？JSONってのが扱いやすいみたいなので、JSON形式に整形して出力。もしかしたらすごく面倒くさいことをやってるのかもしれないけど、いいのかな？あとPythonのコードが、関数一つも作っていなくて、ひどい。次はがんばる。

返ってきた値を解析してprototype.jsとGoogleMapsAPIを駆使して表示。めでたくマッシュアップされました。

知識が穴だらけだったので大変でしたが、ひとつずつ潰していきました。まだまだ未熟極まりないですが、簡単なモノでもひとつ作ってみれば全体の流れがわかって次に違うモノも作りやすいと思います。

Pythonはコードが読みやすく、オブジェクト指向で書きやすいのが利点。大きなプログラムを作るのにも向いているといわれるのもわかります。でも本当に日本語の情報が少ないんですね。その点Perlは日本語の情報が多いし、CPANがすごそう、そしてそんなに大きなプログラムも作らないので、ある程度勉強したらweb開発用言語はPerlに移るのがベターな感じがします。あとRuby on RailsやらCatalystやらTurboGearsとかもやってみたい。今度はサーバーたてようかな。

参考書籍

実践 Ajax ―Web2.0アプリケーション開発への手引き
3章と4章をじっくり読むと良し。
「5.3Prototypeライブラリによるリモーティング」でAjax.Request()を学ぶ。

まるごとJavaScript & Ajax ! Vol.1
とりあえずprototype.jsのところを読みました。

初めてのPython 第2版
オライリーの本は家の本棚に並べておくだけでもかっこいい。

参考ページ

Prototype.js関連
prototype.js v1.5.0の使い方
まちゅダイアリー　JSON + prototype.js

JavaScript関連
JavaScript eval()メソッド

JSON関連
JSON/簡単なテスト：基本

Python関連
ussy9's bookmarks tagged with "python" on del.icio.usのあたり

ウェブサービス関連
ホットペッパーwebサービス/APIリファレンス