Ajax Webアプリケーション奮闘記 〜関西温泉マップ〜

Ajax Webアプリケーション作成にあたり、技術的メモや奮闘内容、未解決問題等を掲載していきます。 もちろん、関西温泉マップはβ版なので無料でご利用いただけます。


私おすすめのレンタルサーバー | ここが便利！レノボWeb広告限定ストア

Webロボットの研究再開。その前に・・

やろうやろうと、思っていたら資格試験とかの勉強を始めちゃったので、放置してましたがWebロボットの研究を再開します。
以前、書いた記事↓に掲載していたリンクに、J-Spiderの勉強内容が日本語で掲載されていました。

・Ajax Webアプリケーション奮闘記 〜関西温泉マップ〜 WebCrawlerを自作できないか？
「４．今日の井原 - 尾内研究室クローラ勉強会 レジュメ」

が、

最近、アクセスしてみたところ、リンク切れしてましたので、泣く泣く英語のマニュアルを利用して研究を再開したいと思います。
・JSpider - the Open Source Web Robot

とは言え、あまりにもマニュアルばかり見てては、英語の勉強になりかねませんので、CVSからプロジェクトをダウンロードして、動作を見ながら検証したいと思います。

ちなみに、下記で僕の英語能力をチェックしたところ、「高校卒業レベル」でした・・
・TOEIC(R)TEST DS トレーニング

先が思いやられる・・

それはさておき、
言葉の定義ですが、以前Webクローラという紹介で記事を書きましたが、
Webスパイダー、Webロボットとか呼び名はいろいろあるようです。

ここで取り上げるJ-Spiderは、”Spider”とか言ってますが、サイトタイトルにRobotと表記がありますので、以後Webロボットと呼ぶようにします。

次回は、EclipseでCVSからチェックアウトしてみます。

Google Mapsに「地形」レイヤー

より細かい描写ができるようですが、

・Google Mapsに「地形」レイヤー

どんなときに役立つんでしょうか？
山越えをもくろむ人？

「地形」だから、自治体とかにとって便利なのかなぁ。

一方でこんな地図も登場しているようです。↓
・3D地図ビューワーソフト「ちず丸ぐぃ〜ん」の無料ダウンロードを開始 | パソコン | マイコミジャーナル

Ajax向けライブラリを探すときのサイト

■JavaScriptライブラリの定番について、長所と短所をまとめたサイト。今後、ライブラリ利用にあたり参考にしてみる。

・AJAX/JavaScriptライブラリまとめ (2005/9/6 Revision .1.3) - 実用

■国内サイトではかなりの情報量をもつ。ライブラリだけでなくAjax関連情報が豊富。
・Ajax (JavaScript) Library List (Ajaxライブラリ一覧)

■海外サイトだが、画像でプレビューしてれくてるので直感的でわかりやすい。ライブラリ数は80！
・80+ AJAX-Solutions For Professional Coding | Developer's Toolbox | Smashing Magazine

世界的な鳥取県民！！

ワタクシ、鳥取県出身でございますが、

日本一人口の少ない県民であり、
日本一交通事故死亡者数の少ない、
という取り柄の無い県でございます。

そんな、世に知られない鳥取県も、
世界的に有名な方がＩＴ業界におられます。

まつもとひろゆき先生でございます。

単なる自慢です。聞き流してください。

まつもと先生とは何の関係もございません。単に同じ出身県という関係ではございますが、その先生の講座がIT Proにありましたので、
ご紹介させていただきます。

・まつもと直伝 プログラミングのオキテ--目次：ITpro

AjaxWebアプリケーションのデザインパターンに関するリンク

Ajax Webアプリケーションに関して、
これから勉強するべく、参考としたいリンクを個人的にメモ。

【そもそもデザインパターンとは？】
・デザインパターンとは：ITpro

