뉴렉처 학습(서블릿/JSP) 40강

2020. 5. 23. 07:02

#40강 JSP 시작하기 (Jasper를 이용한 서블릿 프로그래밍)

- 기존에 복잡한 계산식 등을 이용하기 위해선 서블릿에서 out.write를 통해 html 문서에서 만든 내용을 하나하나 작업하였는데, 이는 어려운 건 아니지만 손이 많이 가는 작업이었다.

- JSP를 이용하기 위해선 html파일을 만든 후 확장자만 .jsp로 진행하면 된다. (기존에 계산기 구현을 위해 작업했던 calc3.html 문서를 복사하여 calculator.jsp로 변경하면 된다.)

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style>
input {
	width: 50px;
	height: 50px;
}

.output {
	height: 50px;
	background: #e9e9e9;
	font-size: 24px;
	font-weight: bold;
	text-align: right;
	padding: 0px, 5px;
}
</style>
</head>
<body>
	<form action="calc3" method="post">
		<table>
			<tr>
				<td class="output" colspan="4">${3+4}</td>
			</tr>
			<tr>
				<td><input type="submit" name="operator" value="CE" /></td>
				<td><input type="submit" name="operator" value="C" /></td>
				<td><input type="submit" name="operator" value="BS" /></td>
				<td><input type="submit" name="operator" value="/" /></td>
			</tr>
			<tr>
				<td><input type="submit" name="value" value="7" /></td>
				<td><input type="submit" name="value" value="8" /></td>
				<td><input type="submit" name="value" value="9" /></td>
				<td><input type="submit" name="operator" value="*" /></td>
			</tr>
			<tr>
				<td><input type="submit" name="value" value="4" /></td>
				<td><input type="submit" name="value" value="5" /></td>
				<td><input type="submit" name="value" value="6" /></td>
				<td><input type="submit" name="operator" value="-" /></td>
			</tr>
			<tr>
				<td><input type="submit" name="value" value="1" /></td>
				<td><input type="submit" name="value" value="2" /></td>
				<td><input type="submit" name="value" value="3" /></td>
				<td><input type="submit" name="operator" value="+" /></td>
			</tr>
			<tr>
				<td></td>
				<td><input type="submit" name="value" value="0" /></td>
				<td><input type="submit" name="dot" value="." /></td>
				<td><input type="submit" name="operator" value="=" /></td>
			</tr>
		</table>
	</form>
</body>
</html>

- 톰캣을 이용하여 구동 시 홈 디렉터리는 우리가 알고 있는 위치(Project Explorer로 보이는 경로)가 아니다.

- 워크스페이스로 설정된 폴더 내 metadata > plugins > wst.server.core > tmp(임시 디렉터리 / 배포 디렉터리)가 있는데, 해당 디렉터리는 톰캣이 가지고있는 디렉터리와 거의 흡사하다.

- tmp 폴더 내 work는 jsp가 작업하는 공간이다. 해당 공간에있는 jsp파일에 jsp로 작업된 문서가 존재하며, 읽기도 가능하다. (해당 파일은 JSP가 만든 결과물 이므로 수정하면 안된다, 추가하고싶은게 있을 경우 기존에 작성한 파일명.jsp 파일에서 수정해야 한다.)

*JSP를 이용한 코드 작성 방법

- 변수 추가 후 int x = 3;, int y = 4; 가 변수로서 출력되길 원하는 경우 <% %>를 붙여서 작성한다.

<%
int x =  3;
int y = 4;
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style>
input {
	width: 50px;
	height: 50px;
}

.output {
	height: 50px;
	background: #e9e9e9;
	font-size: 24px;
	font-weight: bold;
	text-align: right;
	padding: 0px, 5px;
}
</style>
</head>
<body>
	<form action="calc3" method="post">
		<table>
			<tr>
				<td class="output" colspan="4">${3+4}</td>
			</tr>
			<tr>
				<td><input type="submit" name="operator" value="CE" /></td>
				<td><input type="submit" name="operator" value="C" /></td>
				<td><input type="submit" name="operator" value="BS" /></td>
				<td><input type="submit" name="operator" value="/" /></td>
			</tr>
			<tr>
				<td><input type="submit" name="value" value="7" /></td>
				<td><input type="submit" name="value" value="8" /></td>
				<td><input type="submit" name="value" value="9" /></td>
				<td><input type="submit" name="operator" value="*" /></td>
			</tr>
			<tr>
				<td><input type="submit" name="value" value="4" /></td>
				<td><input type="submit" name="value" value="5" /></td>
				<td><input type="submit" name="value" value="6" /></td>
				<td><input type="submit" name="operator" value="-" /></td>
			</tr>
			<tr>
				<td><input type="submit" name="value" value="1" /></td>
				<td><input type="submit" name="value" value="2" /></td>
				<td><input type="submit" name="value" value="3" /></td>
				<td><input type="submit" name="operator" value="+" /></td>
			</tr>
			<tr>
				<td></td>
				<td><input type="submit" name="value" value="0" /></td>
				<td><input type="submit" name="dot" value="." /></td>
				<td><input type="submit" name="operator" value="=" /></td>
			</tr>
		</table>
	</form>
</body>
</html>

- 만약 <% %> 없이 그대로 입력을 하게 된다면 아래와 같은 결과가 나온다.

int x = 3;
int y = 4; 입력시 그대로 출력

저작자표시 (새창열림)

'프로그래밍 > 자바, JDBC' 카테고리의 다른 글

뉴렉처 학습(서블릿/JSP) 41강 (0)	2020.05.25
MYSQL 연동 방법, MYSQL 명령어 (0)	2020.05.25
뉴렉처 학습(서블릿/JSP) 39강 (0)	2020.05.22
자바 ArrayList (0)	2020.05.22
뉴렉처 학습(서블릿/JSP) 38강 (0)	2020.05.21

New 병아리 개발자