|
||||||
|
|
【要約】 連載第1回は、リッチインターネットアプリケーションでの「勤怠管理システム」を作るにあたっては必要不可欠な知識としての用語や技術・開発手法などを先ずは紹介する。リッチインターネットアプリケーションを構築するには、開発パートが幾つかに分かれるので、しっかりとした予備知識を学んでいただきたい。 【概要】 2002年8月にマクロメディア社よりMacromedia ColdFusion MX（以下ColdFusion MX）がリリースされた。ColdFusion MXはHTMLタグライクなCFML(ColdFusion Markup Language)を記述して、比較的簡単にWEBアプリケーションを開発できるスクリプト言語であるがそれに留まらず、Macromedia Flash MX（以下Flash MX）からMacromedia Flash Remoting（注１）を介してColdFusion MXに接続することで、リッチインターネットアプリケーションを容易に開発できる次世代エンタープライズアプリケーションサーバである。 本連載第1回では、ColdFusion MX/Flash MXの概要説明、リッチインターネットアプリケーションの説明とリッチインターネットアプリケーション開発手法（メソドロジー）の紹介、本連載で構築する「勤怠管理システム」の概要説明を行う。 連載第2回では、サーバへのColdFusion MXのインストール、クライアントマシンへのリッチなユーザインターフェースを制作するFlash MX・ColdFusionMXのオーサリングを行うMacromedia Dreamweaver MX（以下DreamWeaver MX）のインストール、そして、Flash MXでリッチインターネットアプリケーションを開発する際に必要となる NetServices API を追加するためのMacromedia Flash Remoting コンポーネント （注２）のインストールを行い、開発環境を構築する。本連載ではデータベースとしてはmySQLを利用するものとする。 そして、実際にそれらを利用して開発する「勤怠管理システム」の要件を定義し、UML（注３）ベースの設計を行う。 連載第3回目ではいよいよ実装フェーズに入る。実際にColdFusion MXを使ってユーザインターフェースからのデータベースへの接続インターフェースであるAPIコンポーネント、CFCs（ColdFusion Components）（注４）のコーディングを行い、データベースへ接続する。そしてColdFusion MXベースだけでブラウザーベースの勤怠管理システムを構築してテストを行う。 連載最終回は、リッチインターネットアプリケーションの要となるFlash MXを使ってユーザインターフェースをデザインし、MVC（注５）アーキテクチャーをベースにActionScript（注６）でコーディングを行い、リッチインターネットアプリケーション「勤怠管理システム」を完成する。
【ダウンロード】 ●ColdFusion MX、Flash MX 、DreamWeaver MXの評価版ダウンロード http://www.macromedia.com/jp/software/trial_download/ ●Flash Remotingコンポーネントのダウンロード http://www.macromedia.com/jp/software/flashremoting/downloads/components/ 【当社のMVCフレームワーク】 CFMXを使用して、APIコンポーネント・CFCsのコーディングを行い、ユーザインターフェイスからデータベースへの接続部分を構築する。また、Flash MXによるユーザインターフェイスのデザインとMVCアーキテクチャーをベースにActionScriptでコーディングを行ない、リッチインターネットアプリケーションを開発する。 |
||||||||||||||
 |
