31일차 시작....

조동현·2022년 8월 17일
0

[교육] Servlet, JSP

목록 보기
4/7
post-thumbnail

📌 Expression Language

  • EL
    - JSP에서 지원하는 확장 언어


📌 컨텍스트 경로 확인

  • 하드코딩 컨텍스트의 문제점
    - 컨텍스트 경로는 나중에 실제 프로젝트가 끝나고 배포되는 시점에서 변경되거나 제거될 요소이다.
    - 컨텍스트 경로를 실제로 코딩해 놓으면 나중에 제거하거나 변경할 때 어려움이 발생한다.

  • 루트 경로
    - 어떤 프로젝트에서든 해당 프로젝트의 루트 경로를 가져오는 문법
    - 해당 문법을 변경 및 삭제하지 않아도 된다.

  • 형식
${pageContext.request.contextPath}
or
<%request.getContextPath()%>


📌 네비게이션바

  • 네비게이션바
<nav class="navbar bg-light navbar-expand-sm">
	  <div class="container">
	    <a class="navbar-brand" href="${pageContext.request.contextPath }/">
	      <img src="https://getbootstrap.com/docs/5.2/assets/brand/bootstrap-logo.svg" alt="" width="30" height="24" class="d-inline-block align-text-top">
	      네비게이션바 이름
	    </a>
	    <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
	      <span class="navbar-toggler-icon"></span>
	    </button>
	    <div class="collapse navbar-collapse" id="navbarNav">
	       <ul class="navbar-nav">
	          <li class="nav-item">
	             <a class="nav-link" href="${pageContext.request.contextPath }/절대경로">네비게이션바 요소</a>
	          </li>
	       </ul>
	    </div>
	  </div>
	</nav>


📌 jsp:include

  • include 페이지
    - 웹 페이지를 구성할 때, 네비게이션이나 footer를 다른 jsp파일로 모듈화시켜 필요할때마다 불러오는 방식을 사용한다.

주의사항) include를 위한 jsp파일 내부에는 필요한 기능이외의 html을 모두 삭제한다.

  • 형식
<!--네비게이션 기능을 저장한 include/nav.jsp-->
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<header class="p-3 text-bg-dark">
    <div class="container">
      <div class="d-flex flex-wrap align-items-center justify-content-center justify-content-lg-start">
        <a href="${pageContext.request.contextPath }" class="d-flex align-items-center mb-2 mb-lg-0 text-white text-decoration-none">
          <svg class="bi me-2" width="40" height="32" role="img" aria-label="Bootstrap"><use xlink:href="#bootstrap"/></svg>
        </a>
        <ul class="nav col-12 col-lg-auto me-lg-auto mb-2 justify-content-center mb-md-0">
          <li><a href="${pageContext.request.contextPath }" class="nav-link px-2 text-secondary">Home</a></li>
          <li><a href="${pageContext.request.contextPath }/member/list.jsp" class="nav-link px-2 text-white">User</a></li>
          <li><a href="${pageContext.request.contextPath }/todo/list.jsp" class="nav-link px-2 text-white">ToDo</a></li>
        </ul>
        <form class="col-12 col-lg-auto mb-3 mb-lg-0 me-lg-3" role="search">
          <input type="search" class="form-control form-control-dark text-bg-dark" placeholder="Search..." aria-label="Search">
        </form>
        <div class="text-end">
          <button type="button" class="btn btn-outline-light me-2">Login</button>
          <button type="button" class="btn btn-warning">Sign-up</button>
        </div>
      </div>
    </div>
</header>
<!--nav.js를 사용하려는 jsp파일-->
<jsp:include page="/include/nav.jsp"></jsp:include>


📌 jsp:param

  • jsp:param
    - 모듈화된 jsp파일에 특정 파라미터 값을 반환하고 싶을 때 사용한다.

  • 형식
<!-- /member/list.jsp 파일에서 정의한 jsp:param -->
<jsp:include page="/include/nav.jsp">
	<jsp:param value="member" name="thisPage"/>
</jsp:include>
<!-- /todo/list.jsp 파일에서 정의한 jsp:param -->
<jsp:include page="/include/nav.jsp">
	<jsp:param value="index" name="thisPage"/>
</jsp:include>


profile
데이터 사이언티스트를 목표로 하는 개발자

0개의 댓글