ここではサインイン機能に加えてサインアップ機能、サインアウト機能を実装します。

画面一覧

画面名 概要
サインイン画面 ユーザ名とパスワードを入力してサインインできる
サインアップ画面 ユーザ名とパスワードを入力してサインアップできる
メニュー 利用者がサインインしていない場合は、SIGN INリンクを表示する
利用者がサインイン済みの場合はSIGN OUTリンクを表示する

画面遷移図

ERD

画面仕様

サインイン画面

  1. メニューのSIGN INリンクがクリックされた場合、あるいは、未サインイン状態で商品購入機能にアクセスした場合に表示する
  2. 利用者は以下の項目を入力できる
    • 名前(NAME)
    • パスワード(PASSWORD)
  3. 利用者がSIGN INボタンをクリックすると、システムは入力された名前とパスワードでユーザテーブルを検索する
    • 【ユーザレコードが存在しない場合】
      • サインイン画面を再表示し、サインインエラーメッセージを表示する
    • 【ユーザレコードが存在する場合】
      • セッションにユーザIDを保持する
      • 商品一覧画面へ遷移する
  4. 利用者がSIGN UPリンクをクリックすると、サインアップ画面に遷移する

サインアップ画面

  1. サインイン画面でSIGN UPリンクがクリックされた場合に表示する
  2. 利用者は以下の項目を入力できる
    • 名前(NAME)
    • パスワード(PASSWORD)
    • 確認用パスワード(PASSWORD CONFIRM)
    • メールアドレス(MAIL)
    • 電話番号(TEL)
    • 都道府県(PREFECTURE)
    • 住所(ADDRESS)
  3. 利用者がSIGN UPボタンをクリックすると、システムは以下の処理を行う
    • 入力された名前でユーザテーブルを検索する
      • 【ユーザレコードが存在する場合】
        • サインイン画面を再表示し、サインインエラーメッセージを表示する
        • 処理を終了する
    • 入力されたメールアドレスでユーザテーブルを検索する
      • 【ユーザレコードが存在する場合】
        • サインイン画面を再表示し、サインインエラーメッセージを表示する
        • 処理を終了する
    • ユーザテーブルに新規レコードを作成する
    • サインイン画面へ遷移して、サインアップ完了メッセージを表示する

      利用者はサインイン画面で、新規作成したアカウントでサインインを行う

メニュー画面 ※サインインしていない場合

  • SIGN INリンクを表示する

メニュー画面 ※サインインしている場合

  • 利用者がアカウント名をクリックするとSIGN OUTリンクを表示する
  • 利用者がSIGN OUTリンクをリンクをクリックすると以下の処理を行う
    • 既存のセッションを破棄する
    • 商品一覧画面へ遷移する