[ITWILL : JSP]홈페이지만들기3 : 로그인/로그아웃 기능 구현

ITWILL학원 : 34강 JSP기초 BY 정규태강사

1. loginForm.jsp 생성

  • header include하기 : jsp:include page="../inc/top.jsp"
  • footer include하기 : jsp:include page="../inc/bottom.jsp"
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
<body>
<div id="wrap">
<!-- 헤더들어가는 곳 -->
<jsp:include page="../inc/top.jsp"></jsp:include>
<!-- 헤더들어가는 곳 -->

<!-- 본문들어가는 곳 -->
<!-- 본문메인이미지 -->
<div id="sub_img_member"></div>
<!-- 본문메인이미지 -->
<!-- 왼쪽메뉴 -->
<nav id="sub_menu">
<ul>
<li><a href="#">Join us</a></li>
<li><a href="#">Privacy policy</a></li>
</ul>
</nav>
<!-- 왼쪽메뉴 -->
<!-- 본문내용 -->
<article>
<h1>로그인</h1>
<form action="loginPro.jsp" id="join" method="post">
<fieldset>
<legend>로그인정보</legend>
<label>아이디</label> <input type="text" name="id"><br>
<label>비밀번호</label> <input type="password" name="pw"><br>
</fieldset>
<div class="clear"></div>
<div id="buttons">
<input type="submit" value="Submit" class="submit">
<input type="reset" value="Cancel" class="cancel">
</div>
</form>
</article>
<!-- 본문내용 -->
<!-- 본문들어가는 곳 -->

<div class="clear"></div>
<!-- 푸터들어가는 곳 -->
<jsp:include page="../inc/bottom.jsp"></jsp:include>
<!-- 푸터들어가는 곳 -->
</div>
</body>

2. loginPro.jsp생성

  • int데이터타입으로 변수받아서 데이터처리.
  • 아이디와 비밀번호가 DB와 일치시 main.jsp페이지로 이동.
  • 아이디와 비밀번호가 DB와 불일치시 뒤로가기.
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
<% //1. 한글처리 및 변수가져오기
request.setCharacterEncoding("UTF-8");
String id = request.getParameter("id");
String pw = request.getParameter("pw");

//2. MemberDAO객체생성 -> idcheck(id, pw) 메서드생성
MemberDAO mdao = new MemberDAO();
int result = mdao.idCheck(id, pw);

//3.데이터처리
if(result == 1){
//아이값을 세션객체에 저장
session.setAttribute("id", id); //두번째파라미터에서 업캐스팅발생 object->String
System.out.println("아디일치비번일치->로그인성공");
response.sendRedirect("../main/main.jsp");
}else if(result == 0){
System.out.println("아디일치,비번불일치->로그인실패");
%>
<script type="text/javascript">
alert("비밀번호가 일치하지 않습니다");
history.back();
</script>
<%
}else{
System.out.println("아디불일치,비번불일치->로그인실패");
%>
<script type="text/javascript">
alert("존재하지않는 아이디입니다");
history.back();
</script>
<%
}
%>

3. memberDAO.java에 idCheck()메서드 생성

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
public int idCheck(String id, String pw){
int result = -1;

try {
//1.DB여결
con = getCon();
//2.SQL & PSTMT
sql = "select pw from fun_member where id=?";
pstmt = con.prepareStatement(sql);
pstmt.setString(1, id);
//3.실행 -> rs -> 데이터처리
rs = pstmt.executeQuery();
if(rs.next()){
if(pw.equals(rs.getString("pw"))){
result = 1;
}else{
result = 0;
}
}
} catch (Exception e) {
e.printStackTrace();
} finally { //4.자원해제
closeDB();
}
return result;
}//idCheck메서드 닫음