| １． | ColdFusion MXとFlash MXの概要説明 | ||
| 「ColdFusion MXとは？」 ColdFusion MXとはリッチインターネットアプリケーション開発に最適なエンタープライズアプリケーションサーバであり、Macromedia社が販売するWebアプリケーションサーバである。また、HTMLタグライクであるので、HTMLでコーディングした方であれば容易に理解できる非常に使いやすいスクリプティング環境を提供するものである。本連載においては、Flash MXと統合したリッチインターネットアプリケーションの開発を行なうが、ColdFusion MX単体だけで、オンラインショッピングサイトなどのECサイトや顧客を一元管理し、顧客の好みなどを理解してより一層の顧客関係を重視するCRM（Customer Relationship Management）を取り入れた企業サイト、ナレッジマネージメント等のEIP（Enterprise Information Portal：企業情報システム）など様々なサービスを提供するWEBサイトを短期間で開発することが可能である。 先ずはColdFusion MXだけで、ブラウザーベースの「勤怠管理システム」を構築することとする。 「Flash MXとは？」 Flash MXは、前バージョン(Flash 5)まではどちらかと言えば、デザイナーが動きのあるサイトやゲーム、アニメーション等を作成する、エンターテイメント的なアプリケーションを作成するツールとしてのイメージが強かったが、Flash MXでは、Flash Remotingコンポーネントを使用したサーバサイドとの連携やオブジェクト指向でのコーディングが可能であり、さらに外部ファイル（ASファイル）として作成できる点が新たな機能として注目に値する。さらにECMAScriptに準拠した事で、より一層開発者に親しみやすくなったと思われる。本連載において構築する「勤怠管理システム」では、主にユーザインターフェースからデータを受け取り、Controllerで制御を行いModelよりデータベースAPIであるCFCsへデータを受け渡し、結果をViewであるユーザインターデースへ返す一連のMVCアーキテクチャーフローにあたる部分の開発を行うこととする。 |
|||
|
|||
| ２． | Rich Internet Applicationの説明 | ||
| （今後のWEB Application開発の一つの方向性としての） 現在のWebサイトはブラウザー上でのページ単位をベースとしたサービス提供が主流であるが、例えば、典型的な検索機能の場合、一つの情報を検索し詳細情報を参照する場合においても、先ずは検索を行うページへ遷移して、そのページで検索条件を入力し検索を実行し、検索結果を次画面で一覧を表示して、さらに一覧結果から目的の情報をクリックして、詳細情報のページを表示するという３ステップを経なければならない。また複雑な予約システムや購買システムの場合などはさらにステップが増えてしまうということなどが往々にしてある。また、検索結果を単に表示するだけでも、実際にはブラウザーのページの構成要素ヘッダー情報であるとか、表示を成型するためのHTML情報などのデータがページを遷移する度に送信されている。 リッチインターネットアプリケーションで上記を実装する場合、ワンスクリーンで全てのステップを一つの画面で実装することが可能となり、余計なページ遷移が発生しない。従来のクラサバシステムやデスクトップでのアプリケーションの使い勝手の良さをWebアプリケーションにおいても実現することが可能となるわけである。さらに、実際にサーバと連携してくる情報は必要なもののみとなり、検索結果であれば検索結果のみの情報がAMF(注８)となって送られてくるだけであるため、不必要な情報のやり取りが一切発生しない。 リッチインターネットアプリケーションを実装することにより、クラサバやデスクトップのアプリケーション等と同様の使い勝手の良いユーザインターフェースが実装でき、さらにFlash MXで実現されているため、Flash Player6が実装されており、且つインターネットへの接続さえされていれば、どこからでも、どのクライアントマシンからでもWebサイトと同様に柔軟にユビキタス（いつでもどこでもネットワーク）同様の環境が実現できる。
【ブラウザーベースの遷移画面とリッチインターネットアプリケーションのUIの場合の比較】 リッチインターネットアプリケーションでは、全てのステップを１つの画面に実装可能であり、且つ必要な情報のみサーバより取得するため、不必要な情報のやり取りは発生せず、ユーザビリティの高いインターフェイスが実現可能となる。 |
|||
 |
|||
|
|||
| ３． | CF MX + Flash MXを使ってRich Internet Applicationコンテンツ構築を実現するための開発メソドロジー | ||
| 本連載で構築する「勤怠管理システム」は、MVCアーキテクチャーを基本とした設計モデルにより実装を行うものとする。Flash
MXで作成されたUIとActionScriptがViewに相当し、Viewからの情報をControllerであるActionScriptファイル（ASファイル）が受け取り、受け取りデータを処理するActionScriptファイル（ASファイル）であるModelが処理を行い、バックオフィスのDBとの接続APIであるCFCsへと処理を渡す。そして結果をModelからController経由にてViewであるUIへ渡して、一連の処理を完了する。 【当社のフレームワーク】 Flash MXで作成されたUIとActionScriptによるView、Viewからの情報を受け取るＣｏｎｔｒｏｌｌｅｒ、Controllerからの情報を処理してバックオフィスとの接続APIであるCFCsへと処理を渡すModel。 これら一連の処理により処理が完了する。 |
|||
 |
|||
|
|||
| ４． | 本連載で構築する「勤怠管理システム」の概要 | ||
| それでは最後に、本連載で構築を目指す「勤怠管理システム」に関しての概要を述べることとする。 本連載でのリッチインターネットアプリケーションの開発に「勤怠管理システム」を取り上げたのは、ColdFusion MXとFlash MXを使う事でC/Sシステム的な使い方が可能となり、データのやり取りも必要最低限だけでよく、オフィスでは一般的良く使われるシステムであるので、本連載で取り上げた。 実装機能は出退社時にタイムカードを記録する「出社打刻」「退社打刻」と月毎の出退社状況を閲覧する「タイムカード参照」、実際に「勤怠管理システム」を通してタイムカードを利用するユーザの管理を行う「ユーザ登録」「ユーザ修正」「ユーザ削除」の６つの機能から構成されるシステムである。次号においては、開発環境を構築し「勤怠管理システム」の要件を定義し、仕様を検討する予定である。 第2回 ColdFusion MX / Flash MX / DreamWeaver MX等の開発環境構築・仕様設計 第3回 ColdFusion MX単体での「勤怠管理システム」の実装（ブラウザーベース） 第4回 Flash MXでのリッチインターネットアプリケーション「勤怠管理システム」の構築 【実装機能のユースケース図】 実際の勤怠管理システムは、ユーザが利用する「打刻」等の３つの機能と、利用するユーザを管理する「ユーザ登録」等の３つの機能により構成されることとなる。 |
|||
 |
|||
 |