Hatena::ブログ(Diary)

Accept Things このページをアンテナに追加 RSSフィード

2005-10-30

どこでもCatalystを実験できる環境を整備する

はじめに

実は1週間くらい前にMVCフレームワークCatalystを研究室にあるFedora Core 4のマシンにひそかにインストールしてみました。Fedora Core 4だと全くトラブルなしでCatalystをインストールできました。そしてHello WorldなCalalystアプリケーションも作ってみました。意外と簡単でした。しかしながら、Catalystをインストールした研究室にあるFedora Core 4のマシンはプライベートIPを持ったマシンなので、このままでは自宅から思う存分Calalystを実験することができません。そこで、このエントリーではCatalystをリモートの環境からでも実験できるようにするための準備方法について説明したいと思います。

coLinuxのインストールで挫折、さてどうする?

id:naoyaさんやid:miyagawaさんは、coLinuxWindowsにインストールしてlocalhostでごにょごにょするという開発スタイルを取られています。先日、私もcoLinuxのインストールに挑戦して、coLinuxdebianのイメージをロードさせて、ネットに接続できる所までは設定できました。しかし、開発環境の整備まではできませんでした。もう少したっぷり時間が取れれば、引き続き頑張っても良かったのですが、これ以上時間をかける気にはなりませんでした。

ちょっと冷静に考えてみました。何でcoLinuxに拘っていたのかわからなくなりました。おぃ!

私は以下のような2台のマシンを研究室で所有しています。

labserverは研究室のメンバーが色んなことに利用しているサーバで、私もよくsshでリモートログインしてPerlの勉強をしています。ですが最近はfedoraがあるので、Perlの勉強は主にFedora Core 4が入っているマシンで行っています。(というかRedhat Linux 9でCPANモジュールがちゃんとインストールできないものが多すぎるのでFedora Core 4を使うようになりました) labserverはインターネットから8080番ポートのアクセスを許可していますが、現在は利用されていません。

fedoraはプライベートIPが設定されているので、当然インターネットからのアクセスは受け付けません。なので、Catalystの実験は研究室に行かないとできません。

labserverとfedoraは大学のVPNで接続されており、互いに通信可能です。自宅からfedorasshで操作したい時は、まずlabserverにsshでログインします。そして、labserverから再度sshfedoraにログインしています。

問題は、fedoraCatalystのhttpd(script/xxx_server.pl)を起動しても、研究室でないとCatalystアプリケーションをテストできないところです。何とかして、危険を承知の上で、Catalystのhttpdをインターネット上から叩けるようにすれば、ひとまずこの問題は解決です。幸いにも、グローバルIPを持っているlabserverは8080番ポートをListenしようと思えばできる状態にあります。これで何とか解決できないものでしょうか...

任意のマシン宛てにTCPポート転送を行うHack

前述した問題を解決するための良い方法がないか、LinuxサーバHacksの本をちょっと読んでみました。そうすると、ちょうど良い解決方法が載っていました。その解決法とは、HACK #48の「任意のマシン宛てにTCPポート転送を行う」というもので、このHackによって別のところにあるサービスを自分が提供しているかのように見せかけることができるようになるそうです。

そこで、早速試してみました。

以下のコマンドをlabserverで行いました。manのインストール場所を少しだけ調整する必要がありました。

$ cd /usr/local/src/
$ wget http://www.boutell.com/rinetd/http/rinetd.tar.gz
$ tar -zxvf rinetd.tar.gz 
$ cd rinetd
$ vi Makefile
(Redhat Linux 9用にmanのインストール場所を「/usr/share/man/man8」に修正)
$ make
$ sudo make install
$ vi /etc/rinetd.conf
0.0.0.0 8080 fedora 3000
$ sudo /usr/sbin/rinetd

これでlabserverで利用されずにいた8080番ポートに対してインターネットからアクセスがあると、fedoraの3000番ポート(Catalystのhttpdが標準でListenするポート)にトラフィックが転送されるようになります。

前に実験で作ったHello WorldなCalalystアプリケーションのscriptディレクトリにあるhttpdサーバを起動して、インターネットからhttp://labserver:8080で叩いてみると、見事に動作しました。LinuxサーバHacks、ありがとう。

おわりに

このエントリーで紹介したHackで、どこにいてもCatalystの実験ができるようになりました。残るはセキュリティーの問題です。これについてはまた後日エントリーを書こうと思います。

参考文献

追記 (11/02 18:05)

CatalystアプリケーションにBasic認証をかけて密かにアプリを開発できるようにする」もご参考に。

SixApartの宮川さんが昔に翻訳された「大規模なeコマースサイトをApachemod_perlで構築する」という記事を読んで

はじめに