【IBMのサイト】
・Ajax と XML: Ajax に共通の 5 つのデザイン・パターン
・Ajax と XML: Ajax の 5 つのアンチパターン
・Web サービスの脆弱性を避けながら Ajax アプリケーションをスピードアップさせる
・Ajax RSS リーダー
・Ajax と XML_ Ajax の最高傑作から学ぶ

【IT Proのサイト（Ajaxと関係ないかも・・でもキホン）】
・まつもと直伝 プログラミングのオキテ 第8回：ITpro
・まつもと直伝 プログラミングのオキテ 第9回：ITpro
・まつもと直伝 プログラミングのオキテ 第10回：ITpro
・矢沢久雄の早わかりGoFデザインパターン 目次：ITpro
・基礎からのオブジェクト指向 目次：ITpro
・特集 オブジェクト指向は難しくない！----目次：ITpro
・羽生田栄一の「デザイン・パターン論」 目次：ITpro
・オブジェクト指向分析・設計の基本---目次：ITpro

【その他】
・デザインパターン[モデリング] -TECHSCORE-
・Web 2.0：次世代ソフトウェアのデザインパターンとビジネスモデル（前編）:コラム（終了） - CNET Japan
・オブジェクト指向とデザインパターンブログ

【書籍】
・Ajaxデザインパターン ―ユーザビリティと開発効率の向上のために

Ajaxアプリケーション向けの統合開発環境Aptana Studio 1.0リリース

Eclipse IDEをベースに開発されたJavaScript/HTML/CSS向け統合開発環境。

各紙での評判が良いので掲載しておく。
・Aptana Studio: Compare Versions

【各紙の記事】
・Web 2.0統合開発環境、2年の開発を経てついに登場 - Aptana Studio 1.0 | エンタープライズ | マイコミジャーナル
・Web開発者は必見！IDE「Aptana Studio1.0」リリース:ニュース - ZDNet Japan
・CodeZine：「HTML、CSS、JS、PHP、Ruby、AIR」 フリーの開発環境Aptana 1.0リリース（エディタ, ツール）

【使い方など】
・AptanaでWebページ作成はここまでできる！（1/3） − ＠IT
・Aptana.jp | Aptanaの日本語ローカライズを目的としています。

テンプレート編集：サイドバーにカレンダーを追加してみる

Movable Type４で、テンプレートのサイドバーにカレンダーを追加する方法について。

このやり方が正しいかどうかわからないが、
MOVABLE TYPEのヘルプには、具体的な手順で書かれてなかったので、メモしておく。

ヴァージョン3の時は、HtmlファイルやCssファイルを直に触って、テンプレートの編集を行っていたが、ヴァージョン4ではUI操作で編集が可能なようで、テンプレートに傷を付ける心配が少ない。

ただ、最初だけ、テンプレートのファイルを触る必要がある。
(注意)AjaxなUIの為、Operaだと正しく動作してくないかも。

1.追加項目の選択
MT4ではブログに必要なパーツがあらかじめいくつか用意されている。
その用意されているパーツを選択する為、図1-1のようにウィジェットセットをクリック。図1-2が表示される

MT4：ウィジェットセット

-図1-1-

デフォルトでは図1-2で、「First Widget Manager」のみが表示されている。それをクリックすると、図1-3が表示される。

MT4：ウィジェット選択

-図1-2：ウィジェットセット-

図1-3で、表示させたい項目を「利用可能」項目から「インストール済み」項目へドラッグ＆ドロップさせることで編集可能だ。
デフォルトでは、すべてが「インストール済み」に存在するので、特に触る必要は内が、全部は多いので、図1-3のように「カレンダー」を含め間引いた。

MT4：ウェジェット編集

-図1-3：ウィジェットセットの編集-

図1-4に示すように、ここで編集したウィジェットセットの名前を覚えておく。

MT4：ウィジェットの名前

-図1-4：ウィジェットセットの編集（名前）-

