日日日日日日日日日日日日日 0 日日日 Web 日日日日日日日日日 日日日日日日日
講師紹介
柳田 亜沙美(あさみん)株式会社凛 代表取締役エンジニア・ Web ディレクター
• 新卒 OL 時代にエクセル VBA とAccess に出会い、生産管理・在庫管理システムを構築。
• プログラマに転職。
• 2008 年、株式会社凛を設立。
• 女性向けプログラミングスクール「 GeekGirlLabo 」運営。
• 来週から企業の新人社員研修開始!
画面機能一覧
画面や機能が一覧になっているもの
16
分類 機能 備考ユーザー画面 商品 一覧
詳細 カート 決済
見積 デザイン・レイアウト選択 ロゴをアップロード
会員 会員登録 会員情報編集
静的ページ トップページ 特定商取引法 プライバシーポリシー 会社概要
画面仕様書(表示)• 各画面に表示する項目や、各項目に対する詳細な仕様を記
入する。• 一覧表示する場合は、以下を指定する。
1. 表示件数2. 並べ替え項目と昇順 /降順、3. 絞り込み条件等
18
▼出力定義
No 表示内容 取得条件 表示順⑩ 店舗一覧 削除 =0 の店舗を 10件 登録日時降順
画面仕様書(動作)• 各画面に表示する項目や、各項目に対する詳細な仕様を記
入する。• ボタンを押した時や、セレクトボックスを選択した時にど
んな動きをするのか、など。
19
▼動作定義
No 動作 遷移先 チェック⑦ 選択時に Ajax で⑧を更新 ー ー
⑨Ajaxで選択した条件で⑩を絞り込み、更新店舗が存在しない場合は「店舗が存在しません」と表示
ー 必須チェック
⑦ ⑧ ⑨
画面仕様書(例)ー Twitter の登録フォームー
22
▼入力定義 No 入力内容 入力チェック エラーメッセージ① 名前 必須チェック 名前を入力してください。 桁数チェック 名前は 15文字以内で入力してください。② メールアドレス 必須チェック メールアドレスを入力してください。 重複チェック メールアドレスが既に登録されています。
メールアドレスチェック
メールアドレスは正しく入力してください
③ ユーザー名 必須チェック ユーザー名を入力してください。
桁数チェック ユーザー名は 8文字以内で入力してください。
重複チェック ユーザー名が既に登録されています。
半角英数チェック ユーザー名は半角英数字で入力してください
④ パスワード 必須チェック パスワードを入力してください。
桁数チェック パスワードは 5文字以上で入力してください。
⑤ チェックボックス ー
テーブル≒エクセルのシート
28
店舗名 都道府県 市区町村 番地 建物名等函館昭和店 北海道 函館市 昭和1-31-1ノースフィールド1Fフレスポ帯広稲田店 北海道 帯広市 稲田町南9線西11-1フィール旭川店 北海道 旭川市 1条通8-108オーロラタウン店 北海道 札幌市 中央区 大通西2丁目札幌パルコ店 北海道 札幌市 中央区 南1条西3-3札幌駅前通店 北海道 札幌市 中央区 北3条西3-1-47麻生店 北海道 札幌市 北区 麻生町5-1-8新さっぽろduo店 北海道 札幌市 厚別区 厚別中央2条5-6-3イオンモール札幌苗穂店 北海道 札幌市 東区 東苗穂二条3-1-1札幌元町店 北海道 札幌市 東区 北27条東15-1-20イオンタウン平岡店 北海道 札幌市 清田区 平岡2条5-2-50白石店 北海道 札幌市 白石区 南郷通り1丁目北2-32イオンモール札幌発寒支店 北海道 札幌市 西区 発寒8条12-1札幌発寒店 北海道 札幌市 西区 発寒7条12-3-17イオン江別店 北海道 江別市 幸町35釧路昭和店 北海道 釧路市 昭和中央3-3-1
カラム(列)とレコード(行)
29
店舗名 都道府県 市区町村 番地 建物名等函館昭和店 北海道 函館市 昭和1-31-1ノースフィールド1Fフレスポ帯広稲田店 北海道 帯広市 稲田町南9線西11-1フィール旭川店 北海道 旭川市 1条通8-108オーロラタウン店 北海道 札幌市 中央区 大通西2丁目札幌パルコ店 北海道 札幌市 中央区 南1条西3-3札幌駅前通店 北海道 札幌市 中央区 北3条西3-1-47麻生店 北海道 札幌市 北区 麻生町5-1-8新さっぽろduo店 北海道 札幌市 厚別区 厚別中央2条5-6-3イオンモール札幌苗穂店 北海道 札幌市 東区 東苗穂二条3-1-1札幌元町店 北海道 札幌市 東区 北27条東15-1-20イオンタウン平岡店 北海道 札幌市 清田区 平岡2条5-2-50白石店 北海道 札幌市 白石区 南郷通り1丁目北2-32イオンモール札幌発寒支店 北海道 札幌市 西区 発寒8条12-1札幌発寒店 北海道 札幌市 西区 発寒7条12-3-17イオン江別店 北海道 江別市 幸町35釧路昭和店 北海道 釧路市 昭和中央3-3-1
データベース仕様書<サンプル>
30
テーブル名称 店舗 TABLE名称 shop
№ カラム名 項目 キー 初期値 備考1id 店舗 ID ○ 自動生成2shopname 店舗名 3pref 都道府県 4city 市区町村 5town 番地 6building 建物名等 7deleted 削除 0 削除=18create_date 登録日
自動入力
9modified_date 更新日 自動入力
テーブル名称 店舗 TABLE名称 shop
№ カラム名 項目 キー 初期値 備考1id 店舗 ID ○ 自動生成2shopname 店舗名 3pref 都道府県 4city 市区町村 5town 番地 6building 建物名等 7deleted 削除 0 削除=18create_date 登録日
自動入力
9modified_date更新日 自動入力
データベース仕様書≒エクセルの項目
31
テーブル名称 店舗 TABLE名称 shop
№ カラム名 項目 キー 初期値 備考1id 店舗 ID ○ 自動生成2shopname 店舗名 3pref 都道府県 4city 市区町村 5town 番地 6building 建物名等 7deleted 削除 0 削除=18create_date 登録日
自動入力
9modified_date更新日 自動入力
フォームから入力した値以外の項目
32
データベース仕様書(例)ー Twitter のユーザーテーブル
33
テーブル名称 ユーザー TABLE名称 user
№ カラム名 項目 キー 初期値 備考
1id ユーザー ID ○ 自動生成 2username ユーザー名 3name 名前 4email メールアドレス ○ 5password パスワード 6profile プロフィール 7deleted 削除 0 削除 =18create_date 登録日
自動入力
9modified_date 更新日 自動入力
10last_access 最終アクセス日時 ログイン時に更新
データベース仕様書(例)ー Twitter のユーザーテーブル
34
テーブル名称 ユーザー TABLE名称 user
№ カラム名 項目 キー 初期値 備考
1id ユーザー ID ○ 自動生成 2username ユーザー名 3name 名前 4email メールアドレス 5password パスワード 6profile プロフィール 7deleted 削除 0 削除 =18create_date 登録日
自動入力
9modified_date 更新日 自動入力
10last_access 最終アクセス日時 自動入力ログイン時に更新
データベース設計をしてみよう
入力したデータを登録するデータベースの設計をしてみよう!
<手順>1. 入力項目を縦に並べてみよう2. 入力した値以外の項目( ID 、登録日時、更
新日時、削除など)に必要なものを考えてみよう
3. 初期値を考えてみよう
35