先週の金曜日、研究室のPCに蓄積されていたブックマークを漁っていると、興味深い記事を昔にブックマークしていたことを思い出しました。その記事とは、SixApartの宮川さんが昔に翻訳された「大規模なeコマースサイトをApacheとmod_perlで構築する」というものです。この記事をブックマークした時は、「宮川さんが翻訳されたくらいだから、きっと有益な情報に違いない」と思ってブックマークしていました。しかし、長い間ブックマークされたままで本文をきちんと読むのをずっと忘れていました(笑。 そこで、いつものように印刷して読んでみることにしました。

大規模システムが持つ特性を理解する

この記事を読むことで、大規模システムの問題点とそれに対する解決のアプローチが何となく見えてきました。大規模システムで特に重要になる話題が一通り説明されている印象を受けました。また、大規模システムである はてなとの類似点もいくつか発見できました。

各所に見られるCPANモジュール

本文では、このeコマースサイトで利用されたCPANモジュールモジュール名が各所に書かれています。これは、Perlで大規模サイトを構築される開発者にとって有益なポインタとなるのではないでしょうか? 特に興味深かったCPANモジュールを以下に列挙しておきます。

おわりに

大規模システムでは、非常に高度な技術が要求される所に魅力を感じます。この記事を読んで、大規模なシステムの洗練されたアーキテクチャに触れられる仕事がますますしたくなりました。特にApachePerlといったオープンソースソフトウエアでシステム開発できる仕事に就職できれば、本当に幸せだなあと思っています。でも大規模システムに興味を持ったからと言って、銀行とかの金融系のSEになるのは嫌です。そのアーキテクチャとクローズさに魅力を感じませんので(笑。

2005-10-28

「入門GNU Emacs」がやってきた!

id:naoyaさんのCatalystの実演で刺激されて少し前にAmazonで注文した「入門GNU Emacs」が、ようやく昨日、自宅に届きました。この本を読みながら少しづつEmacsがさわれるようになりたいと思います。

2005-10-27

最近の はてなについて考えてみる

id:jkondoさんの「自分の頭で考える」のエントリーで紹介されていた「「日本版Googleを目指す」はてな近藤氏、Web広告研究会トークセッション」というページを見て、最近の はてなについて少し考えてみました。

「日本版Googleを目指す」と回答したのは近藤氏。今では世界企業となったGoogleだが、はてなの目指すGoogleとは何だろう。当初は少人数で開始したはてなだが、現在は14人とスタッフが増えつつある。同時に、これまでの5、6人であれば「今日はこれをやろう」と仕事を進められたが、現在は組織的に動かないと全員の仕事を把握することも難しくなりつつあるという。

Googleは1,000人規模の大企業になっても、僕らがスゴイと思えるようなサービスを提供している。はてなには、大企業で好きなことができないからといった理由で集まった技術者もいるが、30〜50人ぐらいの規模になっても、アイデアがいろいろな人から絶え間なく生まれる環境を作りたい。そのためには、既存の大企業のような手法で組織化するのではなく、ユーザーに提供するサービスのつもりで仕組みを作っていく。」

「日本版Googleを目指す」はてな近藤氏、Web広告研究会トークセッション より

はてなスタッフの増加で、はてな内での仕事の進め方が変わりつつあるようですね。スタッフが増加しても、確実にタスク管理や全員の仕事を把握できるような仕組み作りを真剣に考えていく必要があるように思います。現時点で「あしか」によるタスク管理が、まだうまく機能しているのか、ちょっと心配です。「あしか」は本当に少人数でのタスク管理には有利かもしれませんが、スタッフの増加で限界に近づきつつあるように思うのは私だけでしょうか?

最近のはてな技術発表会ではPerl::Criticで推奨されているコーディング作法を、はてなの開発者の中で順番に勉強されているようです。この流れから、それぞれの開発者のコーディングスタイルのばらつきを減らすことで、はてなの開発者が増えても、仕事がスムーズにできるようにしていこうという動きを感じます。この試みは結局、システムのメンテナンス性につながり、サービスの改善やトラブル発生時の対応の「アジャイルさ」を保ち続けるための重要な作戦の1つとなりそうですね。

記憶に新しいid:naoyaさんによるCatalystの実演からも、「アジャイルさ」というのが、最近のはてなの重要な課題になっている気がします。

はてなには、ユーザーオリエンテッドな視点を忘れずに、これからも大きくなっていってほしいですが、決して大企業病にはかからないことを願っています。大企業病にかかってしまうと、はてなに魅力を感じなくなってしまいます。これからのはてなの技術的動向に加えて、はてなの組織作りも目が離せませんね。

Fedora Core 4 + Perlな環境でMySQLを操る準備

はじめに

このエントリーでは、Fedora Core 4 + Perlな環境でMySQLを利用できるようにするための方法を説明します。

最近私は、はてなの開発者と同様に、アジャイルなWebアプリケーションの構築を可能とするMVCフレームワークCatalyst」に注目しています。CatalystではModelの所で、Perlにおける人気のO/RマッパーであるところのClass::DBIが登場します。ModleにClass::DBIを必ず使わなければならないというわけでは無いようですが、まずはClass::DBIを利用できるスキルを身に付けた方が良さそうです。

ともかく、PerlMySQLが使えないと話しが進みませんので、今回PerlMySQLが使えるように必要最小限の環境設定をしてみることにしました。

Fedora Core 4で遊ぶようになったきっかけ

最近、Redhat 9にid:jkondoさん作のText::Hatenaをインストールしようとしたのですが、Perlのバージョンが古くてインストールできませんでした。最新のPerlを別途インストールしてもよかったのですが、時間的にも厳しく面倒だったので、Fedora Core 4をインストールして、色々と遊んでみることにしました。Fedora Core 4にインストールされているPerlだと、Text::HatenaはCPANシェルですんなりインストールできました。Redhat 9だと、Perlのバージョンや各種ライブラリのバージョンの問題でうまくインストールできなかった多くのCPANモジュールが、Fedora Core 4では問題なく簡単にインストールできるみたいですね。

PerlMySQLが使える環境にする

さてさて、CPANモジュールのインストールのトラブル率が激減したFedora Core 4の環境で、MySQLをインストールします。yumの設定がまだちゃんとできていないので、yumではなくRPMで手動インストールしました。

MySQLのダウンロードサイトからゲットしたRPMを、以下のようにインストールするだけでMySQLのインストールは完了です。ソースからmakeしていた頃が懐かしいです。RPMで一瞬にしてインストールできてしまうと、makeで苦しんでいた自分があほらしくなっちゃいますね。(笑

[ysano@fedora ~]$  sudo rpm -ivh MySQL-server-4.1.14-0.i386.rpm
[ysano@fedora ~]$  sudo rpm -ivh MySQL-server-4.1.14-0.i386.rpm
[ysano@fedora ~]$  sudo rpm -ivh MySQL-devel-4.1.14-0.i386.rpm

ここでMySQL-devel-4.1.14-0.i386.rpmをインストールしておくのがポイントです。これをインストールしておかないと、後でDBD::mysqlCPANシェルからインストールしようとする時にうまくインストールできないので注意が必要です。MySQLのドライバをコンパイルするためには、MySQL-devel-4.1.14-0.i386.rpmでインストールされる各種C言語のヘッダーファイルと、ユーティリティープログラムが必須なようです。

さて、残るはDBD::mysqlのインストールです。以下のコマンドを打てば、問題無くインストールできました。

[ysano@fedora ~]$ sudo perl -MCPAN -e 'install DBD::mysql'

DBIPerlからMySQLにクエリーを投げるテスト

無事、PerlMySQLを利用するための環境が整いました。そこで実験としてPerlに標準インストールされている「DBI」を使ってMySQLにクエリーを投げるPerlスクリプトを書くことにしました。DBIを使えばデータベースSQLで簡単に操作できます。

MySQLrootユーザーのパスワードの変更は、まだ行っていないのでパスワードは空の状態です。実験として、データベースにはMySQLのインストール時に用意される「test」データベースを用いることにします。ちなみに、「test」データベースにある「testaa」テーブルのスキーマと、格納されているデータは以下の通りです。idが6と7の行が、「?」になっているのはなぜだかよくわかりません。。。

[ysano@fedora ~]$ mysql -u root test
mysql> desc testaa;
+-------+----------+------+-----+---------+-------+
| Field | Type     | Null | Key | Default | Extra |
+-------+----------+------+-----+---------+-------+
| id    | int(11)  |      |     | 0       |       |
| name  | char(64) | YES  |     | NULL    |       |
+-------+----------+------+-----+---------+-------+

mysql> SELECT * FROM testaa;
+----+---------------------+
| id | name                |
+----+---------------------+
|  1 | Alligator Descartes |
|  3 | Jochen Wiedmann     |
|  2 | Tim Bunce           |
|  4 | Andreas Kg          |
|  5 | NULL                |
|  6 | ?                   |
|  7 | ?                   |
+----+---------------------+

Perlスクリプトは以下の通りです。

[ysano@fedora perl]$ vi dbi.test.pl
#!/usr/bin/perl -w
use strict;
use DBI;

my $dbh = DBI->connect('dbi:mysql:test', 'root', '', { RaiseError => 1, })
    or die DBI::errstr;

my $sth = $dbh->prepare('SELECT * FROM testaa WHERE id < 5');
$sth->execute;

print "id | name\n" . "-" x 30 . "\n"; 
while ( my @row = $sth->fetchrow_array ) {
    printf "%2d | %s\n", $row[0],$row[1];
}

$dbh->disconnect;

このPerlスクリプトを実行すると、以下のような結果が得られます。

[ysano@fedora perl]$ ./dbi.test.pl
id | name
------------------------------
 1 | Alligator Descartes
 3 | Jochen Wiedmann
 2 | Tim Bunce
 4 | Andreas Kg

さいごに

ということで、Fedora Core 4 + Perlな環境でMySQLを操る準備ができました。これからは、時間がある時にClass::DBIのトレーニングをしていきたいと思っています。そしてCatalystの勉強も同時に行いながら、前からPerlで作ってみたかった「秘密のアプリ」を作ってみたいと思います。(ないしょです)

2005-10-23

XML::Atomはてなブックマークを ごにょり中...

SixApartの宮川さんに刺激されて、XML::Atomはてなブックマークをごにょってます。また時間ができた時に、エントリーを書いてみようと思います。お楽しみに。

追伸

XML::Atom、最高です。こんなにも簡単に はてなブックマークをhackできるのはXML::Atomのおかげです。XML::Atomをメンテされている宮川さんに感謝。そしてCPANにも。

2005-10-22

naoyaさんが使われる「ごにょ(る|ごにょ)」という言葉が気になる

id:naoyaさんが使われる、「ごにょる」や「ごにょごにょ」といった言葉、最近、私の中でマイブームです(謎。この「ごにょる」というのは、恐らく「コードを美しくHackする」という意味なんだと思います。「ごにょ」という響き、何かいいです。何か魔法を使っている感じです(謎。

一方、「ごりごり」という言葉は、私の中では「かなり強引にHackする汚いやり方」という意味合いが強いような感じがしています。「ごりごり」より「ごにょごにょ」ができるように、なりたい今日この頃。

100ポイントの「はてなポイント」を頂きました

はてなのトップページを何気に見ていると、ヘッダーの所が

ようこそ ysano2005 さん 100ポイント

となっていて、ちょっとビックリしました。いつの間に はてなポイントをゲットしたのでしょう?

気になったので、「Myはてな」にある「ポイント支払・受取履歴」を見てみました。

日付支払受取明細残額
2005/10/17yokoyamenさん から100はてなブックマークポイント受取 *100

id:yokoyamenさん、ありがとうございます。この前の「はてな技術発表会:naoyaさんによるCatalystの実演で感動」のエントリーに対して、投げ銭して頂いたことがわかりました。

はてなブックマークの投げ銭については、少し前に知っていました。でも、まさか自分が書いたエントリーに投げ銭してもらえるとは夢にも思っていませんでした。いざ投げ銭してもらえると、本当に嬉しいですね。これからも頑張ります。

2005-10-21

AtomAPIはてなブックマークにエントリーをpostするテスト

はじめに

数日前、blog.bulknews.netの宮川さんが「del.icio.us と はてなブックマークに cross-post」という興味深いエントリーを書かれたのを知りました。ラッキーなことに、そのクロスポストするPerlスクリプトは公開されています。ソースを見てみると案外コード量は少なかった(100行程度)ので、読めそうかな?と思いました。そこで、早速ソースを印刷して読んでみることにしました。

そうして数日が経過しました。。。

これではいけない!と思いました。最近は忙しくてPerlの勉強ができていないので、早起きして頑張ってみました。

XML::Atomのインストール: ちょっとした困難との遭遇

まずは、XML::Atomのインストールをしました。なぜかXML::Atomで必要となるDateTimeモジュールFedora Core 4の環境ではうまくテストをパスしてくれませんでした。しょうがないなぁと思い、

>cpan force install DateTime

をして強制的にインストールしました。それから、もう一度XML::AtomのインストールをCPANシェルで実行すると、インストールが完了できました。

AtomAPIはてなブックマークにpost: また壁にぶつかる

宮川さんのコードを参考にして、以下のようなコードを実験的に書いてみました。

#!/usr/bin/perl -w
use strict;
use XML::Atom::Entry;
use XML::Atom::Client;

my $entry = XML::Atom::Entry->new;
my $link  = XML::Atom::Link->new;
$link->rel('related');
$link->type('text/html');
$link->href('http://map.hatena.ne.jp');
$entry->add_link($link);
$entry->summary('AtomAPIで はてなブックマークにpostするテスト');

my $client = XML::Atom::Client->new;
$client->username('your hatena account name');
$client->password('your password');
$client->createEntry("http://b.hatena.ne.jp/atom/post", $entry)
    or warn $client->errstr;

残念ながら、このコードは、はじめは私の環境では動作しませんでした。このコードはどこも悪い所はありません。実はこのスクリプトは、大学のようにproxyを越えてネットにアクセスしなければならない環境では動作しないのです。それに気がつくのに、結構時間がかかりました。

ヒントを探す

どうにかしてproxyの問題を解決したいと思いました。以下のようなコードを書いてみると、proxyを突破できることがわかりました。ポイントは「$ua->env_proxy;」です。この行を書くことで、環境変数http_proxyを読み込んでプロキシを突破してくれるようになります。

#!/usr/bin/perl -w
use strict;
use HTTP::Request;
use LWP::UserAgent;

my $ua = new LWP::UserAgent;

# Read the 'http_proxy' environment variable
# to solve the problem I faced.
$ua->env_proxy;

my $uri = 'http://www.google.com';
my $req = HTTP::Request->new(GET => $uri);
my $res = $ua->request($req);

print $res->content;

上記のコードを実行する前に、当然、環境変数の設定をしておく必要があります。

$ export http_proxy=http://your.proxy

XML::AtomをHack: 大したことはありません

私は今日はじめてXML::Atomを使った人間なので、もっと良い解決方法があったかもしれません。私自身、CPANモジュールrootで触るのが嫌でしたが、それよりも はてなブックマークAtomAPIを試してみたい気持ちの方が強かったので、やむを得ず試してみることにしました。以下のようなhackをしました。

# vi /usr/lib/perl5/site_perl/5.8.6/XML/Atom/Client.pm
[...]
package LWP::UserAgent::AtomClient;
use strict;

use base qw( LWP::UserAgent );

my %ClientOf;
sub new {
    my($class, $client) = @_;
    my $ua = $class->SUPER::new;
    
    # ysano's quick hack code for the proxy problem
    $ua->env_proxy;
    
    $ClientOf{$ua} = $client;
    $ua;
}
[...]

この嫌なhackのおかげで、無事AtomAPIを使って はてなブックマークにpostする実験が成功しました。

おわりに

また時間が空いたときに、はてなブックマークAtomAPIで遊んでみたいと思います。Webサービスって楽しいですね。

参考文献

2005-10-20

アルファギーク選定委員会 ?

idトラックバックを見ていたら、「アルファギーク選定委員会」なるキーワードを発見。なんじゃそりゃ?と思いクリック。すると、、、

構成メンバー不詳。

一説によるとd:id:ysano2005に認められて初めてアルファギークになれる、とも言われている。

また名称に2.0ををつけ提唱するによって、なんちゃってアルファギークを名乗れる。例:

* antipop2.0

* javascript 2.0

アルファギーク選定委員会

どこから、そんな説が流れたのでしょう?(笑

私からアルファギークな人の見つけ方を一言。

まず、id:miyagawaさんのdel.icio.usと、id:naoyaさんのはてなブックマークを、毎日欠かさずbloglinesなどのRSSリーダーでチェックすることです。これをするだけでも、アルファーギークな可能性を秘めている人を発見できます。やっぱりお二人は目の付け所はシャープなので、自然とアルファーギークな方のblogのエントリをブックマークされる可能性が高いです。

そうした毎日を過ごすことで、段々と業界で注目されているアルファーギークな人物が誰なのかわかってきます。アルファギークに興味のある方は一度お試しあれ。

2005-10-19

はてな技術発表会:higeponさん「できる人の見分け方」について語る

今回は、id:higeponさんが はてな技術発表会の担当でした。Perl Best Practiceの実践をサポートしてくれるPerl::Criticの解説です。

はてなの主力hackerの1人であるid:higeponさん。今回と前回のビデオを観ていて、はてなスタッフのメンバーの中でもid:naoyaさんとid:higeponさんが、技術的な面で圧倒的に上をいってる印象を受けました。身の回りに、ここまでhackerな人がいないので、無料でこんな勉強ができるなんて本当に幸せです。

以下にタイムラインとともに、面白かった所をピックアップしておきます。

02:20


02:50


03:48

  • 約40個のポリシー

04:00

  • Text::Hatenaは秀丸で作って、最後にtabをがりっと○△?×

04:17

  • Perl::Critic::Policy::BuiltinFunctions::ProhibitStringyEval
  • ダブルクオートで囲ったevalはやめましょう
  • naoya: 「え、Hatena::Bookmark全部これなんだけど(笑)」
  • はてなフレームワークの中でたまに見かけるコードなので注意しましょう

05:40

  • Perl::Critic::Policy::CodeLayout::ProhibitParensWithBuiltins
  • builtin関数はカッコをつけないで呼びましょう。へぇ〜
  • naoya: joint, mapとgrepとか
  • naoya: これはでも単純にソースがカッコよくなるだけ

06:29

  • Perl::Critic::Policy::CodeLayout::ProhibitHardTabs
  • tabは環境依存で開くエディタやOSで全然違う見え方をするので良くない

06:51

  • Perl::Critic::Policy::CodeLayout::RequireTidyCode
  • ひげぽんが思いを語る
  • jkondo: 語ってよ
  • オープンソースではHardTabsになっていないことやTidyCodeであることが凄い重要
  • 「この人ができる人か」の見分け方:
    • インデントがちゃんとしているか?
    • 複数のソースコードにまたがって一貫したスタイルが保たれているか?
    • かなり、かなり重要

07:59

  • higepon: はてなに入った時にtabを使っているのを見て結構ショックだった
  • naoya: あれ驚愕の事実だったよね (笑
  • higepon: 最近は改善されつつあります

08:11

  • Perl::Critic::Policy::ControlStructures::ProhibitUnlessBlocks
  • unlessを使うな
  • 否定の否定はやめましょう
  • unlessの中にandとかorが沢山あるとわけわんなくなる

10:14

  • Perl::Critic::Policy::ValuesAndExpressions::ProhibitEmptyQuotes
  • naoya: 冗長だよね

10:45

  • ベストな解法: 全然ベストじゃない
  • $EMPTY, $SPACE
  • naoya: 結構論争になりそう

ホワイトボードにプロジェクターを投影しているので、画面下がプロジェクタの光で反射して見にくいのが、ちょっと気になります。確かにホワイトボードに投影すると、色々書き込めるので便利ですが、、。

2005-10-17

はてな技術発表会:naoyaさんによるCatalystの実演で感動

今回のはてな技術発表会は熱いです。id:naoyaさんがPerlで今注目されているWebアプリケーションフレームワークCatalystを、実演を交えて解説されています。必見です。

このビデオを観ていると、Perlハッカーとしてのid:naoyaさんの凄さがよく伝わってきます。キーボードをタイプされる音が非常に軽快で、聴いていて心地よくなりました。特にEmacsを操るシーンは見ものです。あまりにも操作が早いので、何をされているのかわかりにくいですが、それだけEmacsを使いこなされていることがよくわかります。早くid:naoyaさんみたいになりたいなぁ。id:miyagawaさんは、もっと凄いのかなぁ?宮川さんも特別ゲストとして、はてな技術発表会で講演してもらえると、凄い盛り上がると思います。いつかしてもらいたいなぁ。

ここ数日のid:higeponさんとid:jkondoさんのブックマークを見ていると、はてなフレームワークCatalystの思想(Ruby on Railsと言った方が正確かもしれません)を取り込んでいく流れを感じます。勘違いかもしれませんが。でも今回のビデオを観ていると、はてなスタッフの皆様はCatalystにかなり興味を持たれた印象を受けました。最近のはてなのサービス改善スピードの低下を感じている私としては、Catalystアジャイルさを、はてなフレームワークに取り入れて、開発スピードの改善がなされていくと良いなあ、なんて思ったりします。

CPANの発展とともに進化し続けるCatalyst。近いうちにCatalystに入門したい今日この頃です。

2005-10-16

久しぶりにSixApart宮川さんのlast.fmをチェック

この前、Hilary Duffファンであることが発覚した宮川さん。そういえば、宮川さんは最近どんな曲を聞かれているのかな?と思い早速チェック

なんと「Recent Tracks」に「Simple Plan」の文字が! 大好きです、Simple Plan

ちなみにSimple Planの中で私のお気に入りの曲は、「I'm Just a Kid」と「Welcome to My Life」です。

相変わらず洋楽をよく聴かれていますねぇ。

2005-10-14

刺激的なプレゼン

はてなブックマーク注目エントリーで偶然見つけたスティーブ・ジョブスに学ぶプレゼンのスキルは、ためになります。

[...]

それ以来、私が理想としているようなプレゼンのビデオをどこかで見つけて紹介しよう思っていたのだが、やっと絶好の題材を見つけた。12日のスティーブ・ジョブスによる新型iMacの発表である。

 英語で申し訳ないが、我慢して最初の5分だけでも良いから後ろのスライドに注目して見ていただきたい。注意して見るべき点は、

(1)文字が極めて少ないこと、

(2)画像が効果的に使われていること、

(3)ほとんどの情報は文字ではなく、スティーブ・ジョブスの口から伝えられること

このビデオで見られるプレゼンは一度見たほうが絶対にいいです。最高のプレゼンテーターですね、彼は。自分自身のプレゼン方法のさらなる改善に役に立ちそうです。

はてなアイデアミーティングのオープニング曲は前の方が良かったです

ミーティングのテーマ曲が変わったによると、はてなアイデアミーティングのオープニング曲が変わった模様。

はてなアイデアミーティングを実際に聴いてみると変わってました。カッコいいとは思いますが。。。 はてなスタッフみなさんの多くも、以前の曲の方が良かったと思われているようです。私も、前の方が良かったなあ。今回の曲は、「はてならしさ」が欠けている感じがします。みんなでワイワイ楽しく仕事をするのが「はてな」というイメージが私の中ではあります。それが今回の曲では表現できてませんね。。。

当面は以前の曲と気分でローテーションされるようです。

2005-10-11

はてなマップ、復旧で一安心

先日の不具合で数日間、実質上サービスが利用不能になっていた、はてなマップ9日に解決したとの情報が、はてなスタッフid:higeponさんから入りました。id:higeponさん、お疲れさまでした。

ここで、今回の障害の原因究明に関わられた方々に御礼を申し上げます。id:Kscさんにも感謝しております。id:Kscさんのコメントが、今回の障害の原因究明の大きなヒントとなりました。id:Kscさんの感の鋭さには脱帽です。id:secondlifeも尊敬しました。prototype.jsの最新動向をよくフォローされてます。prototype.jsの1.4系でObject.prototypeの汚染問題が解決されていることをはじめてid:secondlifeさんのエントリで知りました。id:secondlifeさんが具体的な解決方法を示されたことによって、はてなスタッフの方も励みになったのではないでしょうか?

今回のはてなマップの障害が、私にとっては非常に良い勉強になりました。そして、ネットの向こう側にいる優秀な方々ともっと関わっていきたいと思うようになりました。今になって、はてなダイアリーのサービスに参加して本当に良かったと思っています。

それにしても、はてなのサービスでここまで長くサービスが利用不能になったのは、今回がはじめてなのでしょうか?私の調査がもしもなかったら、復旧にもう少し時間がかかっていたのかな?と考えると、はてなマップの不具合の原因調査を早くして良かったと思っています。はてなのお役に立てて光栄です。

一方、こちらで開発しているprototype.js + Google Maps APIを利用したシステムも、今回のはてなマップの解決方法が判明したことによって、正常に動作するようになりました。一安心。まだまだ続くシステム開発も山場を越えた感があります。後半戦も頑張っていきます。

追伸

私が原因調査したエントリをid:higeponさんにブックマークして頂けました。GJなんて最高の褒め言葉です。ありがとうございます。

2005年10月09日 higepon 『[javascript] はてなマップの不具合の調査。GJです。』

2005-10-10

はてなブックマークブックマークしたエントリのタイトルにいたずら?

My Life Between Silicon Valley and Japan - Web 2.0時代を生きる英語嫌いの若い人たちへの英語勉強法というエントリを、今日ブックマークしたのですが、先ほどそのブックマークのユーザー数のリンクをクリックすると、あれ?っと思いました。

エントリのタイトルが「ネットヲタ向け英語勉強法」に勝手に変更されていました。一瞬、間違ってブックマークしてしまったのか?と思いましたが、リンク先は合っていました。はてなブックマークって、ブックマークしたエントリのタイトルと、概要を誰でも編集できるんですね。でも個人的にはその仕様はあんまり好きじゃないですね。タグ機能ももちろん使っていますが、ブックマークしたエントリを探す時は、大抵タイトル名に頼って探します。なので、勝手にブックマークしたエントリのタイトルが変更されると、非常に使い勝手が悪くなります。

もしかして私のブックマークだけが、誰かに改ざんされたのでしょうか?何かよくわかりません。

2005-10-08

季節外れの流し素麺: ギネスに挑戦

今日はちょっと研究室に用があったので土曜日にも関わらず、朝から研究室に行ってきました。

前から、噂になっていた流し素麺のイベントがうちの大学で今日行われました。少し前から竹で作った流し素麺のをするための棒が、研究室に行くまでの道のりにいっぱい置いてあって気になっていました。

流し素麺は普通ではありませんでした。なんと長さ1300m! 凄いです。ピタゴラスイッチファンの私としましては、かなり興味深い装置でした。(笑 ピタゴラ装置以上に凄いですよ、これは。竹でうまい具合に作ってありました。素麺が途中で凄いこぼれ落ちてる所もありましたが、最終地点までちゃんと素麺が流れたのを見て感動しました。本当に凄かった。偶然出会ったスタッフの方(多分、この企画のリーダー)にお願いして、私も素麺を流させてもらいました。私が流した素麺もちゃんと最終地点に到着できたのかな?

ちなみに1300mってのは、こういうことだったのですね。納得。

1,300mは同志社の開学130周年と、再来年の京田辺市の市制10周年を掛けたもの。

「大学との協働による新しい京都創造推進プラン」第3回政策検討会議議事録 より

1300mの流し素麺が無事終了後、研究室の近くで20mくらいの小さな流し素麺が行われました。これは素麺を食べるのが目的です。ちゃっかり流し素麺を頂きました。1300mの方は、当然ながら食べられるような代物ではありません。(笑

下流では素麺が全然流れて来ませんでした。上流に行くと、なんと水不足で素麺が大量に停滞しているではありませんか! 上流のみんなでお箸を使って下流に流してあげました。楽しかった。

その小さな流し素麺で、昔、家庭教師で教えていた近所の小学生と偶然再会。まさかこんな所で再開できるとは思ってもいなかったのでビックリしました。どうやらボーイスカウトでこのイベントに参加していたようで、頂上の方の竹のセッティングをしたとのこと。お〜凄い。久しぶりに会いましたが、元気そうで何よりでした。(その小学生とはピタゴラ装置みたいなものを作ってよく遊んでいました。ピタゴラ装置を作ることが勉強でした(笑 )

久しぶりに、小さいお子様からお年寄りまで様々な人々の素の笑顔を見れたような気がします。純粋に楽しい時の人の顔って本当にいいものですね。土曜日にわざわざ大学に行って本当に良かった。

Google Maps API keyの仕様が変更され、鍵管理の負担が大幅削減

Google Maps APIを利用している開発者に朗報です。これまでGoogle Mapsを利用するために生成していたkeyの有効範囲が広くなりました。以前では、例えば「http://localhost/foo/」で生成したkeyは、fooディレクトリ直下でないと有効ではありませんでした。つまり、「http://localhost/foo/hoge/」や「http://localhost/foo/hoge1/hoge2/」といったサブディレクトリ以下では、そのkeyは機能しませんでした。ですので、このような厄介な仕様によって、Google Maps APIを利用する開発者はフラストレーションを感じていました。

ですが、最近アップデートされた仕様では、例えば「http://localhost」でkey生成を行うと、localhostのどこでもGoogle Mapsを利用できるkeyが発行されるようになりました。かなり便利になりましたね。これで鍵をいっぱい管理する必要が無くなりました。quick hackなコードとも、これでおさらばです(笑

今回の情報はGoogle Groups : Google-Maps-APIの「Clearing API Key」というスレッドで知りました。

Google fixed all that a while ago, they just haven't updated the

documentation yet.

A key now works for all subfolders, and for the www.domainname.com,

domainname.com pair. It doesn't work across other aliases that your

website may have only for the www/non-www pair.

Oct 8, 3:39 am Mike Williamsさんより

Google Mapsのドキュメントにはまだ今回の仕様変更が記述されてない模様。このスレッドは、たまたま見つけたのでラッキーでした。やっぱり最新の技術は定期的にメーリングリストをチェックするのが大切ですね。

2005-10-07

はてなマップの不具合の原因はprototype-1.3.1.js

idea:6490で報告した通り、現在はてなマップの不具合が発生していて、まともにはてなマップ使えなくなっています。まだ回復されていません。

そこで何かお手伝いできないか?と思いました。はてなマップの不具合をシンプルなコードで再現することができれば、問題解決に寄与できると直感的に感じました。

それでちょっと気になっていたことがあります。

このエントリにおけるid:Kscさんのコメントでprototype.jsが原因かもしれないとの指摘がありました。

私の確認したところ、うちも含めて他のマップは全て正常なので、はてなマップ固有の現象みたいですね。

prototype.js が絡んじゃったりしてるような気がしますが、そうなると、私も厄介な予感がします。

悪い予感がしたので、試しに私の環境で簡単なコードを書いてみました。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<script src="http://maps.google.com/maps?file=api&v=1&key=***" type="text/javascript"></script>
	<script src="prototype-1.3.1.js" type="text/javascript"></script>
</head>
<body>
	<div id="map" style="width: 500px; height: 400px"></div>
	
	<script type="text/javascript">
	//<![CDATA[
	var map = new GMap(document.getElementById("map"));
	var p = new GPoint(-122.1419, 37.4419);
	map.addControl(new GSmallMapControl());
	map.centerAndZoom(p, 4);
	var marker = new GMarker(p);
    
	GEvent.addListener(marker, "click", function() {
		marker.openInfoWindowHtml('hello');
	});
	
	map.addOverlay(marker);
	//]]>
	</script>
</body>
</html>

予感は的中していました。このコードの上でprototype-1.3.1.jsをロードしています。これが原因でした。prototype-1.3.1.jsをロードしないようにすると、正常に動作します。

実際にこのコードを実行してみると、はてなマップと全く同じバグを再現できていることがわかります。ここをご覧下さい。

さて、バグの再現ができたのは良いですが、prototype-1.3.1.jsが原因となると、かなり厄介ですね。prototype-1.3.1.jsをhack(パッチ作成)する必要があります。はてなスタッフさんの腕の見せ所ですね。

それにしても、何でprototype-1.3.1.jsが原因なんでしょう?全く検討がつきません。

追記 10/7 9:45

Google Maps APIメーリングリストはてなスタッフの方が投稿されたスレッドにも一応、レスを書いておきました。障害復旧のお役に立てれば幸いです。

Hello, I'm a Hatena user, id:ysano2005.

This problem is because of using prototype-1.3.1.js in your Hatena::Map

service.

I wrote a blog entry about this problem. How to solve the problem is

not described in this entry, however. Please see the entry (japanese).

http://d.hatena.ne.jp/ysano2005/20051007/1128643649

追記2 10/7 14:50

ちょっとこちらでも調査中。どうやらprototype-1.3.1.jsの35行目にある以下のコードが原因であることが判明。二分法的にエラー箇所を特定しました。JavaScriptの勉強不足で確信はできませんが、このコードは恐らくJavaScriptで継承を実現するためのコードです。prototype.jsの根幹となる所でエラーになってるので、かなり深刻な感じがしています。大丈夫でしょうか、はてなさん。

Object.prototype.extend = function(object) {
  return Object.extend.apply(this, [this, object]);
}

もしかすると、以下のエントリが問題解決の糸口になるかも?

追記3 10/7 22:30

id:secondlifeさんが「はてなマップの prototype.js による Object.prototype 汚染の弊害」なるエントリを書かれました。やっぱりObject.prototype汚染問題でした。1.4系のprototype.jsでは、この汚染問題は解消されているようです。

実は、今開発しているシステムも、はてなマップと同様にprototype-1.3.1.js + Google Maps APIなシステム構成なのです。それで、はてなマップと全く同様の現象が出て、困り果てていました。解決方法がわかったので、また明日バグ修正してみよう。id:secondlifeさん、情報ありがとうございました。本当に助かりました。

2005-10-05

はてなマップの致命的なバグをはてなアイデアで報告

はてなマップにプロットされたマーカーをクリックしてもInternet Explorerでは吹き出しが表示されなくなっている致命的なバグを発見したので、idea:6490で報告しておきました。今まで正常に動作していたのに、どうしたのでしょうか?もしかしてGoogle Maps APIの仕様が裏でひそかに変わって、それが影響したのでしょうか?でも、Google Maps本家は正常に動作しているようです。

この前リニューアルされた、はてなマップは確かid:higeponさんが中心になって実装されたはず。早く気がついてもらえれば良いのですが...

ここで今回のバグで思ったことを書いておきます。

Ajaxをベースに実装されたサービス(例えばGoogle Maps)を利用して構築されたシステムに、今回のような不具合が出た場合、どうにかして、その不具合を自動的に検出できるようなカラクリにできないかな?と思いました。不具合を自動的に検出できても、それを修正するという作業はまた別の話です。しかし、早期に発見できるような仕組みがあれば、リカバリー作業を早く開始できるので、その結果としてサービスのダウンタイムを小さくできるのではないでしょうか?

Ajaxベースのシステムのテストは、まだまだ未知な部分が多く、ノウハウの蓄積が今後もますます重要になる気がしています。テスト可能なAjaxベースのシステム構築の方法論についての議論が、今後盛んになっていくと良いですね。

追記

はてなマップ障害情報で、この不具合のアナウンスがされました。はてなスタッフの技術力に期待。どれだけ早くリカバリーできるのかな?私の感覚では、この不具合は結構厄介なバグで、原因の究明に時間がかかる予感がしています。JavaScriptデバッグ地獄にならないことを願っています。

現在、お使いのブラウザによってはてなマップの一部機能をお使いいただけない状態が発生しております。

現在原因の調査及び復旧作業を行っております。サービスをご利用の皆さまにはご迷惑をおかけしますが、復旧完了まで今しばらくお待ちいただきますようお願いいたします。

2005-10-05 はてなマップ障害情報 より

Google Maps APIメーリングリストで見つけた質問に英語で回答にチャレンジ

工業高校出身ということで、英語は得意ではありませんが、Google Maps APIメーリングリスト?に回答できそうな質問があったので、頑張って英語で質問に答えてみました。

この質問の本質は以下の通りだと私は解釈しました。間違っていたらすみません。

ある2つの異なるURLを持つサイトで、Google Maps APIを使いたい時、それぞれのサイト用にGoogle Maps API keyを発行する必要があります。そこで、keyの扱いが問題になります。というのもkeyをGoogle Mapを利用するJavaScriptにハードコードしてしまうと、そのJavaScriptを他のURLの異なるサイトに配置した時に、そのサイト用にkeyだけを再度書き直さなければならないからです。localhostで開発して、グローバルにアクセスできるドメインにアップしなければならないとしたら(ほとんどがそうだと思います)、とてもじゃありませんが開発を円滑にできません。

そこで、以下のような返答を書き込みました。ちゃんと通じるかちょっと心配。

Hello.
I use the following script to solve the problem you faced.
I hope that your problem can be solved by the script.

*** Script A: gmaps_util.js ***
function include_gmaps_api()
{
	var host, key;
	
	host = location.host;
	path = location.pathname;
	
	// Do you know that Google Maps API can be used in 'localhost' context?
	// It is very useful for every developer. Try it.
	if(host == 'localhost') {
		if (path.match(/\/my_project\/trunk\/foo/)) {
			// Google Maps API key for http://localhost/my_project/trunk/foo/
			key = 'xxxxxxxx';
		}
	} else if (host == 'www.example.com') {
		if (path.match(/\/my_project\/trunk\/foo/)) {
			// Google Maps API key for http://www.example.com/my_project/trunk/foo/
			key = 'yyyyyyyy';
		}
	}
	
	// Include Google Maps API from maps.google.com
	document.write('<scr' + 'ipt src="http://maps.google.com/maps?file=api&v=1&key=' + 
					key + '" type="text/javascript"></scr' + 'ipt>');
					
}

// Entry point.
include_gmaps_api();



*** Script B: the map page ***
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<head>
	<!-- Include the gmaps_util.js -->
	<script src="lib/js/gmaps_util.js" type="text/javascript"></script>
[...]
// Now you can write any Google Maps API code.
// So, you don't have to rewrite the Google Maps API key for different sites.
// gmaps_util.js automatically manages the keys for you.

追記 10/06 06:30

あれから少し議論が続きました。私の説明不足でBrianさんに誤解を与えてしまったみたいなので、もう少し詳しく説明してみると、結局以下のようにBrainさんに納得してもらえました。ひと安心。幼稚な英語ですが、なんとか英語で議論できたので嬉しかったです。効果的かつ効率良くコミュニケーションするのって、やっぱり難しいなぁ。でも、高校時代のように、全く英語が書けなかった頃の自分と比べると、ちょっとは上達したのかな? これからもちょっとずつライティングの技術を磨いていきたいです。

ahhh...yes that code makes perfect sense..I was just to tired last

night to think..

thanks for the code explanation..it helped me see what you were

saying...

I'm sure by the time I get this working the way I want, google will

have fixed the problem.....

thanks,

Brian

Oct 5, 11:03 pm Brianさんより

追記 10/08 22:40

「Google Maps API keyの仕様が変更され、鍵管理の負担が大幅削減」のエントリをうけて、下記の内容を一応返信しておきました。もしかして、このスレッドで議論したことがGoogleに伝わったのでしょうか?もしもそうだとしたら嬉しい限りです。

Did you see the thread "Clearing API Key", which was posted on the

Google-Maps-API Groups? The thread's URL is

http://groups.google.com/group/Google-Maps-API/browse_thread/thread/6...

.

If you haven't checked it out, please see it.

Fortunately, the problem we discussed here is now solved by Google. So,

we don't have to rely on my quick hack code anymore. Thanks Google!

2005-10-03

さて、もう10月

最近、システム開発がかなり忙しい。でも何とか良いシステムにしたいなぁ。