JSP 레이아웃 구성하기

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <% String root = request.getContextPath(); %> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Shop🛒 - ALOHA CLASS🌴</title> <!-- 파비콘 --> <link rel="icon" href="<%= root %>/static/img/logo.png" type="image/x-icon"> <!-- 썸네일 이미지 설정 --> <meta property="og:image" content="https://i.imgur.com/yiTQ3EV.jpg"> <!-- 웹 페이지 설명 (선택 사항) --> <meta property="og:description" content="ALOHA CLASS🌴 - 쇼핑몰 프로젝트"> <!-- 웹 페이지 URL --> <meta property="og:url" content="<%= root %>"> <!-- 웹 페이지 제목 --> <meta name="title" content="Shop🛒 - ALOHA CLASS🌴"> <meta property="og:title" content="Shop🛒 - ALOHA CLASS🌴"> <!-- 웹 페이지 타입 (웹사이트, 기사, 제품 등) --> <meta property="og:type" content="website"> <!-- 검색어 --> <meta name="keywords" content="쇼핑몰 프로젝트, 자바 웹개발, ALOHA CLASS, 알로하 클래스"> <meta name="robots" content="index, follow"> <!-- 사이트 맵 --> <link rel="sitemap" href="<%= root %>/static/sitemap.xml">

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!-- bootstrap lib --> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-4bw+/aepP/YC94hEpVNVgiZdgIC5+VKNBQNGCHeKRQN+PtmoHDEXuppvnDJzQIu9" crossorigin="anonymous"> <!-- font --> <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Noto+Sans:400,700&display=swap"> <!-- css --> <link href="<%= request.getContextPath() %>/static/css/style.css" rel="stylesheet" />

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!-- booststrap --> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-HwwvtgBNo3bZJJLYd8oVXjrBZt8cqVSpeBNS5n7C8IVInixGAoxmnlMuBnhbgrkm" crossorigin="anonymous"></script> <!-- js --> <script src="<%= request.getContextPath() %>/static/js/script.js"></script>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%> <%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%> <%@ taglib prefix="sql" uri="http://java.sun.com/jsp/jstl/sql"%> <%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %> <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <% String root = request.getContextPath(); String loginId = (String) session.getAttribute("loginId"); %> <nav class="navbar bg-dark navbar-expand-lg bg-body-tertiary" data-bs-theme="dark"> <div class="container-fluid"> <a class="navbar-brand" href="<%= root %>/">Home</a> <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarSupportedContent"> <ul class="navbar-nav me-auto mb-2 mb-lg-0"> <li class="nav-item"> <a class="nav-link active" aria-current="page" href="<%= root %>/shop/products.jsp">Product</a> </li> </ul> <ul class="navbar-nav d-flex align-items-center px-3"> <% if( loginId == null || loginId.equals("") ) { %> <!-- 비로그인 시 --> <li class="nav-item"> <a class="nav-link" aria-current="page" href="<%= root %>/user/login.jsp">로그인</a> </li> <li class="nav-item"> <a class="nav-link" aria-current="page" href="<%= root %>/user/join.jsp">회원가입</a> </li> <li class="nav-item"> </li> <% } else { %> <!-- 로그인 시 --> <li class="nav-item"> <div class="dropdown"> <a href="#" class="d-flex align-items-center link-body-emphasis text-decoration-none dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false"> <img src="https://github.com/mdo.png" alt="" width="32" height="32" class="rounded-circle me-2"> <%-- <strong><%= loginId %></strong> --%> </a> <ul class="dropdown-menu dropdown-menu-end text-small shadow"> <li><a class="dropdown-item" href="<%= root %>/user/index.jsp">마이 페이지</a></li> <li><a class="dropdown-item" href="<%= root %>/user/update.jsp">회원정보 수정</a></li> <li><hr class="dropdown-divider"></li> <li><a class="dropdown-item" href="<%= root %>/user/logout.jsp">로그아웃</a></li> </ul> </div> </li> <% } %> </ul> </div> </div> </nav>

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <footer class="container p-5"> <p>copyright Shop</p> </footer>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%> <%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%> <%@ taglib prefix="sql" uri="http://java.sun.com/jsp/jstl/sql"%> <%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %> <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <% String root = request.getContextPath(); String loginId = (String) session.getAttribute("loginId"); %> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <!-- meta, link 포함하기 --> </head> <body> <!-- header 포함하기 --> <div class="px-4 py-5 my-5 text-center"> <h1 class="display-5 fw-bold text-body-emphasis">메인화면</h1> <div class="col-lg-6 mx-auto"> <p class="lead mb-4">Shop 쇼핑몰 입니다.</p> <div class="d-grid gap-2 d-sm-flex justify-content-sm-center"> <a href="<%= root %>/shop/products.jsp" class="btn btn-primary btn-lg px-4 gap-3">상품목록</a> <% if( loginId == null || loginId.equals("") ) { %> <a href="<%= root %>/user/login.jsp" class="btn btn-outline-secondary btn-lg px-4">로그인</a> <% } else { %> <a href="<%= root %>/user/logout.jsp" class="btn btn-outline-danger btn-lg px-4">로그아웃</a> <% } %> </div> </div> </div> <!-- footer 포함하기 --> <!-- script 포함하기 --> </body> </html>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%> <%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%> <%@ taglib prefix="sql" uri="http://java.sun.com/jsp/jstl/sql"%> <%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %> <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <% String root = request.getContextPath(); String loginId = (String) session.getAttribute("loginId"); %> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <jsp:include page="/layout/meta.jsp" /> <jsp:include page="/layout/link.jsp" /> </head> <body> <jsp:include page="/layout/header.jsp" /> <div class="px-4 py-5 my-5 text-center"> <h1 class="display-5 fw-bold text-body-emphasis">메인화면</h1> <div class="col-lg-6 mx-auto"> <p class="lead mb-4">Shop 쇼핑몰 입니다.</p> <div class="d-grid gap-2 d-sm-flex justify-content-sm-center"> <a href="<%= root %>/shop/products.jsp" class="btn btn-primary btn-lg px-4 gap-3">상품목록</a> <% if( loginId == null || loginId.equals("") ) { %> <a href="<%= root %>/user/login.jsp" class="btn btn-outline-secondary btn-lg px-4">로그인</a> <% } else { %> <a href="<%= root %>/user/logout.jsp" class="btn btn-outline-danger btn-lg px-4">로그아웃</a> <% } %> </div> </div> </div> <jsp:include page="/layout/footer.jsp" /> <jsp:include page="/layout/script.jsp" /> </body> </html>