Chapter 5. 웹 프로젝트 생성

[환경]

Windows 10

Eclipse Photon

JDK 1.8

Tomcat 9

웹 프로젝트를 생성해보겠습니다.

필자는 동적 웹 프로젝트를 생성할 것이므로, New 항목의 Dynamic Web Project를 클릭합니다.

프로젝트 이름을 helloWorld로 기입합니다.

Generate web.xml deployment descriptor를 체크하면, web.xml도 생성해주니 클릭 후 Finish를 클릭합니다.

프로젝트가 생성되면, 아래와 같은 구조를 확인할 수 있습니다.

웹 프로젝트의 구조를 살펴보면,

helloWorld는 웹 어플리케이션의 이름을 나타냅니다.

WebContent라는 기본 디렉토리 안에 여러 html, css, js 등이 위치할 수 있습니다.

WEB-INF 디렉토리는 웹 어플리케이션에 대한 정보들이 위치할 곳이고, 특이한 점은 외부에서 접근할 수 없는 영역입니다.

ex) http://127.0.0.1/helloWorld/WEB-INF/web.xml

만약, web.xml이 WEB-INF 디렉토리가 아닌 곳에 위치해있다면, URL 호출 시 브라우저에서 xml 설정 정보를 확인할 수 있게 됩니다.

WEB-INF/lib 디렉토리는 JDBC 관련 드라이버, 프레임워크 관련 jar 같은 라이브러리가 위치할 곳입니다.

WEB-INF/web.xml 파일은 배치 지시자(deployment descriptor)로 환경과 관련된 설정 파일입니다.

웹 브라우저에 나타낼 html을 생성해보겠습니다.

WebContent라는 기본 디렉토리에는 html 등의 파일이 저장된다 하였으므로, WebContent에 다음과 같이 html 파일을 생성합니다.

필자는 HelloWorld.html로 생성하였습니다.

생성된 html에 다음과 같이 원하는 문구를 html 문법에 맞게 작성합니다.

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Hello</title>
</head>
<body>
Hello World!!
</body>
</html>

코드는 모두 작성하였으니 Tomcat이라는 컨테이너를 이클립스에 연동해두면 편하게 시작/종료를 할 수 있고,

작성할 html을 브라우저로 볼 수 있는 환경이 갖춰지니 톰캣을 연동하겠습니다.

이클립스 하단 탭에 살펴보면, Servers 탭을 확인할 수 있습니다.

'No servers are available. Click this link to create a new server...'을 클릭 후 Tomcat v9.0을 클릭하여 다음으로 이동합니다.

톰캣이 설치된 홈 디렉토리를 지정하고, JRE를 1.8 이상으로 설정한 뒤 완료합니다.

참고로, Tomcat 9.0은 java 8 이상을 충족시켜야 합니다.

Servers 탭에 정상적으로 등록됐는지 확인합니다.

Project Explorer에서도 추가된 Tomcat 관련 설정 파일들을 확인할 수 있습니다.

(개인 PC의 Tomcat 디렉토리가 이클립스에 연동된 것이므로 참고바랍니다.)

이제 helloWorld 프로젝트를 Tomcat에 추가시켜 보도록 하겠습니다.

Servers 탭에 등록된 톰캣에서 'Add and Remove...'를 클릭합니다.

Available에 필자가 만들었던, helloWorld를 Add 버튼을 통해 Configured로 옮긴 뒤 완료합니다.

마찬가지로 톰캣 서버에 정상 등록이 됐다면, 아래 사진처럼 프로젝트가 추가된 것을 확인할 수 있습니다.

재생버튼을 눌러 톰캣을 실행합니다.

Console 탭에 에러 로그가 발생하지 않고, 정상 실행됐다면 성공입니다.

이전에 작성했던, HelloWorld.html을 호출해보기 위해서는 아래 사진과 같이 server.xml을 확인합니다.

server.xml 파일 내용에 <Host> 태그내에 Context가 존재하는데, 하나의 웹 애플리케이션이 실행될 때 하나의 Context가 생성됩니다.

컨텍스트의 이름은 프로젝트 이름(helloWorld)과 동일하게 자동 생성됩니다.

Context 태그 내에 요소에 대한 자세한 설명은, 보다 정확한 설명은 구글링을 통해 확인바랍니다.

path 요소는 웹 브라우저에서 요청할 때 사용되는 이름입니다.

path 내용을 확인 후 브라우저에서 다음과 같이 호출해봅시다.

http://127.0.0.1/helloWorld/HTML파일명

의도한 대로 html 페이지가 보여졌다면, 성공입니다.

'🌳 Language > 🍏 JSP' 카테고리의 다른 글

Chapter 4. IDE 설치 (Eclipse Photon) (0)	2022.03.06
Chapter 3. Tomcat 9 설치 (0)	2022.03.06
Chapter 2. JAVA 환경변수 설정 (0)	2021.01.24
Chapter 1. JDK 1.8 설치 (0)	2021.01.24

내 블로그 - 관리자 홈 전환	`Q` `Q`
새 글 쓰기	`W` `W`

글 수정 (권한 있는 경우)	`E` `E`
댓글 영역으로 이동	`C` `C`

이 페이지의 URL 복사	`S` `S`
맨 위로 이동	`T` `T`
티스토리 홈 이동	`H` `H`
단축키 안내	`Shift` + `/` `⇧` + `/`

Chapter 5. 웹 프로젝트 생성

'🌳 Language > 🍏 JSP' 카테고리의 다른 글

티스토리툴바

개인정보

단축키

내 블로그

블로그 게시글

모든 영역