4. top.jsp 추가

  • 로그인한 경우 id님 환영합니다와 함께 로그인 버튼을 로그아웃으로 변경
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
<% //화면상단에 위치하는 메뉴바 처리페이지
String id = (String)session.getAttribute("id"); //다운캐스팅 Object -> String
%>
<header>
<div id="login">
<%if(id == null){
%>
<div id="login"><a href="../member/loginForm.jsp">로그인</a> | <a href="../member/joinForm.jsp">회원가입</a></div>
<%
}else if(id != null){
%>
<div id="login"><%=id %>님 환영합니다 | <a href="../member/logout.jsp">로그아웃</a></div>
<%
}
%>
</div>
<div class="clear"></div>
<!-- 로고들어가는 곳 -->
<div id="logo"><img src="../images/logo.gif" width="265" height="62" alt="Fun Web"></div>
<!-- 로고들어가는 곳 -->
<nav id="top_menu">
<ul>
<li><a href="../index.jsp">홈</a></li>
<li><a href="../company/welcome.html">회사소개</a></li>
<li><a href="#">솔루션</a></li>
<li><a href="../center/notice.jsp">고객센터</a></li>
<li><a href="#">무엇이든 물어보세요</a></li>
</ul>
</nav>
</header>

5. logout.jsp 생성

1
2
3
4
5
6
7
8
<%
session.invalidate();
System.out.println("로그아웃성공");
%>
<script type="text/javascript">
alert("정상적으로 로그아웃 되었습니다");
location.href="../main/main.jsp";
</script>

[ITWILL : JSP]홈페이지만들기2 : 아이디중복체크 포함한 회원가입기능 구현

ITWILL학원 : 34강 JSP기초 BY 정규태강사

1. 회원가입기능 구현

1-1. joinForm.jsp 추가작성

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
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
<body>
<div id="wrap">
<!-- 헤더들어가는 곳 -->
<jsp:include page="../inc/top.jsp"></jsp:include>
<!-- 헤더들어가는 곳 -->

<!-- 본문들어가는 곳 -->
<!-- 본문메인이미지 -->
<div id="sub_img_member"></div>
<!-- 본문메인이미지 -->

<!-- 왼쪽메뉴 -->
<nav id="sub_menu">
<ul>
<li><a href="#">회원가입</a></li>
<li><a href="#">개인정보취급방침</a></li>
</ul>
</nav>
<!-- 왼쪽메뉴 -->

<!-- 본문내용 -->
<article>
<h1>Join Us</h1>
<form action="joinPro.jsp" method="post" id="join" name="fr" onsubmit="return check();">
<!-- 필수입력사항 -->
<fieldset>
<legend>필수입력사항</legend>
<label>아이디</label>
<input type="text" name="id" class="id">
<input type="button" value="중복확인" class="dup" onclick="winopen()"><br>
<label>비밀번호</label>
<input type="password" name="pw" placeholder="영문숫자조합 4자리이상" required><br>
<label>비밀번호확인</label>
<input type="password" name="pass2" required><br>
<label>이름</label>
<input type="text" name="name" required><br>
<label>이메일</label>
<input type="email" name="email" placeholder="예시 : funweb@funweb.com (@포함기입)" required><br>
<label>생년월일</label>
<input type="text" name="birth" placeholder="예시 : 801231 (6자리)" maxlength="6" required><br>
<label>성별</label>
<input type="radio" name="gender" value="f">여
<input type="radio" name="gender" value="m">남<br>
</fieldset>

<!-- 선택입력사항 -->
<fieldset>
<legend>선택입력사항</legend>
<label>주소</label>
<!-- <input type="text" name="address"><br> -->

<input type="text" id="sample4_postcode" placeholder="우편번호">
<input type="button" onclick="daumPostcode()" value="우편번호 찾기"><br>
<label>도로명주소(자동입력)</label>
<input type="text" name="addr" id="sample4_roadAddress" placeholder="우편번호찾기를 이용해주세요" readonly><br>
<input type="hidden" id="sample4_jibunAddress" placeholder="지번주소">
<span id="guide" style="color:#999;display:none"></span>
<input type="hidden" id="sample4_extraAddress" placeholder="참고항목">

