AjaxやjQueryは簡単に使えるのか?
さて、Web フォームを使うことで、Ajaxを利用した動的なWebアプリケーションも簡単に開発できる。ここでは、先ほどのユーザー認証と同じ機能を持つWebアプリケーションをAjaxを使って作ってみよう。
開発手順は、先ほどの「コンポーネントの配置」の前にAjax用のサーバーコントロールである「ScriptManager」と「UpdatePanel」を配置するだけだ。ScriptManagerはASP.NET AJAXのコアコントロール、UpdatePanelは指定した部分のみを非同期で書き換えるコントロールだ。具体的には、以下の操作を行なう。
- 1.ScriptManagerをフォームの中に配置
- 2.UpdatePanelをフォームに配置
- 3.UpdatePanelの中に既存のコントロールを配置
あとは、先ほどと同様にアプリケーションを実行すれば、前回と同じようにユーザー認証が実行できると思う。ここで確認してもらいたいことは、ログオンボタンをクリックしてもブラウザーの画面遷移が行なわれないことだ。これはログオンボタンをクリックすることで、Ajaxライブラリ内部から非同期でサーバーに対して、ユーザー名とパスワードをPOSTして処理しているからだ。
次に、Ajax開発で推奨されるjQueryを使いたい場合は、ScriptManagerにjqueryライブラリを読み込むように定義する。これによって、Scripts/jquery-1.4.1.min.jsを読み込むようにHTMLが生成される。
このようにASP.NETは、Visual Basicのようなアプリケーションと同じようなドラッグ&ドロップでの開発が簡単に行なえるだけではなく、AjaxやjQueryなどの最新のWeb技術にもいち早く対応するわけだ。
エンドトーク
岩崎課長:な・る・ほ・ど。じゃあ、坂本は、ほとんどドラッグ&ドロップでユーザーインターフェイスを作り、Ajaxまで実装できたわけだな。今までのWeb開発から比べると考えられないくらい楽だなあ。
坂本:はい。今までのWeb開発は、デザインやロジックを開発するために複雑な仕組みを理解して、多くのコーディングが必要になっていました。もちろん、スクリプトは手書きですし、サーバーとクライアントを別々に開発しなければなりませんでした。それを解決するのが、フレームワークというわけです。
岩崎課長:フレームワークを利用することで、デザインとロジックを分離し、サーバーとクライアントの開発を統合すると。
坂本:はい。Visual StudioでのASP.NET開発では、さらにビジュアル開発のメリットをそのままWeb開発に持ち込み、ドラッグ&ドロップのコンポーネントの配置を行なえるようにしたんです。それが今度やってみたWebフォームの開発です。
岩崎課長:加えて、今Webの世界では非常に流行しているMVCの開発手法もきちんとサポートしたわけだな。
坂本:確かにPHPとかは実績も豊富ですし、フレームワークもあるし、ライブラリやノウハウの蓄積も多いのですが、こうしてマイクロソフトのツールを使ってみると、こっちも悪くないなと思います。とにかくプロトコルを意識しないでいいし、既存のコントロールが使い回せるというのは楽ですし。
岩崎課長:Webアプリケーションというと、オープンソース系を使っているところも多いようだが、プログラマのスキルに依存してしまったり、ソースコードやバージョンの管理が大変といった話は聞くからな。
坂本:その点、Visual Studioのような開発ツールは、コードの管理とか、チーム開発とかをサポートしているようなので、今回のアズルトラベルのようなサイトでは、やはりASP.NETで決まりといった感じでしょうか。
今回のポイント
- ・Visual Studioを使うとWeb開発が簡単になる
- ・GUIによりフォームデザインが可能である
- ・イベント自動生成で最低限のコーディングになる
- ・Ajaxがコーディングなしに実装できる
次回は、Webアプリケーション開発の主流であるPHPをWindows上で動かす方法や最新IISの実力について見ていきたい。
すべらないWebアプリ開発はASP.NETから!by 坂本
ということで、ASP.NETやVisual Studio 2010に興味を持ったユーザーは、さっそく以下のドキュメントを一読してみよう。最新のWebアプリケーション開発のノウハウや、マイクロソフトのソフトウェア開発のネタがギッチリ詰まっているぞ。
Microsoft Web 開発 ガイドライン ~ ASP.NET プログラミング エッセンシャル~
http://msdn.microsoft.com/ja-jp/asp.net/ff602016.aspx
ASP.NET 開発者向け技術情報
http://msdn.microsoft.com/ja-jp/asp.net/default.aspx
また、開発ツールの入手はこちらから。無償提供されているものをまずは試してみよう。
Visual Studio 2010 Express
日本語版の入手はこちら
http://www.microsoft.com/japan/msdn/vstudio/express/Microsoft WebsiteSpark
中小規模のWeb 開発会社の方々にはVisual Studio 2010の製品版を3年間無償で使用できる「WebisteSpark」というプログラムがマイクロソフトから提供されているので、こちらも検討してみても良いだろう。
筆者紹介:有川 榮一(Arikawa Eiichi)
熊本県出身のフリーランスのアーキテクト/プログラマー。サーバーやアプリケーションの設計/開発を中心に活動中。
http://akabana.info
この連載の記事
-
最終回
データセンター
スクウェア・エニックスがコマースでASP.NETを採用する理由 -
第6回
データセンター
ヤフーが「GyaO!」でSilverlightを採用する理由 -
第5回
データセンター
PHP on Windowsで速攻Web開発を実現 -
第4回
データセンター
わがまま?WordPressをIIS上で使いたい! -
第2回
データセンター
最新ASP.NETを知るための3つのキーワード -
第1回
データセンター
Webアプリケーションをカイゼンせよ! -
クラウド
マイクロソフトのWeb開発ツールで中身も見た目もクールに - この連載の一覧へ