Vistaで注目される辞典マッシュアップ――事例で知るLiveガジェットWindows Liveが魅せる次世代マッシュアップ(1/4 ページ)

Vistaによっていっそう注目度が高まっているWindows Live。そのサービスの1つ、ガジェットには新たなプラットフォームとしての可能性が見える。そして、大きな特徴と言えるのは“作ることが容易”という点だ。

» 2007年03月02日 08時00分 公開
[森川拓男,ITmedia]

API利用で外部データを活用する

 オンライン・ムックPlus「Windows Liveが魅せる次世代マッシュアップ」では、Windows Liveガジェット開発についてこれまで幾つかの事例を通して見てきた。開発というと身構えてしまう人が多いかもしれないが、LiveガジェットはWebページを作る感覚で十分なことが特徴だ。

 そして、基本構造と仕組みさえ理解すれば、短時間で開発可能な点が現代に合ったWebアプリケーションの1つといえる。JavaScriptとCSSを主要ポイントとするLiveガジェットは、ほかのプログラミング言語と比べても敷居が低く、取り組みやすい特徴を持っているのだ。

 この記事では、英単語を検索すると合致した単語の一覧を表示して、単語の意味を表示するLiveガジェット「EJDIC英和辞典」を紹介しながら、その仕組みと構造について解説しよう。このガジェット「英和辞典」自体は目的が絞り込まれているが、検索対象を変更するなど派生するガジェットの可能性、そして新たなLiveガジェットを作るための参考となるに違いないノウハウが詰め込まれている。

 Liveガジェット「EJDIC英和辞典」(開発元:イースト)のポイントは、意味を調べたい英単語を入力すると、英和辞書を検索して結果として検出した最初の10件の単語を表示、クリックすることでその意味を表示してくれる点だ。これは、Webサービスとして公開されている外部辞書をAPIで呼び出すことで実現されている。

概要を理解するためにインストールしてみよう

 何よりもまず、実際のLiveガジェットに触れることから始めよう。「EJDIC英和辞典」は、以下の手順で自らのLive.comアカウントスペース(Live.comページ)やWindows Live Space(スペース)にインストールすることができる。この記事では、Windows Live IDのアカウントをすでに持っていて、Liveサービスにログインしていることを前提に進めるが、新規アカウント登録から始めたい場合はこの記事を参考にしてほしい。

  • ダウンロード先

http://gallery.live.com/liveItemDetail.aspx?li=adeddf89-c3a3-4c49-bc87-b6bd04bcd8b3&l=1

「Windows Live Gallery」の「ガジェット>検索ツール」から「EJDIC英和辞典」を表示し、「Live.comに追加」をクリックする。なお、ここで「プレビュー」をクリックすると、インストールしないで試すこともできる
別ウィンドウで自分のLive.comスペースが開くので、「追加」をクリック
タブに追加されるので、「この設定を保存する」にチェックを入れて「ガジェットのインストール」をクリックしよう
なお「EJDIC英和辞典」は「イースト辞書Webサービス」から引用している

ガジェットの基本は3ファイル

 こうしてインストールが完了すれば、すぐに利用することができるのがLiveガジェットの特徴の1つだ。しかし、その前に「EJDIC英和辞典」とはいったいどのようなプログラムなのかを見ていきたい。なお、Liveガジェットの詳細な開発方法などは、本特集の過去記事を参考にしてほしい(関連記事)

 この記事の目的は、Liveガジェットの基本構造と、取り上げたLiveガジェットの開発ポイントを知ることだ。それによって、ガジェットを改造したり、自ら開発したいアイデアへと発展させていくようにするためのガイドをするのが、記事の役割となる。

 上記リンク先にもある過去記事でも述べているが、Liveガジェットの基本構造は、3ファイルから成り立っている。まずはガジェット全体の定義を行い「ガジェットマニフェスト」と呼ばれるXMLファイルだ。次にガジェットを作成するためのコードを記述したJavaScriptファイル「ガジェットスクリプト」。そしてガジェットの表示スタイルを定義するCSSである「ガジェットスタイルシート」。この3つのファイルから構成されるのが、Liveガジェットである。

       1|2|3|4 次のページへ

Copyright © ITmedia, Inc. All Rights Reserved.

注目のテーマ