<label>휴대폰번호</label>
<input type="text" name="mobile" placeholder="예시 : 010-1234-5678" maxlength="13"><br>
</fieldset>

<div class="clear"></div>
<div id="buttons">
<input type="submit" value="회원가입" class="submit">
<input type="reset" value="초기화" class="cancel">
</div>
</form>
</article>
<!-- 본문내용 -->
<!-- 본문들어가는 곳 -->

<div class="clear"></div>

<!-- 푸터들어가는 곳 -->
<jsp:include page="../inc/bottom.jsp"></jsp:include>
<!-- 푸터들어가는 곳 -->
</div>


<script src="https://t1.daumcdn.net/mapjsapi/bundle/postcode/prod/postcode.v2.js"></script>

<!-- 유효성체크 : 데이터 빈공백체크(id와 성별) -->
<script type="text/javascript">
function check(){
//아이디가 입력이 안되어있을 경우 아이디입력하라는 메세지 출력
if(document.fr.id.value == "" || document.fr.id.value.length < 0){
alert("아이디를 입력해주세요")
history.back()
document.fr.id.focus();
return false;
}

if(document.fr.gender[0].checked == false && document.fr.gender[1].checked == false){
alert("성별을 확인해주세요")
history.back()
document.fr.id.focus();
return false;
}
}

<!-- 아이디중복체크 -->
function winopen(){
//새창을 열어서 페이지를 오픈 후 -> 회원아이디정보를 가지고 중복체크
//아래 2-1에 구현
}

//도로명주소 카카오API사용
function daumPostcode() {
new daum.Postcode({
(생략)
}).open();
}

</script>
</body>

1-2. joinPro.jsp 추가작성

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<%
//1. 한글처리
request.setCharacterEncoding("UTF-8");

%>
<!-- 2. 전달되는 데이터 입력(저장) => 자바빈 객채, 액션태그사용-->
<jsp:useBean id="mb" class="com.itwillbs.member.MemberBean" />
<jsp:setProperty property="*" name="mb"/>
<%
//3. 현재 날짜정보저장(또는 DAO에서 sql구문 작성시 now()를 이용해서 현재시각을 DB에 바로 담을 수 있다.)
mb.setRe_date(new Date(System.currentTimeMillis()));

//4. MemberDAO객체생성 -> 전달받은 정보 모두 저장
MemberDAO mdao = new MemberDAO();

//5. 회원 가입 메서드 (insertMember())
mdao.insertMember(mb);
%>

//6. 회원가입 완료시 로그인페이지로 이동
<script type="text/javascript">
alert("회원가입성공")
location.href="loginForm.jsp";
</script>

1-3. MemberDAO에 insertMember()메서드생성

  • 매개변수 6개 이상이면 성능이 급격하게 떨어진다는 연구결과가 있음
  • 매개변수가 6개이상일때는 javabean을 이용하여 받아오는 것이 성능에 좋다
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
//회원가입메서드
private void insertMember(MemberBean mb){
try {
con = getCon();
sql = "insert into fun_member values (?,?,?,?,?, "
+"?,?,?,?)";
pstmt = con.prepareStatement(sql);
pstmt.setString(1, mb.getId());
pstmt.setString(2, mb.getPw());
pstmt.setString(3, mb.getName());
pstmt.setString(4, mb.getEmail());
pstmt.setInt(5, mb.getBirth());
pstmt.setString(6, mb.getGender());
pstmt.setString(7, mb.getAddr());
pstmt.setString(8, mb.getMobile());
pstmt.setDate(9, mb.getRe_date());

pstmt.executeUpdate();
System.out.println("회원가입성공");
} catch (NamingException e) {
e.printStackTrace();
} catch (SQLException e) {
e.printStackTrace();
} catch (Exception e) {
System.out.println("회원가입성공");
e.printStackTrace();
} finally {
closeDB();
}
}//insertMember메서드닫음