2.ウィジェットの反映
編集しウィジェットをブログに表示させる手順を行う。
[デザイン]-[テンプレート]を選択。
図2-1に示すように、
�．謄鵐廛譟璽肇皀献紂璽襪鬟�リック
�▲汽ぅ疋弌爾鬟�リック

MT4：サイドバーに反映させる為に

-図2-1：サイドバーに反映させる-

ここで、テンプレートファイルが登場し、直に触ることとなる。図2-2
参照。ここでは、好きな場所に、以下のコードを埋める。
※この書き方も参考程度で・・。

MT4：テンプレート修正

-図2-2：サイドバーに反映させる-

【コード】


<$MTWidgetSet name="First Widget Manager"$>



ただ、nameには、先ほどのウィジェット名を入れることをお忘れなく。
これで、[保存]ボタンを押下し、再構築を行う。図2-2参照。

MT4：再構築

-図2-2：再構築ボタン-

安価で本格的サイトを作る流れ〜構築編〜

前回の続き
・安価で本格的サイトを作る流れ〜準備編〜
前回も記述したが、私のサイト構築パターンは以下の流れ。

[Webサイト構築パターン]
１．お名前.comでドメイン取得
　↓
２．ロリポップ！
でサーバをレンタル
　↓
３．Movable Typeをダウンロードして、ブログ構築


２−３．今回は、準備できたサーバに対して、
サイトを構築していく。
まず、HTMLファイルをサーバに置く為に、以下のソフトをダウンロードしてきた。
・FFFTP

FTPクライアントと呼ばれるもの。
使い方は簡単。最新版をダウンロード後、パソコンにインストール。

ffftp起動画面


起動すると、上記のような画面が表示されるので、[新規ホスト]をクリックする。

ffftp設定画面


ここに設定する内容は、「【ロリポップ！】お申し込み完了のお知らせ」というメールに記載されている内容をそのまま記載すればよい。記載しておくまではないが、対応は以下の通り。

・ホストの設定名：（任意）
・ホスト名（アドレス）：ＦＴＰホスト
・ユーザ名：ＦＴＰユーザー
・パスワード／パスフレーズ：ＦＴＰパスワード

この入力が完了したら、HTMLファイルを作る。
index.htmlに適当なタグを詰込んでアップロードしてみる。
そして、お名前.comで登録したアドレスを打ち込んでみる。
その結果、アップロードしたページが表示されれば、ここまではグッジョブ！

３．次にMovable Typeでブログを構築する。
　現時点の最新版が、バージョン4。関西温泉マップのときが、バージョン3だったので、さらに進化している。
バージョン3までは、インストール方法をネットで調べて、設定ファイルを編集したり・・など、初心者には少々高い壁であったが、バージョン4になってから、そういった面倒な部分が排除されている。バージョン1時代から知っている僕としては、少々物足りない気がするが、効率的なので良しとする。
なお、ここでインストール方法について紹介するのは、省く。
ロリポップのマニュアルを見る方が圧倒的に、理解しやすいだろう。
・ロリポップ！レンタルサーバー - MovableTypeの設置の前に

と、いうわけで、こんなサイトとブログができた。
・http://www.aficionado-baseball.com/
・http://www.aficionado-baseball.com/UpDateInfo/

ドメインのトラブル解決

以前、このようなトラブルが発生していた。
・ドメイントラブル

お名前.comに問い合わせ中であったが、
メールにて、丁寧な回答をいただいた。
以下がその抜粋。

--------------------------------------------------
お問い合わせの件につきましては、ネームサーバー変更直後の為
場所や接続に行くDNSによって反映している場所と未反映な場所が
存在する状態です。

ネームサーバー情報変更の反映までのお時間につきましては、最大で
48〜72時間程度のお時間がかかる形となっております。
--------------------------------------------------

やっぱり、ロリポップのマニュアルのように、
１日以上の時間が必要だった。
このことは、お名前.comのhelp等には大々的に書かれていない。
不利な情報だから掲載していないのか？・・

