Spring MVC/01.WebProgramming

02. Hello Servlet

  • -

이번 포스트에서는 간단한 Web Application을 만들고 Servlet의 동작을 이해해보자.

 

환경 설정 및 프로젝트 생성

 

WAS 설치

웹 애플리케이션 개발을 위해서는 가장 먼저 WAS가 필요하다. 우리는 WAS로 Tomcat 10.X를 사용해보자. 다음 링크로 이동해서 Tomcat을 다운로드 한다.

https://tomcat.apache.org/download-10.cgi

 

Apache Tomcat® - Apache Tomcat 10 Software Downloads

Welcome to the Apache Tomcat® 10.x software download page. This page provides download links for obtaining the latest version of Tomcat 10.1.x software, as well as links to the archives of older releases. Unsure which version you need? Specification versi

tomcat.apache.org

 

페이지 하단의 Binary Distributions에서 사용하는 OS에 적합한 버전으로 다운로드 후 적절한 곳에 압축을 해제하면 된다. 

mac os에서는 zip 버전을 받으면 된다. mac에서는 추가로 tomcat에 대한 실행 권한을 부여해야 한다.
tomcat의 bin 폴더로 이동해서 terminal 실행 후  아래 명령을 실행해주자.
❯ sudo chmod -R 777 ./catalina.sh
Password: os의 사용자 비밀번호 입력​

 

프로젝트 생성 및 환경 구성

다음으로 intellij에서 Servlet을 이용한 웹 애플리케이션 개발을 위한 [Jakarta EE 프로젝트]를 만드는 방법에 대해 알아보자.

먼저 intellij -> new Project 화면에서 다음과 같이 작성한다.

Jakarta EE 프로젝트 생성

  1. Jakarta EE를 선택한다.
  2. Name: 프로젝트 이름을 입력한다.
  3. Location: 프로젝트 저장 위치를 지정한다.
  4. Template: 프로젝트의 template를 선택하는데 drop down menu를 통해 Web Application을 선택한다.
  5. Languate: Java를 선택한다.
  6. Build system: Maven을 선택한다.
  7. Application server: [New...] 버튼을 이용해 New Server 설정 후 [Tomcat Server]를 선택하고 다음 화면에서 Tomcat Home에 앞서 설치했던 Tomcat을 선택한다.

[Next]를 선택 후 Dependencies > Specifications > Servlet이 체크되었는지 확인하고 [Create]버튼을 클릭한다.

 

프로젝트 구조

프로젝트의 pom.xml 파일을 살펴보면 jdk 버전이 11로 되어있는데 17 버전으로 수정해주자.

<properties>
    <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
    <maven.compiler.target>17</maven.compiler.target>
    <maven.compiler.source>17</maven.compiler.source>
    <junit.version>5.10.0</junit.version>
</properties>

maven 기반의 웹 애플리케이션은 기본적으로 다음과 같은 폴더 구조를 갖는다.

web application의 폴더 구조

  • src/main/java: Servlet 등 java 파일이 위치한다.
  • src/main/resources: xml 등 자바 이외의 소스들이 위치하며 src/main/java의 코드들과 함께 classpath로 관리된다.
  • src/main/webapp: html이나 jsp 등 웹 리소스들이 위치하는 곳으로 특히 WEB-INF/web.xml은 web application의 다양한 설정이 저장될 수 있다.(최근에는 잘 사용하지 않는다.)

 

애플리케이션 분석 및 실행

 

소스코드 확인

생성된 프로젝트에서 확인할 파일은 2가지이다. 

먼저 src/main/webapp/index.jsp파일을 살펴보자.

<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<!DOCTYPE html>
<html>
<head>
    <title>JSP - Hello World</title>
</head>
<body>
  <h1><%= "Hello World!" %></h1>
  <br/>
  <a href="hello-servlet">Hello Servlet</a>
</body>
</html>

위 파일은 애플리케이션을 실행하면 처음 화면에 보이는 파일(welcome file)로 html 기반으로 작성된 JSP라는 것이다. 중간에 <a> 태그의 href 속성 값이 'hello-servlet'이라고 되어있다는 점을 기억하자.

