[프로젝트/JAVA] 8일차 - 회원가입 ①

    728x90
    반응형

    2021.07.13

    50번째 포스팅

     

    입사 127일차.

    지금까지는 값을 하나만 받아서 primitive타입을 parameterType에 작성했다.

    하지만 Model(VO)이 parameterType이 되면 여러가지 데이터를 한 번에 INSERT 할 수 있다.

     

    오늘은 여러가지 정보를 받아서 한 번에 저장하는 회원가입을 해보려고 한다.

    Service와 Repository는 기존의 INSERT와 작성법이 같으므로 생략합니다.

     

     

     

    1. 테이블설계

      ① 회원가입을 진행할때 어떤 정보들을 저장할지 구상한다.

      ② 구상한 내용을 토대로 테이블 명세서를 작성한다.

           저는 아이디, 패스워드, 이름, 생년월일, 가입일, 성별 6가지를 입력받겠습니다.

    테이블명 reg_info
    순서 컬럼명 자료형 설명
    1 Idx_pk Int Primary Key
    2 user_id varchar(20) 아이디
    3 user_pw varchar(20) 비밀번호
    4 user_name varchar(10) 이름
    5 user_birth char(10) 생년월일
    6 user_regdate Date 가입일
    7 user_gender char(1) 성별

     

      ③ 간략한 테이블 명세서가 작성되면, 작성된 내용을 토대로 테이블을 생성한다.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    CREATE TABLE reg_info (
        idx_pk int not null auto_increment primary key,
        user_id varchar(20not null,
        user_pw varchar(20not null,
        user_name varchar(10not null,
        user_birth char(10),
        user_regdate date,
        user_gender char(1)
    );
    cs

     

     

    2. Model

      ① desc table명; 을 사용해서 테이블의 구조를 확인한다.

      ② DB의 컬럼에 맞게 field를 만든다.

           field의 변수명은 DB의 컬럼명과 일치시키지 않는 것이 좋다.

      ③ setter, getter를 만들어준다.

     

      ④ Model은 일반적으로 model 패키지를 만든 후, 그 안에 클래스를 만든다.

           UserVO, LoginVO 처럼 사용하고 싶은 이름 뒤에 VO를 붙인다.

      ⑤ fieid는 private을 붙여 다른 Class에서 접근할 수 없도록 한다. (캡슐화)

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    package com.example.ccs.login;
     
    import java.util.Date;
     
    public class RegisterVO {
        
        // 1. field
        private int idx_pk;           // Primary Key
        private String userID;        // 아이디
        private String userPW;        // 비밀번호
        private String userName;     // 이름
        private String userBirth;     // 생년월일
        private Date userRegdate;     // 가입일
        private String userGender;    // 성별
    }
    cs

     

      ⑥ 캡슐화된 Model에 접근하기 위해서는 setter getter가 필요하다.

           캡슐화가 사용되는 이유는 유지보수와 최소한의 보안 크게 2가지로 대표된다.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    package com.example.ccs.login;
     
    import java.util.Date;
     
    public class RegisterVO {
        
        // 1. field
        private int idx_pk;            // Primary Key
        private String userID;        // 아이디
        private String userPW;        // 비밀번호
        private String userName;    // 이름
        private String userBirth;    // 생년월일
        private Date userRegdate;    // 가입일
        private String userGender;    // 성별
        
        // 2. setter, getter
        public int getIdx_pk() {
            return idx_pk;
        }
        public void setIdx_pk(int idx_pk) {
            this.idx_pk = idx_pk;
        }
        public String getUserID() {
            return userID;
        }
        public void setUserID(String userID) {
            this.userID = userID;
        }
        public String getUserPW() {
            return userPW;
        }
        public void setUserPW(String userPW) {
            this.userPW = userPW;
        }
        public String getUserName() {
            return userName;
        }
        public void setUserName(String userName) {
            this.userName = userName;
        }
        public String getUserBirth() {
            return userBirth;
        }
        public void setUserBirth(String userBirth) {
            this.userBirth = userBirth;
        }
        public Date getUserRegdate() {
            return userRegdate;
        }
        public void setUserRegdate(Date userRegdate) {
            this.userRegdate = userRegdate;
        }
        public String getUserGender() {
            return userGender;
        }
        public void setUserGender(String userGender) {
            this.userGender = userGender;
        }
    }
    cs

     

     

    3. View

      ① <input>태그를 작성할 때, <input>태그의 name속성과 Model의 field명이 일치해야 한다. 

      ② Ajax를 사용할때도 방법은 똑같다.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    <!DOCTYPE html>
    <html xmlns:th="http://www.thymeleaf.org">
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>회원가입</title>
    </head>
    <body>
        <form action="/register.do" method="POST", id="registerFrm">
            <input type="text" name="userID"/>
            <input type="text" name="userPW"/>
            <input type="text" name="userName"/>
            
            <!-- type="date"는 yyyy-mm-dd 포맷으로 데이터가 저장됩니다. -->
            <input type="date" name="userBirth"/> 
            
            <!-- type="radio"는 여러가지 보기 중 하나를 선택할 수 있는 버튼입니다. -->
            <!-- name이 같으면 하나만 선택할 수 있도록 설정됩니다. -->
            <input type="radio" name="userGender" data-th-value="남"/>
            <input type="radio" name="userGender" data-th-value="녀"/>
            
            <button type="submit">정보입력</button>
        </form>
    </body>
    <script>
    </script>
    </html>
    cs

     

     

    다음포스팅의 주제

    회원가입 - Controller, Mapper.xml

    728x90
    반응형

    댓글