2. 아이디중복체크 구현

2-1. joinForm.jsp 추가작성

  • input태그에 onclick=”winopen()”을 설정해준 뒤 아래 winopen()함수를 생성한다.

  • 요즘은 버튼을 클릭하는 대신 제이쿼리의 ajax라이브러리를 사용하여 keydown이나 keyup function을 이용한 비동기처리방식을 사용한다

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

<!-- 필수입력사항 -->
<fieldset>
<legend>필수입력사항</legend>
<label>아이디</label>
<input type="text" name="id" class="id">
<input type="button" value="중복확인" class="dup" onclick="winopen()"><br>
<label>비밀번호</label>
<input type="password" name="pw" placeholder="영문숫자조합 4자리이상" required><br>
<label>비밀번호확인</label>
<input type="password" name="pass2" required><br>
<label>이름</label>
<input type="text" name="name" required><br>
<label>이메일</label>
<input type="email" name="email" placeholder="예시 : funweb@funweb.com (@포함기입)" required><br>
<label>생년월일</label>
<input type="text" name="birth" placeholder="예시 : 801231 (6자리)" maxlength="6" required><br>
<label>성별</label>
<input type="radio" name="gender" value="f">
<input type="radio" name="gender" value="m"><br>
</fieldset>


<!-- 아이디중복체크 -->
function winopen(){
//새창을 열어서 페이지를 오픈 후 -> 회원아이디정보를 가지고 중복체크
//1. 아이디가 없으면 알림창과 진행x
if(document.fr.id.value =="" || document.fr.id.value.length < 0){
alert("아이디를 먼저 입력해주세요")
document.fr.id.focus();
}else{
//2. 회원정보아이디를 가지고 있는 지 체크하려면 DB에 접근해야한다.
//자바스크립트로 어떻게 DB에 접근할까? => 파라미터로 id값을 가져가서 jsp페이지에서 진행하면 된다.
window.open("joinIdCheck.jsp?userid="+document.fr.id.value,"","width=500, height=300");
}
}

2-2. joinIdCheck.jsp생성

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
60
61
62
63
64
<%@page import="com.itwillbs.dao.MemberDAO"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<h2>아이디중복체크</h2>
<%//1. 한글처리 & 받아온 파라미터 변수화
request.setCharacterEncoding("UTF-8");
String id = request.getParameter("userid");

//2. MemberDAO객체생성 -> 전달받은 정보 모두 저장
MemberDAO mdao = new MemberDAO();

//3. joinIdCheck(ID)메서드
int result = mdao.joinIdCheck(id);
if (result == 1){
out.print("사용가능한 아이디입니다");
//5. 아이디사용하기버튼추가 => 동기방식사용 but 요즘은 비동기방식을 더 많이사용한다
%>
<input type="button" value="아이디 사용하기" onclick="result();">
<%

}else if(result == 0){
out.print("중복된 아이디입니다");
}else{
out.print("에러 발생!!!(-1)");
}

%>
<!-- 4.팝업창구현 -->
<fieldset>
<!-- <form action="" method="post">
action속성에 값이 없으면 기본적으로 자기자신을 불러오지만 중복확인 버튼을 클릭했을때 변경되지않는다.-->
<form action="joinIdCheck.jsp" method="post" name="wfr">
ID : <input type="text" name="userid" value="<%=id%>">
<input type="submit" value="중복 확인">
</form>
</fieldset>

