본문 바로가기

IT&코딩/JSP

JSP - 10일차 (EL & JSTL)

728x90
반응형

■ EL (Expression Language)

 

EL(Expression Language)은 자바 빈의 프로퍼티(값)을 JSP의 표현식 <%= %>이나 액션 태그 <jsp:useBean>를 사용하는 것보다 쉽고 간결하게 꺼낼 수 있게하는 기술이다. static 메소드를 호출할 수도 있는데 JSP에서는 주로 서블릿 보관소에서 값을 꺼낼 때 사용한다.

 

 

□ EL 내장객체

 

 

■ EL 실습

 

□ 1번

<el01.jsp>

 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	
	<%--
		EL(Expression Language) 은
		정수, 실수, 논리, 문자열, null을 표현할 수 있다.
	--%>
	
	정수 : ${100 }<br>
	실수 : ${3.14 }<br>
	논리 : ${true }<br>
	문자열 : ${"Hello EL" }<br>
	널 : ${null }<br>
	
	<hr>
	
	<%--
		EL에서 사용하는 연산자는
		산술, 관계(비교), 논리, 조건(삼항) 연산자가 있다.
	--%>
	
	<p>산술연산자</p>
	
	${1 + 2 }<br>
	${1 - 2 }<br>
	${1 * 2 }<br>
	${1 / 2 }<br>
	
	<p>비교연산자</p>
	
	${1 < 2 }<br>
	${1 > 2 }<br>
	${1 == 2 }<br>
	${1 != 2 }<br>
	
	<hr>
	
	<p>논리연산자</p>
	
	${(1 < 2) && (3 > 4) }<br>
	${(1 < 2) || (3 > 4) }<br>
	
	<hr>
	
	<p>조건연산자</p>
	
	${(1 > 2) ? "참입니다." : "거짓입니다." }
	
</body>
</html>

□ 2번

 

여기서는 ELMember 클래스를 자바 빈을 통해 사용할 것이다.

<ELMember.java>

package com.jsp.el;

public class ELMember {
	
	private String id;
	private String pw;
	private String name;
	private int age;
	
	public ELMember() {
		
	}
	
	public ELMember(String id, String pw, String name, int age) {
		super();
		this.id = id;
		this.pw = pw;
		this.name = name;
		this.age = age;
	}

	public String getId() {
		return id;
	}

	public void setId(String id) {
		this.id = id;
	}

	public String getPw() {
		return pw;
	}

	public void setPw(String pw) {
		this.pw = pw;
	}

	public String getName() {
		return name;
	}

	public void setName(String name) {
		this.name = name;
	}

	public int getAge() {
		return age;
	}

	public void setAge(int age) {
		this.age = age;
	}
	
}

 

<el02.jsp>

 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	
	<jsp:useBean id="member" class="com.jsp.el.ELMember" scope="page"/>
	
	<jsp:setProperty name="member" property="id" value="hong"/>
	<jsp:setProperty name="member" property="pw" value="1234"/>
	<jsp:setProperty name="member" property="name" value="홍길동"/>
	<jsp:setProperty name="member" property="age" value="20"/>
	
	아이디 : <jsp:getProperty property="id" name="member"/><br>
	비밀번호 : <jsp:getProperty property="pw" name="member"/><br>
	이름 : <jsp:getProperty property="name" name="member"/><br>
	나이 : <jsp:getProperty property="age" name="member"/><br>
	
	<hr>
	
	아이디 : <%=member.getId() %><br>
	비밀번호 : <%=member.getPw() %><br>
	이름 : <%=member.getName() %><br>
	나이 : <%=member.getAge() %><br>
	
	<hr>
	
	아이디 : ${member.id }<br>
	비밀번호 : ${member.pw }<br>
	이름 : ${member.name }<br>
	나이 : ${member.age }<br>
	
	<hr>
	
	아이디 : ${member.getId() }<br>
	비밀번호 : ${member.getPw() }<br>
	이름 : ${member.getName() }<br>
	나이 : ${member.getAge() }<br>
	
</body>
</html>

 

□ 3번

 