こっちとしては、機会損失してるんだけど。
まぁ、次回への教訓としてメモ。

ドメイントラブル

新しいサイト開設にあたり、
ドメインを取得し、取得業者のサイトからネームサーバ情報を設定。

夕方には、その情報が反映されたようで、
Webサーバに情報をアップすれば、インターネット上でサイトが閲覧できていたが、同日の22時あたりを過ぎたときから、閲覧できなくなり、下記ページが表示されるようになった。


お名前トラブル


現在、ドメイン取得業者にお問い合わせフォームより、問い合わせ中・・・。

安価で本格的サイトを作る流れ〜準備編〜

インターネット上に、Webサイトを作る際、
本格的で手っ取り早い方法は、私の場合、以下のパターンを利用することが多い。

[Webサイト構築パターン]
１．お名前.comでドメイン取得
　↓
２．ロリポップ！
でサーバをレンタル
　↓
３．Movable Typeをダウンロードして、ブログ構築

こうすることのメリットとしては、
レンタルなサーバでありながら、カスタマイズ性に優れているはもちろんだが、オリジナルなドメインを取得すれば、Googleなどの検索エンジンにヒットしやすい。どこかの、無料サービスを利用して、Webサイトを構築する場合は、簡単ではあるが、なかなか検索されにくい上に、カスタマイズ性の自由度もかなり下がる。そうなると、メリットは無料という点でしかない。

で、今回も新たにサイトを開設するワケだが、
毎回、やり方を思い出すのに無駄な時間を要してしまうので、
ここにメモしておく。

１．お名前.comではドメイン取得は容易である。
　サイトを訪れ、取得したいドメインを検索後、案内されるがままに登録を進めていけば、知らぬ間に、登録が終了している。
この時、お名前IDとパスワードは控えておく。

２−１．ロリポップでは、お申し込みフォームより、独自ドメインプランを選択。取得済みのドメインを選択後、必要事項を入力し、確認メール送信ボタンを押下する。この時、１の作業が完了して間もない場合、WHOIS情報が反映されていません。というエラーが出ることがある。この場合、反映されるまでしばらく待ってから、再度２−１の手順を行う。

２−２．ロリポップから、サイト開設の完了通知が届くと、次にDNS設定を行う。お名前.com側では、DNS設定ではなく、”ネームサーバ設定”で行う。※DNS設定という項目もあるので注意！
[ネームサーバ設定]の[ネームサーバー情報入力]フォームにロリポップで公開されている。
・プライマリネームサーバー
・セカンダリネームサーバー

を入力する。下記リンク参照。

【ロリポップのネームサーバー情報】
http://lolipop.jp/?mode=manual&state=user&state2=chg_plan

なお、ロリポップのサイトでは、ＤＮＳ設定後反映されるまでに１〜３日程必要とのこと・・。でも、実際は、数時間で反映さていた。当日のうちにドメインが使える状態となっていた。

以降の手順は〜構築編〜に記述する。

[2007/10/01追記]
上記の”数時間で反映されていた”というのは、仮の姿のようであった。お名前.comに問い合わせたところ、最大48〜72時間程度かかるとのこと。

Webクローラの動きと問題

前回の記事
・Ajax Webアプリケーション奮闘記 〜関西温泉マップ〜 WebCrawlerを自作できないか？
で、掲載したリンクより、Webクローラの単純なアルゴリズムと、実現に向けての問題点をピックアップしてみる。

まず、Webクローラは大まかに以下のような動きで実現する。

１．出発となるURLを設定
２．HTTPプロトコルによりWebページを取得する。
３．取得したWebページのHTMLを解析し、リンクを抽出する。
４．３で取得したリンクより２を実行する。

この動作を大前提に、ネックとなる部分を挙げてみます。

A.取得できないWebページに対する処理
　リンク先のURLが実際に存在するものとは限らない。その為、取得でき無かった場合の処理やタイムアウト処理が必要となってくる。