<!-- 6. 선택된아이디는 중복확인창에서 회원가입 페이지로 정보전달 -->
<script type="text/javascript">
function result(){
//팝업창의 아이디정보를 회원가입창에 아이디정보로 전달
//팝업창은 기존창과 종속관계를 가지고 있으므로 opener를 이용하면 된다.
//alert("팝업창의 id값"+document.wfr.userid.value + ", 회원가입창의 id값 : " +opener.document.fr.id.value)
//6-1. 회원가입페이지의 id값에 아이디중복으로 선택된 id값을 대입.
opener.document.fr.id.value = document.wfr.userid.value;

//6-3. 회원가입창 제어
//readonly 속성제어(커멜표기가 아닐때는 제어가 안됨 신기하네 ㅋㅋㅋ)
opener.document.fr.id.readOnly=true;

//6-2. 창닫기
window.close();
}

</script>

</body>

2-3. MemberDAO.java에 joinIdCheck()메서드 구현

rs데이터 처리

  • 1 - 사용 가능한 아이디
  • 0 - 사용 불가능한 아이디
  • -1 -> 에러 발생
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
//아이디중복체크 메서드
public int joinIdCheck(String id){
int result = -1;
try {
//1. DB연결
con = getCon();
//2. sql 구문 & pstmt생성
sql = "select id from fun_member where id=?";
pstmt = con.prepareStatement(sql);
pstmt.setString(1, id);

//3. 실행 -> select -> rs저장
rs = pstmt.executeQuery();

//4. 데이터처리

if(rs.next()){
result = 0;
}else{
result = 1;
}

System.out.println("아이디 중복체크결과 : "+result);
} catch (Exception e) {
// TODO Auto-generated catch block
e.printStackTrace();
} finally {
closeDB();
}
return result;
}//joinIdCheck 메서드닫음

[ITWILL : JAVA]람다식개념, 인터페이스 Comparator

ITWILL학원 : 21강 JAVA BY 윤미영강사

1. 람다식

  • 자바 8에서 추가된 가장 큰 특징으로 함수형 프로그래밍 형태를 받아들인 결과
  • 메서드 vs 함수
    • 객체지향 프로그래밍개념에서 : 메서드와 함수는 동일하다
    • 함수형 프로그래밍개념에서 : 메서드(특정객체가 수행하는 기능) vs 함수(특정 객체에 속하지않는 기능)
  • 람다식을 쓰는 이유 : 코드가 간결해짐.
  • 람다식 사용가능한 곳 :
    • 함수형 인터페이스 중 익명클래스를 사용한 부분만 람다식으로 대체해서 사용가능.
    • 함수형 인터페이스가 뭘까?
    • 함수형 인터페이스 : 인터페이스 중에서 한 개의 abstract메서드를 가진 인터페이스
  • 사용법 :
1
2
3
4
5
6
7
8
9
10
11
12
13
//기본 람다식
(파라미터타입) -> {실행문;}

//예시 : 매개변수없음 + 리턴없는 경우
() -> System.out.println("Hi");

//예시 : 매개변수있음 + 리턴없는 경우
(msg) -> System.out.println(msg);

//예시 : 매개변수있음 + 리턴있는 경우
(msg) -> { System.out.println(msg);
return msg;
}
  • 이클립스 단축키 : new연산자의 대괄호{} 전체 선택 후 ctrl + 1 -> convert to lambda expression 를 선택하면 자동으로 람다식을 생성해준다.

2. 인터페이스 Comparator

  • 객체정렬방식 2가지

    • Comparable 인터페이스 : 정렬 대상 클래스를 자바에서 기본적으로 제공하고 있는 Comparable 인터페이스를 구현하도록 변경
    • 만약 이미 존재하고 있는 정렬 기준과 다른 정렬 기준으로 정렬을 하고 싶을 때는 어떻게 해야할까?
    • Comparator 인터페이스 : 정렬 기준을 누락된 클래스의 객체나 기존 정렬 기준을 무시하고 새로운 정렬 기준으로 객체를 정렬가능.
  • 데이터타입별 비교방법

    • int 데이터타입은 부등호로 서로 비교가능
    • String은 부등호로 비교가 안됨 => compareTo()메서드사용해서 비교해야함
  • int compare(T o1, T o2) : Compares its two arguments for order. Returns a negative integer, zero, or a positive integer as the first argument is less than, equal to, or greater than the second.

    • 리턴값이 -1이면 위치가 앞으로 , 0이면 가만히, 1이면 뒤로
    • o1 > o2 : negative integer
    • o1 = o2 : zero
    • o1 < o2 : positive integer
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
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83

