| 3. |
開発をはじめる前に |
| |
|
| |
■ |
どの部分をデータベース化するか? |
| |
|
|
| |
|
モックアップデータを確認する |
| |
|
今回は、htmlベースで作成した静的な画面にプログラムを組み込み、cfm化することによって、レッスンを進めることとする。
まず、mockupフォルダ内のモックアップデータを見てみよう。今回の一覧表示で使用するモックアップデータはC:\Inetpub\wwwroot\mockup以下のindex.htmlとcategory.htmlとなる。ブラウザで確認してみよう。
※トップ画面:http://localhost/mockup/index.html
※カテゴリ画面:http://localhost/mockup/categoy.html |
 |
| |
|
index.html→category.html |
| |
|
index.htmlはトップページ画面であり、画面の左側にはカテゴリが表示されている。カテゴリ名称をクリックすると、該当カテゴリに属する商品一覧画面category.htmlが表示されることとなる。
|
 |
| |
|
データベースでの管理 |
| |
|
トップページ画面内の「NEW ITEM」や「INFOMATION」に関しても、データベース化して管理することは可能であるが、今回は「カテゴリ」と「商品」のみをデータベース管理することとする。
では、実際にデータベースの中身を見てみよう。 |
| |
|
 |
 |
| |
■ |
データベースの構造を見てみよう |
| |
|
今回は、既に作成済のデータベースを使用するため、本項は説明のみとさせていただく。興味のある方はMicrosoft
Accessにてmdbファイルをご覧いただきたい。 |
| |
|
|
| |
|
カテゴリマスタ( M_Category) |
| |
|
商品のカテゴリを保管したテーブルである。商品カテゴリは3つの要素から成り立っており、この要素のことをフィールドと呼ぶ。
「CategoryID」は複数登録されたカテゴリひとつひとつを一意にするための番号であり、カテゴリが増える度に他の行と異なる数字が自動的に割り当てられる。このようなフィールドをオートナンバー型と呼ぶ。またCategoryIDフィールドの情報は他のデータと重複することはなく、テーブルに蓄積されたデータが一意になる情報を登録するフィールドのことをPrimaryKey(PK)と呼ぶ。
よって「CategoryIDはM_CategoryテーブルのPK」ということとなる。PKはテーブルに必ず1つ必要だ。
「CategoryName」はカテゴリ名称を登録するフィールドである。先ほどの「CategoryID」とは異なり、数字ではなくテキストが入るフィールドとなる。このようにテキストが入るフィールドをテキスト型と呼ぶ。また、このフィールドには128バイト(全角64文字)まで登録することができる。
「CategoryImg」はカテゴリ画像名を登録するフィールドで、「CategoryName」と同様、テキスト型で255バイトまで登録することができる。
|
 |
| |
|
アイテムマスタ( M_Item) |
| |
|
商品情報を保管したテーブルである。
「ItemID」はカテゴリマスタの「CategoryID」と同様のオートナンバー型であり、
「ItemCode」、「ItemName」、「SmallImg」、「LargeImg」、「Size」、「Notes」はテキスト型となる。(ただし登録バイト数、値要求はそれぞれ異なる)「CategoryID」、「Price」は数値型といい、数値を登録できるフィールドとなる。
|
 |
| |
|
 |
| |
|
| テーブル名 |
M_Category |
説明 |
カテゴリマスタ |
| フィールド名 |
データ型 |
制約 |
説明 |
| CategoryID |
オートナンバー |
PK |
カテゴリ管理番号 |
| CategoryName |
テキスト型(128) |
|
カテゴリ名称 |
| CategoryImg |
テキスト型(255) |
|
カテゴリ画像 |
|
| |
|
|
| |
|
| テーブル名 |
M_Item |
説明 |
商品マスタ |
| フィールド名 |
データ型 |
制約 |
説明 |
| ItemID |
オートナンバー |
PK |
商品管理番号 |
| CategoryID |
数値型 |
|
カテゴリ管理番号 |
| ItemCode |
テキスト型(50) |
|
商品コード |
| ItemName |
テキスト型(128) |
|
商品名 |
| Price |
数値型 |
|
販売価格 |
| SmallImg |
テキスト型(255) |
|
サムネイル画像 |
| LargeImg |
テキスト型(255) |
|
拡大画像 |
| Size |
テキスト型(255) |
|
商品サイズ |
| Notes |
テキスト型(255) |
|
商品説明コメント |
|
| |
|
表1 カテゴリマスタと商品マスタ |
 |
| |
■ |
各画面ごとの役割 |
| |
|
では、これらのデータベースが、今回使用する2つの画面「index.html」と「category.html」にどう関わり、商品一覧機能を果たすのか、先ほどの図「商品一覧への遷移」をもとに考えてみよう。
それぞれのファイルの役割は次の通りとなる。 |
| |
|
|
| |
|
◎index.html |
| |
|
| 1) |
カテゴリ名を一覧表示し次の画面category.htmlにリンクする。 |
| 2) |
データベースからカテゴリを取得し、一覧表示を行いリンクを設ける。 |
| 3) |
一覧されたカテゴリ名称のリンクよりcategory.htmlへ遷移するが、リンク先のファイル名と一緒に「どのカテゴリが選択されたか」という情報も一緒に送る必要がある。 |
|
| |
|
|
| |
|
◎category.html |
| |
|
| 1) |
index.htmlのカテゴリ名称リンクに付加された「どのカテゴリが選択されたか?」という情報を受け取る。 |
| 2) |
選択されたカテゴリの画像名をデータベースから取得し画像を表示する。 |
| 3) |
選択されたカテゴリに属する商品の情報をデータベースから取得し一覧表示を行なう。 |
|
| |
|
上記に挙げた2つの役割をもとに、次はどのようにデータベースから目的の情報を取得するかを考えてみよう。 |
 |
| |
■ |
データベースから情報を取得する。 |
| |
|
|
| |
|
データベースを操作するSQL |
| |
|
カテゴリや商品の一覧情報を取得するためにデータベースにアクセスするが、ColdFusionではSQLという言語を用いてデータベースの情報を取得する。SQLとはデータベースを操作する言語であり、様々な種類のデータベースにおいても同じように操作することができる。 |
 |
| |
|
カテゴリ一覧情報を取得する |
| |
|
早速データベースからカテゴリ一覧情報を取得するためのSQL文を見てみよう。SQL文は下記となる。
直訳すると「M_categoryから*を選べ」という意味となる。M_categoryは前項でとりあげたカテゴリマスタテーブルのことであり、「*」は全てのフィールドという意味である。よって「M_categoryテーブルからM_categoryテーブルの全フィールドを選べ」という意味となる。
この一文でトップページのカテゴリ一覧情報を取得するSQL文は完成である。
ここでテーブル名の後に条件式を追加することで、特定の情報を取得することができる。
| SELECT * FROM M_category
WHERE CategoryID = CategoryIDの値 |
|
(SELECT * FROM テーブル名 WHERE フィールド名 = フィールドの値)
カテゴリ一覧情報を取得するSQL文に「WHERE CategoryID = CategoryIDの値」が加わっただけである。
SQL文の意味は「M_CategoryテーブルからCategoryID = CategoryIDの値のデータの全フィールドを選べ」という意味となる。「CategoryIDの値」の部分には実際のcategoryIDフィールドの値を入れることとなる。
この他にも、データを登録するINSERT文、登録されたデータを更新するUPDATE文、登録されたデータを削除するDELETE文等様々なSQL文を使用してデータベースとの連動を図るのである。
|