두 번째로 살펴볼 파일은 src/main/java/com.doding.simpleweb.HelloServlet이다. Servlet을 만들 때는 HttpServlet을 상속받고 @WebServlet을 통해서 사용자가 어떻게 호출했을때 동작할 것인지를 등록한다.

@WebServlet(name = "helloServlet", value = "/hello-servlet")
public class HelloServlet extends HttpServlet {
  private String message;

  public void init() {        message = "Hello World!";    }

  public void doGet(HttpServletRequest request,HttpServletResponse response) throws IOException {
    response.setContentType("text/html");
    PrintWriter out = response.getWriter();
    out.println("<html><body>");             // 문자열로 HTML을 만든다고? 답답하다.ㅜㅜ
    out.println("<h1>" + message + "</h1>");
    out.println("</body></html>");
  }

  public void destroy() {    }
}

@WebServlet 애너테이션의 value에 등록된 'hello-servlet'을 어디서 봤을까? 바로 index.jsp의 <a> 태그의 href 속성에 선언된 값으로 HelloServlet에 대한 URL Mapping 값이다. 결과적을 index.jsp에서 link를 클릭하면 hello-servlet이라는 URL을 호출하는데 이 URL에 연결된 Servlet이 바로 HelloServlet이다.

서블릿 호출

코드 하단에 보면 PrintWriter를 통해 클라이언트로 내려보낼 html 코드를 한땀한땀 만들고 있는 것이 보인다. "참 답답하다" 라는 생각이 들면 지금은 충분하다. html을 자바 영역에서 만들다 보니 이런 문제가 발생한 것이다. 이처럼 Servlet에서는 자바 코드를 이용한 business logic과 html을 이용한 presentation logic이 섞여서 등장하는 문제가 있다. 이를 개선하기 위해서 사용하는 것이 JSP이다.

실행하기

프로젝트를 실행하기 위해서는 상단 톰켓 아이콘 우측의 실행 버튼을 클릭하면 된다.

톰켓이 실행되면 하단의 Service 탭에서 톰켓의 실행 상태를 콘솔에서 확인할 수 있다.

그럼 톰켓 위에서 우리가 만든 애플리케이션인 simpleWeb이 동작하는 것을 알 수 있다. 그리고 동시에 기본 브라우저가 실행되면서 url에 [http://localhost:8080/simpleWeb_war_exploded/]가 입력되고 위에서 살펴본 index.jsp가 실행되는 것을 볼 수 있다. 

여기서 localhost:8080까지가 tomcat의 경로 즉 container root이고 simpleWeb_war_exploded가 tomcat에 설치된 application 즉 context이다. intellij가 생성한 context 이름이 너무 복잡하기 때문에 적절한 이름으로 바꿔 쓰는게 좋다.

[Tomcat Server]에서 [Tomcat 10.x]를 우클릭해서 [Edit Configuration]-[Deployment]를 순차적으로 선택하고 [Deploy at the server startup]에서 프로젝트를 선택 후 하단의 Application Context를 /simpleweb으로 변경해주자.

이제 localhost:8080/simpleweb가 context root이고 뒤에 아무 것도 추가하지 않았을 때는 welcome file이라는 것이 동작하는데 index.jsp가 welcome file의 하나이다.

http://localhost:8080/simpleweb/

 

[Hello Servlet] 링크를 클릭하면 HelloServlet이 동작해서 다음과 같은 화면이 출력되면 성공이다.

http://localhost:8080/simpleweb/hello-servlet

주소창을 살펴보면 /hello-servlet이 추가된 것을 볼 수 있는데 HelloServlet에 설정된 @WebServlet의 value 속성이다.

페이지가 제대로 보인다면 기본적인 환경 설정 및 개발 준비가 완료된 것이다.

'Spring MVC > 01.WebProgramming' 카테고리의 다른 글

06. MVC와 Model2  (0) 2024.08.20
05. JSP  (0) 2024.08.12
04. Front Controller Pattern  (0) 2024.08.08
03. Servlet 분석  (0) 2024.08.05
01. 웹 프로그래밍 개요  (0) 2023.12.09
Contents

포스팅 주소를 복사했습니다

이 글이 도움이 되었다면 공감 부탁드립니다.