Tweet

連載：改造WebアプリケーションUIビフォー／アフター 第1回 ASP.NETによる3階層Webアプリ「ITブック」構築 葛西秋雄 2010/02/05

Page1 Page2 Page3 Page4

はじめに

　はじめまして、フレンドリーソフトの葛西です。今回は、ASP.NET 3.5で作成した仮想ネットショップである「ITブック」のUI（User Interface）を改善する連載を3回シリーズで投稿します。

　連載の第1回では、ASP.NET 3.5のデータコントール（DataList、 Repeater、GridView）を使用して、3階層の「ITブック」を構築する方法を解説します。第2回では、第3回で利用するjQueryとjQuery UIの各種プラグインの基本的な使い方を説明します。そして、第3回では、今回作成した「ITブック」のUIをjQueryとjQuery UIのプラグインを利用して改善します。

　本稿を読み進める前に、「ITブック」のライブ・デモを用意しましたので、事前にご覧いただくことをお勧めします。

　以下は、「ITブック」を構成する画面の表示例です。

書籍をクリック ［カートに入れる］ボタンをクリック

「ITブック」を構成する画面の表示例

　また、今回で作成している「ITブック」のソース・コードは以下のリンクからダウンロードできます（C#版とVB版の両方が含まれています）。

ITブックのプロジェクト

　それでは、本連載で使用する「ITブック」のシステム構成から説明します。

「ITブック」のシステム構成

　「ITブック」は、プレゼンテーション層、ビジネスロジック層、データアクセス層の3階層から構成されます。

図1 本連載で構築する「ITブック」システム構成

プレゼンテーション層、ビジネスロジック層、データアクセス層の3階層で構成されている。

　プレゼンテーション層では、ASP.NETのWebフォームにDataList、Repeater、GridViewなどのデータ・コントロールを配置して、商品リスト、商品の詳細、ショッピング・カートを表示します。

　ビジネスロジック層では、ProductManager、ShopManager、ShoppingCartクラスのプロパティ、メソッドを利用して、データアクセス層に商品データをリクエストしたり、ショッピング・カートに商品を追加／削除したりする処理を行います。

　データアクセス層では、ProductManagerDBクラスのメソッドを利用して、データベースを操作する処理を行います。本連載では、SQL Serverなどの本格的なデータベースを利用する代わりに、便宜的にXMLファイルを使用しています。なお、本システムは3階層の構造になっていますので、データアクセス層を入れ替えるだけで、Access、MySQL、SQL Server、Oracleなどのデータベースに移行することができます。

　以下では、まずデータアクセス層から解説していきます。

INDEX
	改造WebアプリケーションUIビフォー／アフター
	第1回 ASP.NETによる3階層Webアプリ「ITブック」構築
	1．「ITブック」のシステム構成
	2．データアクセス層とビジネスロジック層
	3．プレゼンテーション層（1）
	4．プレゼンテーション層（2）

「改造WebアプリケーションUIビフォー／アフター」

＠ITメールマガジン　新着情報やスタッフのコラムがメールで届きます（無料）

RSSフィード

は.NET開発者中心に生まれ変わりました

＠IT Sepcial

＠IT Special ヘ

• 国内初のCTF「SECCON CTF」が2月18日から開催
• 画面の点滅で取引内容に署名、日本セーフネットが新トークン
• 証明書偽造事件の原因はSSLの仕組みにあるのではない――日本ベリサイン
• IASB議長が来日「IFRSフルアドプションが日本のためになる」
• モバゲーのディー・エヌ・エーがIFRS適用へ
• ディスク要らずのデスクトップ仮想化、そのメリットは？
• ネットワーク仮想化のNiciraがベールを脱いだ

ニュース一覧へ

＠IT Sepcial

＠IT Special ヘ