<el03.jsp>

 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

	<form action="el03.jsp" method="post">
		아이디 : <input type="text" name="id"><br>
		비밀번호 : <input type="password" name="pw"><br>
		<input type="submit" value="로그인">
	</form>

	<%
		String id = request.getParameter("id");
		String pw = request.getParameter("pw");
	%>
	
	아이디 : <%=id %><br>
	비밀번호 : <%=pw %><br>
	
	<hr>
	
	아이디 : ${param.id }<br> <%-- request.getParameter("id");를 생략할 수 있다. --%>
	비밀번호 : ${param.pw }<br>
	
	<hr>
	
	아이디 : ${param["id"] }<br>
	비밀번호 : ${param["pw"] }<br>
	
</body>
</html>

 

□ 4번

 

<el04.jsp>

 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

	<%-- 
		서블릿 보관소에 저장된 데이터를 사용할 수 있다.
	--%>
	
	<%
		application.setAttribute("name", "홍길동");
		session.setAttribute("id", "sung");
		pageContext.setAttribute("pw", "1234");
		request.setAttribute("age", 20);
	%>
	
	어플리케이션 : ${applicationScope.name }<br>
	세션 : ${sessionScope.id }<br>
	페이지 : ${pageScope.pw }<br>
	리퀘스트 : ${requestScope.age }<br>
	
	어플리케이션 : ${name }<br>
	세션 : ${id }<br>
	페이지 : ${pw }<br>
	리퀘스트 : ${age }<br>
	
</body>
</html>

 

 


 

 

■ JSTL (JSP Standard Tag Library)

 

JSP의 경우 HTML 태그와 같이 사용되어 전체적인 코드의 가독성이 떨어진다. 이러한 단점을 보완하고자 만들어진 태그 라이브러리가 JSTL이다.

JSTL의 경우 우리가 사용하는 톰켓 컨테이너에 포함되어 있지 않으므로, 별도의 설치를 하고 사용한다.

 

□ 장점

 