public class Person {
//1. 멤버변수생성
String name;
int age;

//3. 생성자만들기
public Person(int age, String name) {
this.age = age;
this.name = name;
}

//2. getter와 setter만들기
public String getName() {
return name;
}

(생략)

//5. toString생성
@Override
public String toString() {
return "Person [name=" + name + ", age=" + age + "]";
}

public static void main(String[] args) {

//4. 배열만들기
Person[] people = new Person[3];
people[0] = new Person(22, "홍");
people[1] = new Person(20, "길");
people[2] = new Person(24, "동");

//4-1. 배열출력하기 - toString사용
System.out.println("배열의 인덱스출력 : "+people[0]);
System.out.println("toString이용 배열출력(입력순) : "+Arrays.toString(people));

//6. sort하기 :
//Arrays.sort(people); //에러발생
//왜 에러날까? sort하기위해서는 정렬의 기준이 필요하다. 멤버변수 두개중에 어떤걸 기준잡을지 말해야한다 = Comparator
//7-2. comparator이용해서 나이순으로 sort하기
Arrays.sort(people, new Comp());
System.out.println("sort+외부클래스사용 배열출력(나이오름차순) : "+Arrays.toString(people));
//7-3. 익명클래스를 사용해서 나이순으로 sort하기
Arrays.sort(people, new Comparator<Person>() {
@Override
public int compare(Person o1, Person o2) {
if(o1.age > o2.age) return -1;
else return 1;
}
});
System.out.println("sort+내부클래스사용+age(나이내림차순) 배열출력 : "+Arrays.toString(people));

//7-4. 이름순으로 정렬하기
//String은 부등호로 비교가 안됨 => compareTo()메서드사용해서 비교해야함
Arrays.sort(people, new Comparator<Person>() {
@Override
public int compare(Person o1, Person o2) {
if(o1.name.compareTo(o2.name) > 0) return 1; //가나다순
else return -1;
}
});

System.out.println("sort+내부클래스사용+name 배열출력(가나다순) : "+Arrays.toString(people));

}//main매서드닫음


}//Person클래스닫음


//7. comparaor생성(내부클래스말고 독립적인 클래스로 생성)
class Comp implements Comparator<Person>{
//7-1. 추상메서드 오버라이딩
@Override
public int compare(Person arg0, Person arg1) {
if(arg0.age < arg1.age){
return -1; //오름차순(arg0보다 arg1이 더 큰 경우)
}else{
return 1;
}
}
}//Comp클래스닫음
  • Comparator 객체는 메서드가 하나 뿐인 함수형 인터페이스를 구현하기 때문에 람다 함수로 대체가 가능.
  • 기존에 있던 new Comparator<Person>() { @Override public int compare를 화살표로 대체해주면 람다식완성.
  • 데이터 타입도 지울 수 있다 : (Person o1, Person o2) -> (o1, o2)로 가능.
1
2
3
4
5
6
7
//7-4. 이름순으로 정렬하기(람다식 사용)
Arrays.sort(people, (o1, o2) ->
if(o1.name.compareTo(o2.name) > 0) return 1; //가나다순
else return -1;
}
);
System.out.println(Arrays.toString(people));

참고링크 : Comparable과 Comparator
참고링크 : 객체 정렬하기 1부 - Comparable vs Comparator

[ITWILL : JSP]홈페이지만들기1 : 프로젝트 시작 설정 및 자바빈생성과 DB연결

ITWILL학원 : 33강 JSP기초 BY 정규태강사

html로 만들어진 홈페이지를 jsp로 변경해보자.

