개발준비
이클립스에서 Dynamic Web Project 선택해서 새로운 프로젝트 생성
톰캣과 이클립스가 개발 시스템에 설치되어 있어야 하고 이클립스에는 WTP 플러그인이 설치되어 있어야 한다.
이클립스 버전에 따라 WTP 설치가 쉽지 않을 수 있는데
이런 경우는 WTP가 포함되어 있는 Eclipse IDE for Java EE Developers 를 새로 설치하고 아래를 따라하자.
여기서는 이크립스의 워크스페이스(workspace)를 C:/www 로 설정했다.
이클립스에서 New -- Dynamic Web Project 를 선택한다.
Project name: JSPProject
프로젝트 이름을 JSPProject 라고 하겠다.
여기에서는 이클립스와 톰캣을 연동하지 않을 것이다.
따라서 프록젝트 이름외의 설정은 디폴트로 둔다.
Content directory 역시 디폴트인 WebContent를 사용한다.
프로젝트가 생성이 완료된 다음에 개발을 편하게 하기 위해서 Build Path를 변경하다.
Package Explorer 뷰에서 프로젝트를 마우스로 선택하고
마우스 오른쪽 키를 클릭하여 아래 그림처럼 메뉴가 나타나도록 한다.
메뉴에서 Build Path, Configure Build Path... 를 차례로 선택한다.
이어지는 화면에서 Source 탭을 선택한다.
소스 화면 하단 Default output folder: 의 오른쪽의 Browse... 버튼을 클릭하면
Folder Selection 화면이 나타난다.
Folder Selection 화면의 Create New Folder... 버튼을 클릭하여 WEB-INF/classes 폴더를 그림처럼 생성한다.
WEB-INF/classes 폴더가 Default output 폴더가 되도록 설정한다.
Default output 폴더가 JSPProject/WebContent/WEB-INF/classes 인지 확인한다.
탐색기에서 본 프로젝트의 실제 디렉토리 구조이다.
참고로 Dynamic Web Project 로 생성했을 경우 JSPProject/build 란 폴더가 Default output 폴더로서 만들어진다.
하지만 이 문서에서는 Default output 폴더를 JSPProject/WebContent/WEB-INF/classes 로 변경했다.
따라서 build 란 폴더는 필요없으므로 지웠다.
톰캣에 JSPProject 웹 애플리케이션을 등록한다.
톰캣이 우리가 만든 JSPProject 웹 애플리케이션을 등록하고 서비스하도록 해야 한다.
아래와 같은 내용으로 파일명을 JSPProject.xml 으로 파일을 만들어서
CATALINA_HOME/conf/Catalina/localhost 에 저장한 다음
톰캣을 재실행한다.
<?xml version="1.0" encoding="UTF-8"?> <Context path="/JSPProject" docBase="C:/www/JSPProject/WebContent" reloadable="true"> </Context>
웹 애플리케이션과 JSPProjext.xml 파일에 이상이 없다면 톰캣은 JSPProject 애플리케이션을 등록하고
서비스할 것이다.
여기서 CATALINA_HOME 은 톰캣이 설치된 최상위 디렉토리를 말한다.
윈도우 시스템이고 톰캣 7을 설치했을 경우 CATALINA_HOME 은
C:\Program Files\Apache Software Foundation\Tomcat 7.0 이 될 것이고
JSPProject.xml 파일은 C:\Program Files\Apache Software Foundation\Tomcat 7.0\conf\Catalina\localhost
에 저장되어야 한다.
JSPProject.xml 내용중에 docBase 의 값이 C:/www/JSPProject 가 아님을 조심해야 한다.
WEB-INF 바로 위 디렉토리가 웹 애플리케이션의 최상위 디렉토리이기 때문이다.
이런 경우에는 톰캣에 등록하는 XML 파일에서 반드시 path 속성이 있어야 한다.
WEB-INF/web.xml
또 하나의 XML 파일이 필요한데 이름은 web.xml 이다.
web.xml 은 웹 애플리케이션 자체에 대한 설정파일이고 위치는 WEB-INF/web.xml 이다.
web.xml 파일을 만들때는 CATALINA_HOME/webapps 에 있는 있는 다른 웹 애플리케이션의 web.xml 파일을
참조해서 만들어야 한다.
톰캣 7인 경우는 아래 내용으로 web.xml 파일을 만들고
C:/www/JSPProject/WebContent/WEB-INF 폴더에 저장해도 된다.
<?xml version="1.0" encoding="ISO-8859-1"?>
<!--
Licensed to the Apache Software Foundation (ASF) under one or more
contributor license agreements. See the NOTICE file distributed with
this work for additional information regarding copyright ownership.
The ASF licenses this file to You under the Apache License, Version 2.0
(the "License"); you may not use this file except in compliance with
the License. You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
-->
<web-app xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd"
version="3.0"
metadata-complete="true">
</web-app>
테스트
톰캣이 JSPProject 를 정말로 등록하고 서비스하고 있는지 확인하는 테스트이다.
최상위 디렉토리에 test.html 파일을 만든다.
아래 그림처럼 WebContent 를 선택한 상태에서 마우스 오른쪽 버튼을 클릭한 후
New -- HTML File 를 차례로 선택한다.
http://localhost:8080/JSPProject/test.html 을 방문해서 톰캣이 웹 애플리케이션을 서비스하는지 확인한다.
8080은 톰캣이 사용하는 포트번호이다.
톰캣을 설치할 때 이 포트번호를 변경했다면 변경한 포트번호로 테스트해야 한다.
포트번호의 확인은 CATALINA_HOME/conf/server.xml 에서 할 수 있다.
<Connector port="8080" protocol="HTTP/1.1" connectionTimeout="20000" URIEncoding="UTF-8" redirectPort="8443" />
JSP 페이지
JSP디자인 다운로드
웹 프로그래밍 구성요소 중 JSP 만 따로 정리한다.
아래 순서대로 구현해 보려 한다.
| No | JSP | 기능 |
|---|---|---|
| 1 | /index.jsp | 사이트를 방문하면 처음 보이는 페이지,메인페이지 또는 홈페이지라고 한다. |
| 2 | /bbs/index.jsp | 게시판 모듈이 있는 디렉토리가 bbs 이다. 게시판 정책은 세우기 나름인데, 여기서는 로그인한 사용자만이 게시판을 사용할 수 있는 걸로 하겠다. 게시판 정책 그렇다면 메인 메뉴에서 BBS를 선택하면 로그인 페이지로 이동해야 한다. /bbs/index.jsp 는 로그인 화면이다. 회원가입을 간단하게 하기 위해 이메일을 ID로 사용하는 것으로 구현할 것이므로 bbs/index.jsp 에서 로그인하기 위해서는 이메일과 패스워드를 사용자에게 물을 것이다. 이메일과 비밀번호로 로그인을 처리하는 페이지는 login_proc.jsp 이다. |
| 3 | /bbs/inc/bbs-menu.jsp | 게시판 메인 메뉴에 대한 서브 메뉴 |
| 4 | /bbs/signup_form.jsp | 회원가입 양식,작성후 확인버튼 클릭하면 signup_proc.jsp 로 이동 |
| 5 | /bbs/signup_proc.jsp | 회원가입 처리 페이지로 데이터베이스에 회원정보 insert 후 로그인 페이지(bbs/index.jsp)로 이동 |
| 6 | /bbs/login_proc.jsp | 이메밀/비밀번호에 대한 회원정보가 있으면 세션 생성하고 bbs/list.jsp 페이지로 이동 |
| 7 | /bbs/inc/loginCheck.jsp | 로그인이 필요한 페이지마다 인클루드해야 하는 페이지로 로그인하지 않으면 로그인페이지로 이동 |
| 8 | /bbs/logout.jsp | 세션 삭제후 로그인 페이지(bbs/index.jsp)로 이동 |
| 9 | /bbs/list.jsp | 해당 게시판 목록 출력 |
| 10 | /bbs/write_form.jsp | 새글쓰기 양식, 작성 후 확인 버튼 클릭하면 처리페이지인 write_proc.jsp 로 이동 |
| 11 | /bbs/write_proc.jsp | 게시글을 데이터베이스에 추가한 후 목록으로 이동 |
| 12 | /bbs/view.jsp | 게시글 상세보기 |
| 13 | /bbs/deleteAttachFile.jsp | 상세보기 화면에서 첨부파일 이름 옆의 x 링크를 클릭하면 처리하는 페이지로 데이터베이스에서 첨부파일 레코드를 삭제한다. |
| 14 | /bbs/addComment.jsp | 데이터베이스에 덧글을 추가한 후 상세보기로 이동 |
| 15 | /bbs/updateComment.jsp | 데이터베이스에 덧글을 수정한 후 상세보기로 이동 |
| 16 | /bbs/deleteComment.jsp | 데이터베이스에 덧글을 삭제한 후 목록으로 이동 |
| 17 | /bbs/modify_form.jsp | 게시글 수정 양식, 수정 후 확인 버튼 클릭하면 처리 페이지인 modify_proc.jsp 로 이동 |
| 18 | /bbs/modify_proc.jsp | 게시글을 데이터베이스에서 수정 후 상세보기로 이동 |
| 19 | /bbs/delete_proc.jsp | 게시글을 데이터베이스에서 삭제 후 목록으로 이동 |
참고문서
http://www.java-school.net/jsp/
http://www.java-school.net/jdbc/
- 다음 : 데이터베이스 설계