1. 빠른 개발 (JSP를 단순화하는 많은 태그를 제공

2. 코드 재사용성 (다양한 페이지에서 JSTL 태그 사용 가능)

3. 스크립트릿 태그를 사용하지 않음

 

□ JSTL 라이브러리

 

JSTL은 Core, XML Processing, I18N formatting, SQL, Functions 총 5개의 라이브러리를 제공한다.

 

가장 기본이 되는 Core 라이브러리는 출력, 제어, 반복 같은 기본 기능이 있다.

JSTL Core 라이브러리를 사용하기 위해서는, 코드를 jsp파일에 넣어주어야 한다.

 

<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>

 

 

■ jstl 실습

 

□ 1번

 

<jstl01.jsp>

 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
    
<%--
	자바에서 import문을 선언하듯 jsp에서도 jstl 확장태그를
	사용하려면 taglib 지시자로 라이브러리를 선언해야 한다.
	
	uri = 키값이라고 보면 된다.
--%>
    
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

	<%-- 
		일반적으로 jstl이란 jstl + el의 조합을 말한다.
		html 코드내에 java 코드인 스크립트릿 코드를 대체하여 사용한다.
		스크립트릿을 사용하면 가독성이 떨어지고, 뷰와 비즈니스 분리로 인하여
		jstl을 많이 사용하는 추세이다.
	--%>
	
	<%--
		set : 변수값 선언
		out : 출력
		remove : 변수값 제거
	--%>
	
	<c:set var="name" value="홍길동" scope="page"/>
	
	이름 : <c:out value="${pageScope.name }"/><br>
	
	<c:remove var="name" scope="page"/>
	
	이름 : <c:out value="${pageScope.name }"/><br>
	
	<%-- 
		if : if문 (else문 없음)
		test="조건식"
	--%>
	
	<c:if test="${1 + 2 == 3 }">
		
		1 더하기 2는 3입니다.<br>
		
	</c:if>
	
	<c:if test="${1 + 2 != 3 }">
		
		1 더하기 2는 3이 아닙니다.<br>
		
	</c:if>
	
	<hr>
	
	<c:set var="i" value="30"/>

	<%-- 
		choose 태그는 자바의 switch문과 비슷한 역할을 한다.
		case문과 비슷한 역할을 하는 것은 choose 태그 안의 when 태그이다.
		default문과 비슷한 역할을 하는 것은 choose 태그 안의 otherwise 태그이다.
	--%>
	
	<c:choose>
		
		<c:when test="${i == 10 }">
			i는 10입니다.
		</c:when>
		
		<c:when test="${i == 20 }">
			i는 20입니다.
		</c:when>
		
		<c:otherwise>
			i는 10, 20이 아닙니다.
		</c:otherwise>
		
	</c:choose>
	
</body>
</html>

 

□ 2번

 

<jstl02.jsp>

 

<%@page import="java.util.ArrayList"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>    
    
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	
	<%-- 
		forEach : for문
	--%>
	
	<c:forEach var="i" begin="0" end="30" step="3">
	
		${i}
	
	</c:forEach>
	
	<hr>
	
	<%
		ArrayList<String> list = new ArrayList<>();
		
		list.add("홍길동");
		list.add("성춘향");
		list.add("이몽룡");
		list.add("이순신");
		
		request.setAttribute("names", list);
		// request 영역에 list 객체를 바인딩한다.
	%>
	
	<c:forEach var="name" items="${names }">
		${name }<br>
	</c:forEach>
	
</body>
</html>

 

□ 3번

 

<jstl03.jsp>

 

<%@page import="com.jsp.el.ELMember"%>
<%@page import="java.util.ArrayList"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
 <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
 
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

	<%-- 
		1. 스크립트릿으로 ELMember 타입의 ArrayList를 생성한 후 
		   ELMember 객체를 3개 생성후 ArrayList에 저장하기
		   request 영역에 ArrayList 바인딩하기
		   
		2. EL과 JSTL을 사용해서 웹브라우저에 3명의 멤버 출력하기
	--%>

	<%
		ArrayList<ELMember> list = new ArrayList<>();
	
		ELMember elm1 = new ELMember("hong", "1234", "홍길동", 20);
		ELMember elm2 = new ELMember("sung", "5678", "성춘향", 21);
		ELMember elm3 = new ELMember("lee", "9012", "이몽룡", 22);
		
		list.add(elm1);
		list.add(elm2);
		list.add(elm3);
		
		request.setAttribute("ELMembers", list);
	%>

	<c:forEach var="elm" items="${ELMembers }">
		${elm.id }<br>${elm.pw }<br>${elm.name }<br>${elm.age }<br>
		<hr>
	</c:forEach>
	
	<%-- 
		기본생성자만 있는 경우
	--%>
		
		<%
			ArrayList<ELMember> list2 = new ArrayList<>();
			
			ELMember e1 = new ELMember();
			e1.setId("hong");
			e1.setPw("1234");
			e1.setName("홍길동");
			e1.setAge(20);
			
			ELMember e2 = new ELMember();
			e1.setId("sung");
			e1.setPw("5678");
			e1.setName("성춘향");
			e1.setAge(22);
			
			ELMember e3 = new ELMember();
			e1.setId("lee");
			e1.setPw("9012");
			e1.setName("이몽룡");
			e1.setAge(24);
			
			list2.add(e1);
			list2.add(e2);
			list2.add(e3);
			
			request.setAttribute("member", list);
		%>
		
		<table border="1">
			<tr>
				<th>이름</th>
				<th>나이</th>
				<th>아이디</th>
				<th>비밀번호</th>
			</tr>
			
			<c:forEach var="member" items="${requestScope.member }">
			
				<tr>
					<td>${member.name }</td>
					<td>${member.age }</td>
					<td>${member.id }</td>
					<td>${member.pw }</td>
				</tr>
				
			</c:forEach>
			
		</table>


</body>
</html>

 


 

■ EL과 JSTL을 추가한  JDBC

 

□ Oracle SQL Developer 에서 board 테이블 생성

 

create table board(
    bId number(4) primary key, -- 유일한 값
    bWriter nvarchar2(20) not null, -- 작성자
    bTitle nvarchar2(100) not null, -- 제목
    bContent nvarchar2(500) not null, -- 내용
    bDate timestamp default systimestamp, -- 작성일
    bHit number(4) default 0 -- 조회수
);

commit;

CREATE SEQUENCE board_seq -- 시퀀스 (자동으로 증가하는 순)
START WITH 1 -- 시퀀스 값 1부터
INCREMENT BY 1 -- 1씩 증가
NOMAXVALUE -- 시퀀스의 범위를 무한대로 지정
NOCACHE; -- 캐시값 없애기

commit;

 

 

□ src/main/java 폴더의 com.jsp.board 생성후 DAO, DTO 클래스 생성

 

<BoardDTO.java>

 

package com.jsp.board;

import java.sql.Timestamp;

public class BoardDTO {
	
	private int bId;
	private String bWriter;
	private String bTitle;
	private String bContent;
	private Timestamp bDate;
	private int bHit;
	
	private String simpleDate;
	
	public String getSimpleDate() {
		return simpleDate;
	}

	public void setSimpleDate(String simpleDate) {
		this.simpleDate = simpleDate;
	}

	public BoardDTO() {
		
	}

	public BoardDTO(int bId, String bWriter, String bTitle, String bContent, Timestamp bDate, int bHit) {
		super();
		this.bId = bId;
		this.bWriter = bWriter;
		this.bTitle = bTitle;
		this.bContent = bContent;
		this.bDate = bDate;
		this.bHit = bHit;
	}

	public int getbId() {
		return bId;
	}

	public void setbId(int bId) {
		this.bId = bId;
	}

	public String getbWriter() {
		return bWriter;
	}

	public void setbWriter(String bWriter) {
		this.bWriter = bWriter;
	}

	public String getbTitle() {
		return bTitle;
	}

	public void setbTitle(String bTitle) {
		this.bTitle = bTitle;
	}

	public String getbContent() {
		return bContent;
	}

	public void setbContent(String bContent) {
		this.bContent = bContent;
	}

	public Timestamp getbDate() {
		return bDate;
	}

	public void setbDate(Timestamp bDate) {
		this.bDate = bDate;
	}

	public int getbHit() {
		return bHit;
	}

	public void setbHit(int bHit) {
		this.bHit = bHit;
	}
	
}

 

<BoardDAO.java>

 

package com.jsp.board;

import javax.sql.*;
import java.sql.*;
import java.text.SimpleDateFormat;

import javax.naming.*;
import java.util.*;

public class BoardDAO {
	// 싱글톤 패턴
    // 생성자에서 DataSource 필드 초기화
    // close 메소드 만들기
    
    private DataSource ds;
    private Connection conn;
    private PreparedStatement pstmt;
    private ResultSet rs;
    
    private BoardDAO() {
		try {
			
			Context context = new InitialContext();
			
			ds = (DataSource)context.lookup("java:comp/env/jdbc/oracle");
			
		} catch(Exception e) {
			e.printStackTrace();
		}
	}
    
    private static BoardDAO instance = new BoradDAO();
    
    public static BoardDAO getInstance(){
    	return instance;
    }
    
    private void close(Connection conn) {
		try {
			if(conn != null) {
				conn.close();
			}
		} catch(Exception e) {
			e.printStackTrace();
		}
	}
	
	private void close(PreparedStatement pstmt) {
		try {
			if(pstmt != null) {
				pstmt.close();
			}
		} catch(Exception e) {
			e.printStackTrace();
		}
	}
	
	private void close(ResultSet rs) {
		try {
			if(rs != null) {
				rs.close();
			}
		} catch(Exception e) {
			e.printStackTrace();
		}
	}
    
    // 게시판 글 작성후 데이터를 넣는 메소드
    public int insertBoard(String bWriter, String bTitle, String bContent){
    	
        int result = 0;
        
        String query = "insert into board(bId, bWriter, bTitle, bContent) " 
		+ "values(board_seq.nextval, ?, ?, ?)";
        
        try {			
			conn = ds.getConnection();
			pstmt = conn.prepareStatement(query);
			
			pstmt.setString(1, bWriter);
			pstmt.setString(2, bTitle);
			pstmt.setString(3, bContent);
			
			result = pstmt.executeUpdate();
			
		} catch(Exception e) {
			e.printStackTrace();
		} finally {
			close(pstmt);
			close(conn);
		} 
        
        return result;
    }
    
    // 게시판 목록을 만들기 위해 데이터를 얻는 메소드
	public ArrayList<BoardDTO> boardList(){
		
		ArrayList<BoardDTO> list = new ArrayList<BoardDTO>();

		String query = "select * from board order by bId DESC";
		
		try {
			
			conn = ds.getConnection();
			pstmt = conn.prepareStatement(query);
			rs = pstmt.executeQuery();
			
			while(rs.next()) {
				
				int bId = rs.getInt("bId");
				String bWriter = rs.getString("bWriter");
				String bTitle = rs.getString("bTitle");
				String bContent = rs.getString("bContent");
				Timestamp bDate = rs.getTimestamp("bDate");
				int bHit = rs.getInt("bHit");
				
				SimpleDateFormat format = new SimpleDateFormat("yyyy년 MM월 dd일");
				
				String simpleDate = format.format(bDate);
				
				BoardDTO dto = new BoardDTO(bId, bWriter, bTitle, bContent, bDate, bHit);
				
				dto.setSimpleDate(simpleDate);
				
				list.add(dto);
			}
		} catch(Exception e) {
			e.printStackTrace();
		} finally {
			close(rs);
			close(pstmt);
			close(conn);
		}
		
		return list;
	}
    
    // 제목 클릭시 해당 내용을 보여주기 위해 데이터를 얻는 메소드
    	public BoardDTO contentView(String strID) {
		
		BoardDTO dto = null;
		upHit(strID); // 조회수 올려주는 메소드 호출
		
		String query = "select * from board where bId=?";
		
		
		try {
			
			conn = ds.getConnection();
			pstmt = conn.prepareStatement(query);
			
			pstmt.setInt(1, Integer.parseInt(strID));
			
			rs = pstmt.executeQuery();
			
			while(rs.next()) {
				
				int bId = rs.getInt("bId");
				String bWriter = rs.getString("bWriter");
				String bTitle = rs.getString("bTitle");
				String bContent = rs.getString("bContent");
				Timestamp bDate = rs.getTimestamp("bDate");
				int bHit = rs.getInt("bHit");
				
				dto = new BoardDTO(bId, bWriter, bTitle, bContent, bDate, bHit);
			}
		} catch(Exception e) {
			e.printStackTrace();
		} finally {
			close(rs);
			close(pstmt);
			close(conn);
		}
		
		return dto;
	}
    
    // 조회수를 하나 증가시켜주는 메소드
	public void upHit(String strID) {
		
		String query = "update board set bHit = bHit + 1 where bId = ?";
		
		try {
			
			conn = ds.getConnection();
			pstmt = conn.prepareStatement(query);
			pstmt.setInt(1, Integer.parseInt(strID));
		
			pstmt.executeUpdate();
			
		} catch(Exception e) {
			e.printStackTrace();
		} finally {
			close(pstmt);
			close(conn);
		}
		
	}
    
    // 해당 글을 수정해주는 메소드
	public int modify(BoardDTO dto) {
		
		int result = 0;
		// bWriter bTitle bContent;
		
		String query = "update board set bWriter = ?, bTitle = ?, bContent = ?"
				 + "where bId = ?";
		
		try {
			
			conn = ds.getConnection();
			pstmt = conn.prepareStatement(query);
			
			pstmt.setString(1, dto.getbWriter());
			pstmt.setString(2, dto.getbTitle());
			pstmt.setString(3, dto.getbContent());
			pstmt.setInt(4, dto.getbId());
			
			result = pstmt.executeUpdate();
			
		} catch(Exception e) {
			e.printStackTrace();
		} finally {
			close(pstmt);
			close(conn);
		}
				 
		return result;
	}
    
    // 해당 글을 삭제해주는 메소드
	public int delete(String strID) {
		
		int result = 0;
		
		String query = "delete from board where bId = ?";
		
		try {
			
			conn = ds.getConnection();
			pstmt = conn.prepareStatement(query);
			
			pstmt.setInt(1, Integer.parseInt(strID));
			
			result = pstmt.executeUpdate();
			
		} catch(Exception e) {
			e.printStackTrace();
		} finally {
			close(pstmt);
			close(conn);
		}
	
		return result;
	}
}

 

□ 웹브라우저 

 

<writeForm.jsp - 게시글 작성 폼>

 

 

<writeCheck.jsp>

 

 

<boardList.jsp - 게시판 목록>

 

 

<contentView.jsp>

 

 

<modifyCheck.jsp - 글 수정하기 폼>

 

 

<modifyCheck.jsp>

 

 

<delete.jsp - 게시글 삭제하기>

 

728x90
반응형

'IT&코딩 > JSP' 카테고리의 다른 글

JSP - 12일차 (파일 업로드)  (0) 2022.12.07
JSP - 11일차 (MVC 모델 구현하기)  (0) 2022.12.05
JSP - 9일차 (JDBC2)  (0) 2022.11.30
JSP - 8일차 (JDBC)  (0) 2022.11.28
JSP - 7일차 (데이터베이스)  (0) 2022.11.25