1. 스프링에 프로젝트 생성
Spring Legacy Project - TourWeb, Spring MVC Project - Next - com.itwillbs.TourWeb - Finish
2. project명 없애기 설정하기
Servers - Tomcat v9.0 Server at localhost - Modules 탭 선택
※ project명을 없애고 싶다면 ${pageConext.request.contextPath} 쓰지 않음
프로젝트 선택하고 - Edit - Path : / 로 변경 - Ok
Servers 탭을 닫고 Save - Run as
3. 자바 버전 변경
프로젝트 우클릭 Properties => Project Facets(3.1, 11), Java Compiler(11)
4. 스프링 버전 변경 => 5.0.7
pom.xml
<properties>
<java-version>11</java-version>
<org.springframework-version>5.0.7.RELEASE</org.springframework-version>
<org.aspectj-version>1.6.10</org.aspectj-version>
<org.slf4j-version>1.6.6</org.slf4j-version>
</properties>
//(...생략...)
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-compiler-plugin</artifactId>
<version>3.5.1</version>
<configuration>
<source>11</source>
<target>11</target>
<compilerArgument>-Xlint:all</compilerArgument>
<showWarnings>true</showWarnings>
<showDeprecation>true</showDeprecation>
</configuration>
</plugin>
5. JDBC 설정
6. 가상 주소 설정
web.xml
7. servlet-context.xml 스캔(by web.xml)
8. root-context.xml
9. 컨트롤러 패키지 MemberController 생성
스캔이 되려면 servlet-context.xml에서 스캔이 되게 component-scan 추가
servlet-context.xml
<?xml version="1.0" encoding="UTF-8"?>
<beans:beans xmlns="http://www.springframework.org/schema/mvc"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:beans="http://www.springframework.org/schema/beans"
xmlns:context="http://www.springframework.org/schema/context"
xsi:schemaLocation="http://www.springframework.org/schema/mvc https://www.springframework.org/schema/mvc/spring-mvc.xsd
http://www.springframework.org/schema/beans https://www.springframework.org/schema/beans/spring-beans.xsd
http://www.springframework.org/schema/context https://www.springframework.org/schema/context/spring-context.xsd">
<!-- DispatcherServlet Context: defines this servlet's request-processing infrastructure -->
<!-- Enables the Spring MVC @Controller programming model -->
<annotation-driven />
<!-- Handles HTTP GET requests for /resources/** by efficiently serving up static resources in the ${webappRoot}/resources directory -->
<resources mapping="/resources/**" location="/resources/" />
<!-- Resolves views selected for rendering by @Controllers to .jsp resources in the /WEB-INF/views directory -->
<beans:bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<beans:property name="prefix" value="/WEB-INF/views/" />
<beans:property name="suffix" value=".jsp" />
</beans:bean>
<context:component-scan base-package="com.itwillbs.TourWeb" />
<context:component-scan base-package="com.itwillbs.controller" />
</beans:beans>
Controller.java
package com.itwillbs.controller;
import org.springframework.stereotype.Controller;
@Controller
public class MemberController {
}
10. 화면 연결 진행
TourWeb 폴더 압축해제하고 사진과 같이 각각 넣어줌
views에 파일들은 html이므로 => 안에 내용 복사해서 jsp파일로 옮기기
join.jsp를 주소매핑
package com.itwillbs.controller;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
@Controller
@RequestMapping("/member/*")
public class MemberController {
// @GetMapping("/join")
// public String join() {
// System.out.println("MemberController join()");
//
// return "/member/join";
// }
// 또는
@GetMapping("/join")
public void join() {
}
}
join.jsp
resources에 있는 src만 넣어주기
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="ko">
<head>
<title> 회원가입 | 투어리스트인투어 </title>
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="stylesheet" href="/resources/css/common.css">
<script src="/resources/js/jquery-1.11.3.min.js"></script>
<script src="/resources/js/common.js"></script>
<script src="/resources/js/jquery.smooth-scroll.min.js"></script>
<!--[if lte IE 9]>
<script src="js/html5shiv.js"></script>
<script src="js/placeholders.min.js"></script>
<![endif]-->
</head>
<body>
<ul class="skipnavi">
<li><a href="#container">본문내용</a></li>
</ul>
<!-- wrap -->
<div id="wrap">
<header id="header">
<div class="header_area box_inner clear">
<h1><a href="../main/main.html">Tourist in tour</a></h1>
<p class="openMOgnb"><a href="#"><b class="hdd">메뉴열기</b> <span></span><span></span><span></span></a></p>
<!-- header_cont -->
<div class="header_cont">
<ul class="util clear">
<li><a href="../member/login.html">로그인</a></li>
<li><a href="../member/join.html">회원가입</a></li>
</ul>
<nav>
<ul class="gnb clear">
<li><a href="javascript:;" class="openAll1">여행정보</a>
<div class="gnb_depth gnb_depth2_1">
<ul class="submenu_list">
<li><a href="javascript:;">국내</a></li>
<li><a href="javascript:;">해외</a></li>
</ul>
</div>
</li>
<li><a href="javascript:;" class="openAll2">고객센터</a>
<div class="gnb_depth gnb_depth2_2">
<ul class="submenu_list">
<li><a href="../notice/notice.html">공지사항</a></li>
<li><a href="javascript:;">문의하기</a></li>
</ul>
</div>
</li>
<li><a href="javascript:;" class="openAll3">상품투어</a>
<div class="gnb_depth gnb_depth2_3">
<ul class="submenu_list">
<li><a href="../program/program.html">프로그램 소개</a></li>
<li><a href="javascript:;">여행자료</a></li>
</ul>
</div>
</li>
<li><a href="javascript:;" class="openAll4">티켓/가이드</a>
<div class="gnb_depth gnb_depth2_4">
<ul class="submenu_list">
<li><a href="javascript:;">항공</a></li>
<li><a href="javascript:;">호텔</a></li>
</ul>
</div>
</li>
</ul>
</nav>
<p class="closePop"><a href="javascript:;">닫기</a></p>
</div>
<!-- //header_cont -->
</div>
</header>
<div id="container">
<!-- location_area -->
<div class="location_area member">
<div class="box_inner">
<h2 class="tit_page">TOURIST <span class="in">in</span> TOUR</h2>
<p class="location">MEMBER <span class="path">/</span> 회원가입</p>
<ul class="page_menu clear">
<li><a href="javascript:;" class="on">회원가입</a></li>
</ul>
</div>
</div>
<!-- //location_area -->
<!-- bodytext_area -->
<div class="bodytext_area box_inner">
<!-- appForm -->
<form action="#" class="appForm">
<fieldset>
<legend>상담문의 입력 양식</legend>
<p class="info_pilsoo pilsoo_item">필수입력</p>
<ul class="app_list">
<li class="clear">
<label for="id_lbl" class="tit_lbl pilsoo_item">아이디</label>
<div class="app_content"><input type="text" name="id" class="w100p" id="id_lbl" placeholder="아이디 입력해주세요"/></div>
</li>
<li class="clear">
<label for="pwd_lbl" class="tit_lbl pilsoo_item">비밀번호</label>
<div class="app_content"><input type="password" name="pass" class="w100p" id="pwd_lbl" placeholder="비밀번호를 입력해주세요"/></div>
</li>
<li class="clear">
<label for="pwd2_lbl" class="tit_lbl pilsoo_item">비밀번호 확인</label>
<div class="app_content"><input type="password" name="pass2" class="w100p" id="pwd2_lbl" placeholder="비밀번호를 다시 한번 입력해주세요"/></div>
</li>
<li class="clear">
<label for="name_lbl" class="tit_lbl pilsoo_item">작성자명</label>
<div class="app_content"><input type="text" name="name" class="w100p" id="name_lbl" placeholder="이름을 입력해주세요"/></div>
</li>
<li class="clear">
<label for="phone_lbl" class="tit_lbl pilsoo_item">연락처</label>
<div class="app_content"><input type="tel" name="phone" class="w100p" id="phone_lbl" placeholder="휴대폰”-”없이 숫자만 입력하세요"/></div>
</li>
<li class="clear">
<label for="email_lbl" class="tit_lbl pilsoo_item">이메일</label>
<div class="app_content email_area">
<input type="text" name="email" class="w160" id="email_lbl" title="이메일 주소" />
<span class="ico_space">@</span>
<input type="text" name="email2" class="w160" title="이메일 제공업체 입력" />
<div class="select_common">
<select title="이메일 제공업체 목록" >
<option value="">직접입력</option>
<option value="">naver.com</option>
<option value="">hanmail.net</option>
</select>
</div>
</div>
</li>
<li class="clear">
<span class="tit_lbl">성별</span>
<div class="app_content radio_area">
<input type="radio" class="css-radio" id="mmm_lbl" name="gender"><label for="mmm_lbl">남</label>
<input type="radio" class="css-radio" id="www_lbl" name="gender"><label for="www_lbl">여</label>
</div>
</li>
<li class="clear">
<span class="tit_lbl">개인정보 활용동의</span>
<div class="app_content checkbox_area">
<input type="checkbox" class="css-checkbox" id="agree_lbl" name="agree"><label for="agree_lbl">동의함</label>
</div>
</li>
<li class="clear">
<label for="content_lbl" class="tit_lbl">문의내용</label>
<div class="app_content"><textarea name="content" id="content_lbl" class="w100p" placeholder="간단한 상담 요청 사항을 남겨주시면 보다 상세한 상담이 가능합니다.
전화 상담 희망시 기재 부탁드립니다."></textarea></div>
</li>
</ul>
<p class="btn_line"><a href="javascript:;" class="btn_baseColor">회원가입</a></p>
</fieldset>
</form>
<!-- //appForm -->
</div>
<!-- //bodytext_area -->
</div>
<!-- //container -->
<footer>
<div class="foot_area box_inner">
<ul class="foot_list clear">
<li><a href="javascript;">이용약관</a></li>
<li><a href="javascript;">개인정보취급방침</a></li>
</ul>
<h2>투어리스트인투어</h2>
<p class="addr">서울특별시 종로구 혜화동 9길 청운빌딩 5층 <span class="gubun">/</span>
<span class="br_line">대표전화 <span class="space0">02-1234-5678</span> <span class="gubun">/</span>
<span class="br_line">E-mail : <span class="space0"> titour@touristintour.com</span></span>
</span>
</p>
<p class="copy box_inner">Copyright(c) TouristInTour all right reserved</p>
<ul class="snslink clear">
<li><a href="javascript:;">blog</a></li>
<li><a href="javascript:;">facebook</a></li>
<li><a href="javascript:;">instargram</a></li>
</ul>
</div>
</footer>
</div>
<!-- //wrap -->
<h2 class="hdd">빠른 링크 : 전화 문의, 카카오톡, 오시는 길, 꼭대기로</h2>
<div class="quick_area">
<ul class="quick_list">
<li><a href="tel:010-7184-4403"><h3>전화 문의</h3><p>010-1234-5678</p></a></li>
<li><a href="javascript:;"><h3>카카오톡 <em>상담</em></h3><p>1:1상담</p></a></li>
<li><a href="javascript:;"><h3 class="to_contact">오시는 길</h3></a></li>
</ul>
<p class="to_top"><a href="#layout0" class="s_point">TOP</a></p>
</div>
</body>
</html>
반복되는 부분 짤라내기
views-inc
top.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<header id="header">
<div class="header_area box_inner clear">
<h1><a href="../main/main.html">Tourist in tour</a></h1>
<p class="openMOgnb"><a href="#"><b class="hdd">메뉴열기</b> <span></span><span></span><span></span></a></p>
<!-- header_cont -->
<div class="header_cont">
<ul class="util clear">
<li><a href="../member/login.html">로그인</a></li>
<li><a href="../member/join.html">회원가입</a></li>
</ul>
<nav>
<ul class="gnb clear">
<li><a href="javascript:;" class="openAll1">여행정보</a>
<div class="gnb_depth gnb_depth2_1">
<ul class="submenu_list">
<li><a href="javascript:;">국내</a></li>
<li><a href="javascript:;">해외</a></li>
</ul>
</div>
</li>
<li><a href="javascript:;" class="openAll2">고객센터</a>
<div class="gnb_depth gnb_depth2_2">
<ul class="submenu_list">
<li><a href="../notice/notice.html">공지사항</a></li>
<li><a href="javascript:;">문의하기</a></li>
</ul>
</div>
</li>
<li><a href="javascript:;" class="openAll3">상품투어</a>
<div class="gnb_depth gnb_depth2_3">
<ul class="submenu_list">
<li><a href="../program/program.html">프로그램 소개</a></li>
<li><a href="javascript:;">여행자료</a></li>
</ul>
</div>
</li>
<li><a href="javascript:;" class="openAll4">티켓/가이드</a>
<div class="gnb_depth gnb_depth2_4">
<ul class="submenu_list">
<li><a href="javascript:;">항공</a></li>
<li><a href="javascript:;">호텔</a></li>
</ul>
</div>
</li>
</ul>
</nav>
<p class="closePop"><a href="javascript:;">닫기</a></p>
</div>
<!-- //header_cont -->
</div>
</header>
bottom.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<footer>
<div class="foot_area box_inner">
<ul class="foot_list clear">
<li><a href="javascript;">이용약관</a></li>
<li><a href="javascript;">개인정보취급방침</a></li>
</ul>
<h2>투어리스트인투어</h2>
<p class="addr">서울특별시 종로구 혜화동 9길 청운빌딩 5층 <span class="gubun">/</span>
<span class="br_line">대표전화 <span class="space0">02-1234-5678</span> <span class="gubun">/</span>
<span class="br_line">E-mail : <span class="space0"> titour@touristintour.com</span></span>
</span>
</p>
<p class="copy box_inner">Copyright(c) TouristInTour all right reserved</p>
<ul class="snslink clear">
<li><a href="javascript:;">blog</a></li>
<li><a href="javascript:;">facebook</a></li>
<li><a href="javascript:;">instargram</a></li>
</ul>
</div>
</footer>
join.jsp include
<%@ 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 lang="ko">
<head>
<title> 회원가입 | 투어리스트인투어 </title>
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="stylesheet" href="/resources/css/common.css">
<script src="/resources/js/jquery-1.11.3.min.js"></script>
<script src="/resources/js/common.js"></script>
<script src="/resources/js/jquery.smooth-scroll.min.js"></script>
<!--[if lte IE 9]>
<script src="js/html5shiv.js"></script>
<script src="js/placeholders.min.js"></script>
<![endif]-->
</head>
<body>
<ul class="skipnavi">
<li><a href="#container">본문내용</a></li>
</ul>
<!-- wrap -->
<div id="wrap">
<!-- header -->
<jsp:include page="../inc/top.jsp" />
<div id="container">
<!-- location_area -->
<div class="location_area member">
<div class="box_inner">
<h2 class="tit_page">TOURIST <span class="in">in</span> TOUR</h2>
<p class="location">MEMBER <span class="path">/</span> 회원가입</p>
<ul class="page_menu clear">
<li><a href="javascript:;" class="on">회원가입</a></li>
</ul>
</div>
</div>
<!-- //location_area -->
<!-- bodytext_area -->
<div class="bodytext_area box_inner">
<!-- appForm -->
<form action="#" class="appForm">
<fieldset>
<legend>상담문의 입력 양식</legend>
<p class="info_pilsoo pilsoo_item">필수입력</p>
<ul class="app_list">
<li class="clear">
<label for="id_lbl" class="tit_lbl pilsoo_item">아이디</label>
<div class="app_content"><input type="text" name="id" class="w100p" id="id_lbl" placeholder="아이디 입력해주세요"/></div>
</li>
<li class="clear">
<label for="pwd_lbl" class="tit_lbl pilsoo_item">비밀번호</label>
<div class="app_content"><input type="password" name="pass" class="w100p" id="pwd_lbl" placeholder="비밀번호를 입력해주세요"/></div>
</li>
<li class="clear">
<label for="pwd2_lbl" class="tit_lbl pilsoo_item">비밀번호 확인</label>
<div class="app_content"><input type="password" name="pass2" class="w100p" id="pwd2_lbl" placeholder="비밀번호를 다시 한번 입력해주세요"/></div>
</li>
<li class="clear">
<label for="name_lbl" class="tit_lbl pilsoo_item">작성자명</label>
<div class="app_content"><input type="text" name="name" class="w100p" id="name_lbl" placeholder="이름을 입력해주세요"/></div>
</li>
<li class="clear">
<label for="phone_lbl" class="tit_lbl pilsoo_item">연락처</label>
<div class="app_content"><input type="tel" name="phone" class="w100p" id="phone_lbl" placeholder="휴대폰”-”없이 숫자만 입력하세요"/></div>
</li>
<li class="clear">
<label for="email_lbl" class="tit_lbl pilsoo_item">이메일</label>
<div class="app_content email_area">
<input type="text" name="email" class="w160" id="email_lbl" title="이메일 주소" />
<span class="ico_space">@</span>
<input type="text" name="email2" class="w160" title="이메일 제공업체 입력" />
<div class="select_common">
<select title="이메일 제공업체 목록" >
<option value="">직접입력</option>
<option value="">naver.com</option>
<option value="">hanmail.net</option>
</select>
</div>
</div>
</li>
<li class="clear">
<span class="tit_lbl">성별</span>
<div class="app_content radio_area">
<input type="radio" class="css-radio" id="mmm_lbl" name="gender"><label for="mmm_lbl">남</label>
<input type="radio" class="css-radio" id="www_lbl" name="gender"><label for="www_lbl">여</label>
</div>
</li>
<li class="clear">
<span class="tit_lbl">개인정보 활용동의</span>
<div class="app_content checkbox_area">
<input type="checkbox" class="css-checkbox" id="agree_lbl" name="agree"><label for="agree_lbl">동의함</label>
</div>
</li>
<li class="clear">
<label for="content_lbl" class="tit_lbl">문의내용</label>
<div class="app_content"><textarea name="content" id="content_lbl" class="w100p" placeholder="간단한 상담 요청 사항을 남겨주시면 보다 상세한 상담이 가능합니다.
전화 상담 희망시 기재 부탁드립니다."></textarea></div>
</li>
</ul>
<p class="btn_line"><a href="javascript:;" class="btn_baseColor">회원가입</a></p>
</fieldset>
</form>
<!-- //appForm -->
</div>
<!-- //bodytext_area -->
</div>
<!-- //container -->
<!-- footer -->
<jsp:include page="../inc/bottom.jsp" />
</div>
<!-- //wrap -->
<h2 class="hdd">빠른 링크 : 전화 문의, 카카오톡, 오시는 길, 꼭대기로</h2>
<div class="quick_area">
<ul class="quick_list">
<li><a href="tel:010-7184-4403"><h3>전화 문의</h3><p>010-1234-5678</p></a></li>
<li><a href="javascript:;"><h3>카카오톡 <em>상담</em></h3><p>1:1상담</p></a></li>
<li><a href="javascript:;"><h3 class="to_contact">오시는 길</h3></a></li>
</ul>
<p class="to_top"><a href="#layout0" class="s_point">TOP</a></p>
</div>
</body>
</html>
나머지 페이지들도 중복되는 top, bottom부분을 지우고 jsp taglib 넣고 include시켜주면 됨
주소 연결
login.jsp
<%@ 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 lang="ko">
<head>
<title> 로그인 | 투어리스트인투어 </title>
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="stylesheet" href="/resources/css/common.css">
<script src="/resources/js/jquery-1.11.3.min.js"></script>
<script src="/resources/js/common.js"></script>
<script src="/resources/js/jquery.smooth-scroll.min.js"></script>
<!--[if lte IE 9]>
<script src="js/html5shiv.js"></script>
<script src="js/placeholders.min.js"></script>
<![endif]-->
</head>
<body>
<ul class="skipnavi">
<li><a href="#container">본문내용</a></li>
</ul>
<!-- wrap -->
<div id="wrap">
<jsp:include page="../inc/top.jsp" />
<div id="container">
<!-- location_area -->
<div class="location_area member">
<div class="box_inner">
<h2 class="tit_page">TOURIST <span class="in">in</span> TOUR</h2>
<p class="location">MEMBER <span class="path">/</span> 로그인</p>
<ul class="page_menu clear">
<li><a href="javascript:;" class="on">로그인</a></li>
</ul>
</div>
</div>
<!-- //location_area -->
<!-- bodytext_area -->
<div class="bodytext_area box_inner">
<!-- appForm -->
<form action="#" class="appForm">
<fieldset>
<legend>로그인 입력 양식</legend>
<p class="info_pilsoo pilsoo_item">필수입력</p>
<ul class="app_list">
<li class="clear">
<label for="id_lbl" class="tit_lbl pilsoo_item">아이디</label>
<div class="app_content"><input type="text" name="id" class="w100p" id="id_lbl" placeholder="아이디 입력해주세요"/></div>
</li>
<li class="clear">
<label for="pwd_lbl" class="tit_lbl pilsoo_item">비밀번호</label>
<div class="app_content"><input type="password" name="pass" class="w100p" id="pwd_lbl" placeholder="비밀번호를 입력해주세요"/></div>
</li>
</ul>
<p class="btn_line"><a href="javascript:;" class="btn_baseColor">로그인</a></p>
</fieldset>
</form>
<!-- //appForm -->
</div>
<!-- //bodytext_area -->
</div>
<!-- //container -->
<jsp:include page="../inc/bottom.jsp" />
</div>
<!-- //wrap -->
<h2 class="hdd">빠른 링크 : 전화 문의, 카카오톡, 오시는 길, 꼭대기로</h2>
<div class="quick_area">
<ul class="quick_list">
<li><a href="tel:010-7184-4403"><h3>전화 문의</h3><p>010-1234-5678</p></a></li>
<li><a href="javascript:;"><h3>카카오톡 <em>상담</em></h3><p>1:1상담</p></a></li>
<li><a href="javascript:;"><h3 class="to_contact">오시는 길</h3></a></li>
</ul>
<p class="to_top"><a href="#layout0" class="s_point">TOP</a></p>
</div>
</body>
</html>
MemberController
package com.itwillbs.controller;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
@Controller
@RequestMapping("/member/*")
public class MemberController {
@GetMapping("/join")
public String insert() {
System.out.println("MemberController join()");
return "/member/join";
}
// 또는
// @GetMapping("/join")
// public void insert() {
//
// }
//member/login
@GetMapping("/login")
public String login() {
System.out.println("MemberController login()");
return "/member/login";
}
}
main/main
<%@ 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 lang="ko">
<head>
<title> 투어리스트인투어 </title>
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="stylesheet" href="/resources/css/swiper.min.css">
<link rel="stylesheet" href="/resources/css/common.css">
<script src="/resources/js/jquery-1.11.3.min.js"></script>
<script src="/resources/js/rollmain.js"></script>
<script src="/resources/js/jquery.easing.js"></script>
<script src="/resources/js/common.js"></script>
<script src="/resources/js/jquery.smooth-scroll.min.js"></script>
<!--[if lte IE 9]>
<script src="js/html5shiv.js"></script>
<script src="js/placeholders.min.js"></script>
<![endif]-->
</head>
<body>
<ul class="skipnavi">
<li><a href="#container">본문내용</a></li>
</ul>
<!-- wrap -->
<div id="wrap">
<jsp:include page="../inc/top.jsp" />
<div id="container">
<div class="main_rolling_pc">
<div class="visualRoll">
<ul class="viewImgList">
<li class="imglist0">
<div class="roll_content">
<a href="javascript:;">
<img src="/resources/img/img_slidecontents01.png" alt="TRUST & INFORMATION 믿을 수 있는 여행정보, 여행... 어디로 가세요?"></a>
<p class="roll_txtline">BE TOURIST FOR BETTER LIFE</p>
</div>
</li>
<li class="imglist1">
<div class="roll_content">
<a href="javascript:;">
<img src="/resources/img/img_slidecontents02.png" alt="TRUST & INFORMATION 믿을 수 있는 여행정보, 여행... 어디로 가세요?"></a>
<p class="roll_txtline">BE TOURIST FOR BETTER LIFE</p>
</div>
</li>
<li class="imglist2">
<div class="roll_content">
<a href="javascript:;">
<img src="/resources/img/img_slidecontents03.png" alt="TRUST & INFORMATION 믿을 수 있는 여행정보, 여행... 어디로 가세요?"></a>
<p class="roll_txtline">BE TOURIST FOR BETTER LIFE</p>
</div>
</li>
</ul>
<div class="rollbtnArea">
<ul class="rollingbtn">
<li class="seq butt0"><a href="#butt"><img src="/resources/img/btn_rollbutt_on.png" alt="1번" /></a></li>
<li class="seq butt1"><a href="#butt"><img src="/resources/img/btn_rollbutt_off.png" alt="2번" /></a></li>
<li class="seq butt2"><a href="#butt"><img src="/resources/img/btn_rollbutt_off.png" alt="3번" /></a></li>
<li class="rollstop"><a href="#" class="stop"><img src="/resources/img/btn_roll_stop.png" alt="멈춤" /></a></li>
<li class="rollplay"><a href="#" class="play"><img src="/resources/img/btn_roll_play.png" alt="재생" /></a></li>
</ul>
</div><!-- //rollbtnArea -->
</div><!-- //visualRoll -->
</div><!-- //main_rolling_pc -->
<div class="main_rolling_mobile">
<div class="swiper-container">
<div class="swiper-wrapper">
<div class="swiper-slide">
<a href="javascript:;"><img src="/resources/img/mainslide_mob01.jpg" alt="TRUST & INFORMATION 믿을 수 있는 여행정보, 여행... 어디로 가세요?" /></a>
</div>
<div class="swiper-slide">
<a href="javascript:;"><img src="/resources/img/mainslide_mob02.jpg" alt="TRUST & INFORMATION 믿을 수 있는 여행정보, 여행... 어디로 가세요?" /></a>
</div>
<div class="swiper-slide">
<a href="javascript:;"><img src="/resources/img/mainslide_mob03.jpg" alt="TRUST & INFORMATION 믿을 수 있는 여행정보, 여행... 어디로 가세요?" /></a>
</div>
</div>
<div class="swiper-pagination"></div>
<!-- <div class="swiper-button-next"></div>
<div class="swiper-button-prev"></div> -->
</div><!--//swiper-container-->
</div><!--//main_rolling_mobile -->
<!-- about_area -->
<div class="about_area">
<h2>다시 찾는 인기 여행지 <b>TOP 3</b></h2>
<div class="about_box">
<ul class="place_list box_inner clear">
<li><a href="#" onclick="$('.popup_base').css('height',$(document).height());$('.contact_pop').show();">
<img class="img_topplace" src="/resources/img/img_topplace01.jpg" alt="다리를 높이 들어 운동" />
<h3>성패트릭 대성당</h3>
<p class="txt">바쁜 뉴욕 안에서 정교하면서도 웅장한 기운에 침묵하게 되는 기도의 시간!</p>
<span class="view">VIEW</span></a>
</li>
<li><a href="#" onclick="$('.popup_base').css('height',$(document).height());$('.space_pop').show();">
<img class="img_topplace" src="/resources/img/img_topplace02.jpg" alt="바닷가에서 스트레칭" />
<h3>원주 뮤지엄 '산'</h3>
<p class="txt">전시된 유산들을 담아낸 건물에 신비로운 돌과 물의 테마가 담겨 있다.</p>
<span class="view">VIEW</span></a>
</li>
<li><a href="#" onclick="$('.popup_base').css('height',$(document).height());$('.program_pop').show();">
<img class="img_topplace" src="/resources/img/img_topplace03.jpg" alt="앉아서 스트레칭" />
<h3>일본 만국박람회 기념공원</h3>
<p class="txt">오사카 센리 반파쿠에는 드넓은 대지에 정원과 들, 물과 함께 하는 문화가 있다.</p>
<span class="view">VIEW</span></a>
</li>
</ul>
</div>
</div>
<!-- //about_area -->
<!-- app_area -->
<div class="appbbs_area">
<div class="appbbs_box box_inner clear">
<h2 class="hdd">상담과 최근게시물</h2>
<p class="app_line">
<a href="javascript:;">카카오톡 1:1 상담</a>
<a href="javascript:;">전화 상담 신청</a>
</p>
<div class="bbs_line">
<h3>NOTICE</h3>
<ul class="notice_recent">
<li><a href="javascript:;">이번 여름 휴가 제주 갈까? 미션 투어 (여행경비 50만원 지원)</a></li>
<li><a href="javascript:;">박물관 미션 투어 응모 당첨자 발표</a></li>
<li><a href="javascript:;">추석 연휴 티켓/투어 배송 및 직접 수령 안내</a></li>
<li><a href="javascript:;">하롱베이 서비스 OPEN! (여행정보, 가이드북, 가이드맵)</a></li>
<li><a href="javascript:;">투어리스트인투어 서비스 점검 안내</a></li>
</ul>
</div>
</div>
</div>
<!-- //app_area -->
</div>
<!-- //container -->
<jsp:include page="../inc/bottom.jsp" />
</div>
<!-- //wrap -->
<h2 class="hdd">빠른 링크 : 전화 문의,카카오톡,오시는 길,꼭대기로</h2>
<div class="quick_area">
<ul class="quick_list">
<li><a href="tel:010-7184-4403"><h3>전화 문의</h3><p>010-1234-5678</p></a></li>
<li><a href="javascript:;"><h3>카카오톡 <em>상담</em></h3><p>1:1상담</p></a></li>
<li><a href="javascript:;"><h3 class="to_contact">오시는 길</h3></a></li>
</ul>
<p class="to_top"><a href="#layout0" class="s_point">TOP</a></p>
</div>
<script type="text/javascript" src="/resources/js/swiper.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var swiper = new Swiper('.swiper-container', {
loop: true,
autoplay:5500,
autoplayDisableOnInteraction: false,
pagination: '.swiper-pagination',
paginationClickable: true
});
});
</script>
<!-- contact_pop -->
<div class="popup_base contact_pop">
<div class="pop_content">
<p class="btn_xpop"><a href="#" onclick="$(this).parent().parent().parent().hide();">닫기</a></p>
<ul class="pop_list">
<li>
<h2 class="tit_pop">성패트릭 대성당</h2>
<img class="pop_img"src="/resources/img/img_pop1_1.jpg" alt="성패트릭 대성당" />
<div class="pop_txt"><p>뉴욕에서 만난 아름다운 고딕양식에 감탄을 금할 수 없습니다. <br>인상적인 예술작품들과 함께 하고 있으며 정교한 구조와 섬세한 조각들을 만날 수 있습니다. </p></div>
</li>
</ul>
</div>
</div>
<!-- //contact_pop -->
<!-- space_pop -->
<div class="popup_base space_pop">
<div class="pop_content">
<p class="btn_xpop"><a href="#" onclick="$(this).parent().parent().parent().hide();">닫기</a></p>
<ul class="pop_list">
<li>
<h2 class="tit_pop">원주 뮤지엄 '산'</h2>
<img class="pop_img"src="/resources/img/img_pop2_1.jpg" alt="뮤지엄 산의 물위의 건물" />
<div class="pop_txt"><p>실내와 야외, 문화와 자연이 공존하는 세계. <br> 뮤지엄 산은 휴식과 소통이 어울러진 복합공간을 추구합니다. </p></div>
</li>
<li>
<h2 class="tit_pop">박물관 야외</h2>
<img class="pop_img"src="/resources/img/img_pop2_2.jpg" alt="박물관 야외조경" />
<div class="pop_txt"><p>공간에 대한 관람을 최대한 배려하려고 합니다.<br>뮤지엄 산은 돌과 물과 산이 함께 어울림으로 배치된 조형 공간입니다.</p></div>
</li>
</ul>
</div>
</div>
<!-- //space_pop -->
<!-- program_pop -->
<div class="popup_base program_pop">
<div class="pop_content">
<p class="btn_xpop"><a href="#" onclick="$(this).parent().parent().parent().hide();">닫기</a></p>
<ul class="pop_list">
<li>
<h2 class="tit_pop">일본 만국박람회 기념 공원</h2>
<img class="pop_img"src="/resources/img/img_pop3_1.jpg" alt="일본 만국박람회 기념 공원" />
<div class="pop_txt"><p>센리 반파쿠 기념 공원에서는 일본 정원의 확장판을 만날 수 있습니다.<br>가능한 가장 넓은 공간에 꾸민 연못, 산림욕, 정원, 산책길을 만끽할 수 있습니다.</p></div>
</li>
</ul>
</div>
</div>
<!-- //program_pop -->
</body>
</html>
main 주소매핑
MemberController
//메인화면 member/main
@GetMapping("/main")
public String main() {
System.out.println("MemberController main()");
return "/main/main";
}
HomeController
첫 화면 수정
package com.itwillbs.TourWeb;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
/**
* Handles requests for the application home page.
*/
@Controller
public class HomeController {
/**
* Simply selects the home view to render by returning its name.
*/
@RequestMapping(value = "/", method = RequestMethod.GET)
public String main() {
return "main/main";
}
}
'KDT > WEB' 카테고리의 다른 글
240408 Web - TourWeb 2 (0) | 2024.04.08 |
---|---|
WEB - 롬복2 (0) | 2024.04.04 |
WEB - 테스트 1, 롬복 1 (0) | 2024.04.03 |
240328 Web - 보안 6 (0) | 2024.03.28 |
240326 WEB - 보안 5 (0) | 2024.03.26 |