1. main.jsp 생성

  • path설정

    • / 와 ./는 현재폴더
    • ../는 상위폴더
  • 페이지 인클루드 2가지방법

    1
    2
    3
    4
    5
    6
    7
    8
    <!-- JSP 지시어 : 공통으로 사용되는 변수를 파일에 지정해서 추가 -->
    <%@ include ~ %>

    <!-- 액션태그 : 공통으로 사용되는 메뉴들을(페이지) 특정 공간에 추가 -->
    <jsp:include page="">

    <!-- 예시 -->
    <jsp:include page="../inc/top.jsp"></jsp:include>
  • 코드블록 :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<body>
<div id="wrap">

<!-- 헤더파일들어가는 곳 (page Include)-->
<jsp:include page="../inc/top.jsp"></jsp:include>
<!-- 헤더파일들어가는 곳 (page Include)-->

<!-- 메인이미지 들어가는곳 -->
<!-- 메인이미지 들어가는곳 -->

<!-- 메인 콘텐츠 들어가는 곳 -->
<!-- 메인 콘텐츠 들어가는 곳 -->

<!-- 푸터 들어가는 곳 -->
<jsp:include page="../inc/bottom.jsp"></jsp:include>
<!-- 푸터 들어가는 곳 -->

</div>
</body>

2. index.jsp생성

1
2
3
4
<%//프로젝트의 시작페이지 구현

response.sendRedirect("./main/main.jsp");
%>

3. top.jsp 생성

화면상단에 위치하는 메뉴바 처리페이지

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<!-- html코드가 필요없다  (html body태그안에 넣어도 되고 html태그 없어도 됨)-->

<% //화면상단에 위치하는 메뉴바 처리페이지

%>
<header>
<div id="login"><a href="../member/loginForm.jsp">login</a> | <a href="../member/joinFrom.jsp">join</a></div>
<div class="clear"></div>
<!-- 로고들어가는 곳 -->
<div id="logo"><img src="../images/logo.gif" width="265" height="62"></div>
<!-- 로고들어가는 곳 -->
<nav id="top_menu">
<ul>
<li><a href="../index.jsp">HOME</a></li>
<li><a href="../company/welcome.html">COMPANY</a></li>
<li><a href="#">SOLUTIONS</a></li>
<li><a href="../center/notice.html">CUSTOMER CENTER</a></li>
<li><a href="#">CONTACT US</a></li>
</ul>
</nav>
</header>

4. bottom.jsp 생성

화면하단에 위치하는 footer 처리페이지

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<!-- html코드가 필요없다  (html body태그안에 넣어도 되고 html태그 없어도 됨)-->

<% //화면하단에 위치하는 footer 처리페이지

%>
<footer>
<hr>
<div id="copy">All contents Copyright 2011 FunWeb 2011 FunWeb
Inc. all rights reserved<br>
Contact mail:funweb@funwebbiz.com Tel +82 64 123 4315
Fax +82 64 123 4321</div>
<div id="social">
<img src="../images/Instagram.gif" width="33" height="33" alt="Instagram">
<img src="../images/twitter.gif" width="34" height="34" alt="Twitter">
</div>
</footer>

5. joinForm.jsp 생성

원하는 회원가입 폼양식 생성하면 된다.
코드블록은 생략하도록 한다.

6. joinPro.jsp 생성

자바빈을 작성하려면 테이블이 생성되어있어야한다.
joinPro.jsp의 남은 코드는 순서대로 아래에 추가해서 작성할 예정이다.

1
2
3
4
5
<%
// 한글처리
request.setCharacterEncoding("UTF-8");
// 전달되는 데이터 입력(저장) => 자바빈 이용
%>

