K 개발자

JSP BookMarket 만들기 - 2 본문

Web/JSP

JSP BookMarket 만들기 - 2

ddingz 2021. 8. 6. 18:06

이전 글
JSP BookMarket 만들기 - 1

실행 환경
자바 개발 환경 : jdk-15.0.2
웹 서버 환경 : Apache Tomcat v9.0
통합 개발 환경 : Eclipse IDE for Enterprise Java Developers

한글 출력 및 페이지 모듈화하기

WebContent 폴더의 머리글에 해당하는 menu.jsp 파일을 생성한다.

<%-- menu.jsp --%>
<nav class="navbar navbar-expand navbar-dark bg-dark">
	<div class="container">
		<div class="navbar-header">
			<a class="navbar-brand" href="./welcome.jsp">Home</a>
		</div>
	</div>
</nav>

WebContent 폴더의 바닥글에 해당하는 footer.jsp 파일을 생성한다.

<%-- footer.jsp --%>
<footer class="container">
	<p>&copy; BookMarket</p>
</footer>

WebContent 폴더의 welcome.jsp 파일을 수정한다.

  • include 디렉티브 태그를 이용하여 머리글 menu.jsp 파일과 바닥글 footer.jsp 파일의 내용을 포함한다.
  • page 디렉티브 태그의 contentType 속성을 이용하여 한글을 출력한다.
<%-- welcome.jsp --%>
<%@ page contentType="text/html; charset=utf-8"%>
<html>
<head>
<link rel="Stylesheet"
	href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
<title>Welcome</title>
</head>
<body>
	<%@ include file="menu.jsp"%>
	<%!String greeting = "도서 웹 쇼핑몰";
	String tagline = "Welcome to Book Market!";%>
	<div class="jumbotron">
		<div class="container">
			<h1 class="display-3">
				<%=greeting%>
			</h1>
		</div>
	</div>
	<div class="container">
		<div class="text-center">
			<h3>
				<%=tagline%>
			</h3>
		</div>
		<hr>
	</div>
	<%@ include file="footer.jsp"%>
</body>
</html>

웹 브라우저에 'http://localhost:8080/BookMarket/welcome.jsp'를 입력하여 실행 결과를 확인한다.

다음 글
JSP BookMarket 만들기 - 3
JSP BookMarket 만들기 - 4
JSP BookMarket 만들기 - 5
JSP BookMarket 만들기 - 6
JSP BookMarket 만들기 - 7
JSP BookMarket 만들기 - 8
JSP BookMarket 만들기 - 9
JSP BookMarket 만들기 - 10
JSP BookMarket 만들기 - 11
JSP BookMarket 만들기 - 12
JSP BookMarket 만들기 - 13
JSP BookMarket 만들기 - 마지막

'Web > JSP' 카테고리의 다른 글

JSP BookMarket 만들기 - 6  (0) 2021.08.06
JSP BookMarket 만들기 - 5  (0) 2021.08.06
JSP BookMarket 만들기 - 4  (0) 2021.08.06
JSP BookMarket 만들기 - 3  (1) 2021.08.06
JSP BookMarket 만들기 - 1  (0) 2021.08.06
Comments