ITmedia エンタープライズ：Ajaxで変わる“新”ユーザー体験 (1/3)
Web2.0を支えるテクノロジーの一つ「Ajax」。聞いたことはあるけれど、どんなものか分からない。そんな疑問に答えよう。 Webにおける新たなテクノロジーやサービスを総称する「Web 2.0」。そのなかでも、JavaScriptを用いてリッチなユーザーインタフェースを提供する「Ajax」は、Webアプリケーションの作り方を変える技術の一つだ。 Ajaxの仕組みそのものは、それほど複雑ではない。しかし細かい処理をするためには、膨大なJavaScriptのコードが必要となる。そこでAjaxアプリケーションを作る場合には、Ajaxのクラスライブラリを使うのが一般的となっている。 このオンライン・ムックPlus「Web2.0で変わるWebプログラミングの常識」では、Ajaxの基本から各種クラスライブラリを使った次世代Webアプリケーションをどのように開発すればよいのか、解説していく。 Ajaxを
Ajax | PHP & JavaScript Room
カスタマイズ性抜群の上級者向けタブブラウザ「Lunascape」 動作の重いFirefoxや、セキュリティホールの多いIEから乗り換えるなら・・・ 高機能かつ拡張性に富んだ『Lunascape』（ルナスケープ）がオススメです。 このブラウザは、驚くほど “ 動作が軽い ” のが魅力！ Firefoxみたいにメモリを食いません（笑） IEのツールバープラグイン、Firefox、Netscapeの一部のプラグインに対応しているので、今まで使っていたプラグインごと乗り換えられます。 IEのお気に入りもブラウザのサイドバーに簡単に組み込めます。 また、RSSリーダー付ブラウザなので、RSSリーダーを使わずにブラウザ上でRSSの購読や管理ができます。 Firefox同様、ダブルエンジン搭載で、IE⇔Geckoの切替ができます。 しかもエンジンを切替えてもIEツールバーやマウス
第5回 AjaxでYahoo! ウェブ検索Webサービスを利用してみよう（サーバーサイド編）
今回からはやや複雑なデータをAjax技術を用いてやり取りしてみることにしましょう。前回までの例では，サーバーから返されるデータは単純な文字列だったわけですが，もちろん，Ajaxアプリケーションでやり取りするのは，このような単純なデータばかりではありません。例えば，名前と住所，電話番号のような複合的な情報（構造データ）をやり取りしたい，というケースも多くあるはずです。 このような構造データをクライアント/サーバー間で交換するにはいくつかの方法がありますが，最も一般的なのはXML（eXtensible Markup Language）形式を利用する方法でしょう。XMLでは，HTMLにもよく似たタグの形式で構造化されたデータを記述することができます。例えば，リスト1はXMLで記述された住所データの例です。 リスト1●XML形式で記述された住所データの例<?xml version="1.0" ?>
第8回 Ajax対応ライブラリを利用しよう
前回紹介したように，XML（eXtensible Markup Language）を利用することにより，検索エンジンの検索結果のようにサイト名，URL，サマリ文などの情報を含む複合的な情報（構造化データ）を容易に受け渡しできるようになります。しかし，ここまでに見てきた方法にはいくつかの問題があります。 (1)クロスブラウザ問題 Ajax技術を構成する中核の要素がクライアントサイド・スクリプトである以上，避けて通れないのが「クロスブラウザ問題」です。クロスブラウザ問題とは，ブラウザ間の仕様差によって発生する挙動の違いのことを言います。連載第3回でも紹介したXMLHttpRequestオブジェクトの違いを代表として，クライアントサイドでコードを記述する場合には常にクロスブラウザ問題を意識してコーディングする必要があります。そのため，ときとしてトリッキーなコーディングを要求される場合もあり，クラ
第3回 基本的なAjaxアプリケーションを作成してみよう（中編）
前回は，従来型のPHPアプリケーションとAjaxアプリケーションを比較することで，Ajaxアプリケーションが従来型アプリケーションのどのような点を改善するものなのかを概観しました。今回は，前回紹介したコードを詳しく見ていくことにします。 本連載のテーマであるAjaxという意味で注目する必要があるのは，クライアント側のコード（リスト1）です。サーバーサイド・アプリケーション（searchAjax.php）は前回見たように，クライアントから受け取ったISBNコードに基づいて対応する書名を出力するだけのごくシンプルなプログラムなので説明は省略します。 リスト1●AjaxアプリケーションのHTMLファイル（searchAjax.html）<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
吠えるだけじゃなくて、行動しなくちゃ──IT戦士・amachang
ひとりで作るネットサービス──第20回目は「IT戦記」のブログで知られるamachangこと天野仁史さん（25）にお話を伺った。JavaScriptとCSSを活用してブラウザだけで動くプレゼンテーション・ツールや、主要なブラウザでXpathが使えるようにする技術などを1人で開発するamachang。その背景にはどういった苦労や悩みがあったのだろうか。 「今のamachangは吠えているだけだよね」で変わる 「今のamachangは吠えているだけだよね。君の言っている理想に近づきたかったら、もっと人を巻き込まなくちゃだめだよ」。当時のamachangはmixi日記に、仕事の愚痴を垂れ流していた。自分のやりたいことが分からない、何を勉強していいか分からない、上司とうまくいかない……。そうした愚痴を書き込んでいたら、エンジニア仲間に冒頭のように言われた。ショックだった。 もっと人に会わなくちゃだ
なぜWeb2.0は楽しいのか (arclamp.jp アークランプ)
セス・ゴードウィン氏によればWeb2.0は技術ではなく態度です（Seth's Blog : Tim O. on Web 2.0）。では、なぜWeb2.0的であることは楽しいのか？ 僕が思うに、それはWeb2.0がアートだから。 Web2.0を示す"Mush-up"という言葉は、元々ヒップホップのアーティスト達が、いろんな曲をコラージュして新しい曲を作り出すことをさします。 AJAXの楽しさはHTMLに従うのではなくHTMLをコントロールし、データを出力するのではなくデータを表現することです。 とくにハックは最高のアートです。僕がはてなマップをハックしてブックマークレットを作った時、いけないことをしているという感覚とともに、不思議な快感を得ることが出来ました。元々表示されていたHTMLをinnerHTML = ''でぶち壊し、同じデータを使って全く違う表現をする。そこには新しい表現があるわ
Prototype、jQuery、Mootools、YUI、Dojoが人気、Ajaxian調査 | エンタープライズ | マイコミジャーナル
Ajaxianは17日(米国時間)、3度目の調査結果となる「2007 Ajax Tools Usage Survey Results」を発表した。2007 Ajax Tools Usage SurveyはAjaxian.comのユーザを対象に実施された調査で、Ajaxツールの採用状況を調べるもの。同調査結果によるとPrototypeが34.10%、jQueryが29.30%、Extが22.50%、Script.aculo.usが22.30%、Mootoolsが14.30%、YUIが13.00%、Dojoが11.90%となっている。 2007 Ajax Tools Usage Survey Results - Ajaxian.comより抜粋 この2年間でAjaxフレームワークやツールの数は倍増した。過去の調査結果では直接JavaScriptを使ってAjax機能を使っているという割合が多かった
Ajax活用の5つのポイント解説します - builder by ZDNet Japan
「Ajax」がWebサイトに新しい表現と機能を提供した、画期的な技術であることは誰もが認めるだろう。2007年も、Ajaxは進化を続け、GoogleドキュメントやYouOSなどに代表されるように、アプリーションソフトやOSをWebブラウザ上で動作するプロダクトまで登場した。 しかし、Web制作者にとって、Ajaxは実際の現場でどのように使ったらよいのか、どこが使いどころなのかといったことが掴めないでいるかもしれない。そこで、本連載では「Ajax活用の5つのポイント」として、4回にわたって各ポイントを紹介していこう。 なお、本連載では実際の Ajax活用事例として、ベネッセコーポレーション 進研ゼミ高校講座の「クチコミ満載！ 先輩の大学合格体験記」というコンテンツのご協力をいただいた。ここにお礼を申し上げたい。 クチコミ満載！ 先輩の大学合格体験記 提供： ベネッセコーポレーション 進研ゼミ
Dynamic Drive DHTML Scripts- gAjax RSS Feeds Displayer (hosted)
Dec 3rd, 16': Version 2.1, which uses YUI YQL in place of Google Feeds API due to retirement of later. Also adds limitlength() method Feb 8th, 17': Version 2.2 (by jscheuer1), which adds Atom Feeds support, plus improvements to the limitlength() function Description: This script is the fastest way to display RSS feeds from other sites on your own, period. It uses Google's Ajax Feed API YQL to host
【連載】いまからはじめるPrototype.js (1) Prototype.jsの概要と$で始まるメソッド | エンタープライズ | マイコミジャーナル
Prototype.jsとはなにか Prototype.jsは、Sam Stephenson氏を中心とするチームによって開発されているAjax対応JavaScriptライブラリだ。単体でもAjaxian.comの2006年と2007年の調査で最もよく知られたAjaxフレームワークに選ばれるほどの人気を得ているが、実はWebアプリケーション・フレームワークRuby on Railsのプロジェクトで開発されているプロダクトであり、同フレームワークに同梱されているため、Ruby on Rails経由で使用されるケースも多い。 ライブラリはMITライセンスで公開され、ドキュメントはクリエイティブ・コモンズ(Creative Commons)ライセンスのAttribution-Share Alike 3.0で公開されている。詳細はライセンスのページで確認していただきたい。 これから6回にわたって、こ
Web2.0サイトのAPI、そのトップ15は？
印刷する メールで送る テキスト HTML 電子書籍 PDF ダウンロード テキスト 電子書籍 PDF クリップした記事をMyページから読むことができます Digg、Facebook、そしてdel.icio.usのようなWeb 2.0サイトは、シンプルなWebフィードを共通機能として提供するだけでなく、API（Application Programming Interface）も提供する。APIは、Web開発者がアプリケーションやウィジェットを開発する際に不可欠であり、サイト上でサービスとの対話関係を構築できるものだ。例えば、Google Maps APIを使用すると、データとマッピング情報により、サイトを訪れるユーザーに、企業の位置情報を含む地図を表示させることも可能にするのだ。 Simon Ward氏が運営するPingableにおいて、良質な実装サンプルが提供されている「Web API
[鏡] 入門 JSON 3 -- JSONP とコールバック関数 -- 戯れ言
最近 JSONP というのが話題になっているようですので， ここで簡単に紹介します。 JSONP （JSON with Padding）というのは JSON のデータフォーマットにちょっとした記述を加えて JavaScript の関数として呼び出せるようにしたものです。 JSONP については以下の記事に簡単な説明があります。（多分この記事が初出だろうという話です） Remote JSON - JSONP 例えば以下のような JSON データがあるとします。 { "name" : "Yasuhiro ARAKAWA" } JSONP ではこのデータに記述を加えて JavaScript 関数のようにしたものです。 分かりにくいですね。 具体的にはこのように記述します。 callback( { "name" : "Yasuhiro ARAKAWA" } ); "callback" の部分は関数
![[鏡] 入門 JSON 3 -- JSONP とコールバック関数 -- 戯れ言](https://cdn-ak-scissors.b.st-hatena.com/image/square/b9403aeb9e428539e1bdb60550747807cd52d387/height=288;version=1;width=512/https%3A%2F%2Fbaldanders.info%2Fimages%2Fattention%2Fremark.jpg)
snippets from shinichitomita’s journal - ブラウザからJSONで呼び出せるサービス一覧
ブラウザから動的スクリプトタグで呼び出せるJSONサービスの一覧。サービス利用にはHTMLとJavaScriptさえあればよいもののみ挙げている。JSONPであるとは限らない。オフィシャル／非オフィシャル問わず。知らないのがあったら誰か教えてください。 （追記）JSONP形式のサービスにはJSONPテストページへのリンクを追加しました del.icio.us ポスト一覧取得 http://del.icio.us/feeds/json/stomita (既定変数埋め込み) http://del.icio.us/feeds/json/stomita?callback=handlePosts (JSONP) →テスト タグ一覧取得 http://del.icio.us/feeds/json/tags/stomita (既定変数埋め込み) http://del.icio.us/feeds/json
JSON
About JSON JavaScript の仕様に基づく軽量なデータ交換形式で、詳しくは「Introducing JSON」（日本語訳）を参照してください。。 { property_1:1, ←数値 property_2:"文字列" ←文字列 property_3:[1,2,3], ←配列 method_1:function() { ←関数 alert("<日本語>"); } } こんな形式のデータで、JavaScript のオブジェクトを交換できます。xml と同等以上のデータを交換でき、かつ軽量（データサイズやエンコード、デコード処理）である事が利点です。AJAX でこれを利用する場合、主にサーバーから受け取ったデータをテキスト形式で取り出し、 var obj = eval('(' + XmlHTTPRequest.responseText +')'); obj.function()
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JavaScript かも日記: 【JSON】Remote JSON - JSONP
Google AJAX Feed API
Google
http://www.adamrocker.com/blog/102/javascript_simplest_jsonp.html
JSON/簡単なテスト:基本