7. MySQL에서 테이블생성

  • 자바빈을 작성하려면 테이블이 생성되어있어야한다.

  • 회원테이블 정보 : 제약조건

    • 아이디(id) : pk
    • 비밀번호(pw) : nn
    • 이름(name) : nn
    • 이메일(email) : nn, uq
    • 생년월일(birth) : nn
    • 성별(gender) : nn
    • 주소(addr)
    • 휴대폰번호(mobile)
    • re_date : 가입일자
    • 전화번호 : 보통 실무에서 varchar를 이용하는 것이 편하다
    • 생년월일 : int나 varchar를 쓰는데, 실무에선 varchar로 받아서 바로 이용하는 것이 편하다

8. MemberBean.java생성

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

package com.itwillbs.member;

import java.sql.Date;

//1번규약 :public 클래스
public class MemberBean {
//자바빈은 항상 패키지를 포함해야한다.
//데이터를 저장하는 객체(한번에 회원정보를 저장가능한 객체) => DB에 데이터전달

//2번 규약: private멤버변수
private String id;
private String pw;
private String name;
private String email;
private int birth;
private String gender;
private String addr;
private String mobile;
private Date re_date;

//4번규약 : 디폴트생성자

//3번규약 : getter, setter
public String getId() {
return id;
}
public void setId(String id) {
this.id = id;
}

(중략)

//5번 선택: toString
/* (non-Javadoc)
* @see java.lang.Object#toString()
*/
@Override
public String toString() {
return "MemberBean [id=" + id + ", pw=" + pw + ", name=" + name + ", email=" + email + ", birth=" + birth
+ ", gender=" + gender + ", addr=" + addr + ", mobile=" + mobile + ", re_date=" + re_date + "]";
}
}

9. MemberDAO.java 생성

DB연결과 자원해제 메서드를 생성한다

  • 자원해제는 사용한 객체 역순으로 진행하는 것이 안전하게 자원해제할 수 있다
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
import javax.sql.DataSource;

public class MemberDAO {

Connection con = null;
String sql = "";
PreparedStatement pstmt = null;
ResultSet rs = null;

//디비연결메서드
/*private void getCon() throws NamingException, SQLException {
//Context 객체 생성
//Context인터페이스이기때문에 직접객체생성할 수 없어서 InitialContext클래스를 사용해서 객채생성
//예외처리 : throws사용하는 방법
Context init = new InitialContext(); //업캐스팅
//디비연결정보를 불러오기 ->DataSource 타입으로 저장
// 고정문구"java:comp/env/다른문구context파일의 name값입력"
DataSource ds = (DataSource) init.lookup("java:comp/env/jdbc/mysqlDB");
//ds 사용해서 연결
//멤버변수는 static이 아니기때문에 new BoardDAO();객체생성 후에 멤버변수들이 생성된다.
//그리고 getCon()메서드를 하면 멤버변수 con에 데이터(ds.getConnection();)가 담기게 된다.
//따라서 이때 return하지 않고 써도된다.
con = ds.getConnection();
System.out.println("디비연결성공 :"+con);
}
*/
private Connection getCon() throws Exception {
Context init = new InitialContext();
DataSource ds = (DataSource) init.lookup("java:comp/env/jdbc/funwebDB");

return con;
}

//자원해제메서드
public void close(){
try{
if(rs != null) rs.close();
if(pstmt != null) pstmt.close();
if(con != null) con.close();
} catch (SQLException e) {
e.printStackTrace();
}
}
}

10. context.xml 생성

주요 체크사항
- name : 사용할 이름으로 작성
- url : 테이블이 있는 DB경로
- username과 password

1
2
3
4
5
6
7
8
9
10
11
12
13
<?xml version="1.0" encoding="UTF-8"?>
<!-- 디비연결에 필요한 정보 저장 -->
<Context>
<Resource
name="jdbc/fubwebDB"
auth="Container"
type="javax.sql.DataSource"
driverClassName="com.mysql.jdbc.Driver"
url="jdbc:mysql://localhost:3306/funwebdb"
username="root"
password="1234"
/>
</Context>
SQL의 OBJECT종류 : 인덱스(Index), 시노님(Synonym)