B.リンク先へは周期的なアクセスとする
　Webクローラをバッチ処理のように、次々とアクセスすると、Webサーバへの負荷が大きくなる。場合によっては攻撃と勘違いされる。数秒に1回のペースでアクセスするなど、負荷を軽減させる処理が必要。

C.既に訪れたURLにアクセスしない
　この処理を入れないと、無限ループで脱出できなくなるし、同じ情報を何度も蓄積することになる。この処理は簡単なようで、意外と難しい。
例えば、当ブログのＵＲＬ
http://ajaxapp.blog79.fc2.com/
http://ajaxapp.blog79.fc2.com/index.html
上記２つのURLは同じページを指す。
など・・・

これらを踏まえてWebクローラを作る必要がある。

WebCrawlerを自作できないか？

膨大な量のWeb情報の中から、欲しい情報を見つける為に、OperaブラウザやFireFoxブラウザを利用しているが、

さすがに、単純な情報収集を手作業で行う事への限界を感じ始めた。

というワケで、
Webクローラで、自動的に情報収集できたらいいなと思い、
自作する方法を調べてみた。

いきなり、Javaで書かれたオープンソースのWebクローラのサイトを発見したのだが、英語サイトの為、ややハードルが高い。でも、一番の近道はこのサイトであろう。

１．Manageability - Open Source Web Crawlers Written in Java

リンク１は、置いておいて、日本語サイトで紹介しているものを探してみた。
下記リンク２Lは、Webクローラにおける単純なソースが書いてある。導入程度に残しておくとする。ただ、このURLのブログ、2007年2月で更新がストップしているようだ。残念・・

２．プログラム開発・運用・取材大奮闘のワンワンチャンネルスタッフM: 検索クローラーの作成 其の二

３は若干、ボクのなじみの無い言語Pythonだが、
日本語で分かりやすく説明してくれてるWebクローラ

３．Webstemmer

４はご丁寧に、JSpider(Javaで書かれたオープンソースのWebクローラ)に沿っての研究内容を公開してらっしゃいます。m(_ _)m
ただ、こちらも2006年で更新ストップ。残念・・

４．今日の井原 - 尾内研究室クローラ勉強会 レジュメ

でも、何も知らない状態からの勉強には、利用しやすい。
まずは、ここから入ってみることにする。
[07/12/23]
リンク切れの為、削除。
英語のマニュアルで勉強することに・・。


Webビジネスの今後

・[ThinkIT] 第1回：変化が加速するWebビジネス (1/3)

記事には興味深い数字がいくつか掲載されている。
・インターネット人口は現在６０００万人だが、２０１０年には、１億人に突破する。
・インターネット広告の収益３割はYahoo。１日のページビューは6億。

そして、気になる今後注目ビジネスは仮想生活空間を提供するサービスらしい。ちょっとピンと来ない。Web上に構築された世界の中で擬似生活を送れるというサービスなのだが、そんなのがビジネスとして成り立つのか疑問・・。

また、ブログやＳＮＳなどのコミュニケーションサービスや、動画配信も始まったばかりのビジネスなので、注目度高だ。

そして、最後にWebビジネスとして最大の成功要因は「タイミング」だと、野村総合研究所 小林 慎和は述べている。

この加速度的に成長するWebビジネス界で、安月給の厳しい労働環境である僕はなぜ・・。一言にＩＴ業界として市場は広がっていると言っても、上記「タイミング」をつかむか否かで落差が激しい気がする。

HOWS、Ajax技術者養成サービスを開始

Ajax開発者の養成に関する記事。

・[ThinkIT] HOWS、Ajax技術者養成サービスを開始
[記事引用]

HOWSは3月27日、企業におけるWebシステムへのAjax適用技術習得を目的とする、「Ajax技術者養成サービス」を2007年5月より提供開始すると発表した。


前のページ 次のページ

無料ホームページ アフィリエイト レンタルサーバー FC2ブログ 一戸建て