회원관리 웹 애플리케이션 - 3 (MVC)

junheelee·2022년 10월 1일
0

SpringMVC

목록 보기
7/19

📋 MVC 패턴의 등장

앞서 회원관리 웹 애플리케이션 1, 2에서 살펴본 방식, 서블릿, JSP만으로 비즈니스 로직 구현시에 서블릿과 JSP가 너무 많은 역할을 하게 된다. 또, UI 변경과 HTML 수정시에도 하나하나 수정해야하는 번거로움이 발생한다.

📋 MVC 패턴이란?

Model + View + Controller
JSP로 처리하던 것을 Controller과 view의 영역으로 서로 역할을 나눈 것을 말한다.

📌 MVC의 역할

Controller :HTTP의 요청을 받아 파라미터 검증, 비즈니스 로직 실행, View에 전달하여 결과 데이터를 조회 후 모델에 담는 역할
Model : 뷰에 출력할 데이터를 담는 그릇. View가 필요한 데이터를 모두 Model에 담아 전달해주기 때문에 View에서 비즈니스 로직과 데이터 접근에 대해 몰라도 된다. 결론적으로 Model은 화면 렌더링에 집중하게 된다.
View : Model에 담겨 있는 데이터를 활용하여 화면을 그리는 일에 집중 HTML을 생성하는 부분을 의미

참고

절대경로: / 로 시작
상대경로: / 로 시작하지 않음

🪴 회원등록

회원등록 폼 - view

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
</head>
<body>
<!-- 상대경로 사용, [현재 URL이 속한 계층 경로 + /save] -->
<form action="save" method="post">
    username: <input type="text" name="username" />
    age: <input type="text" name="age" />
    <button type="submit">전송</button>
</form>

</body>
</html>

회원등록 - Controller

package hello.servlet.web.servletmvc;

import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

@WebServlet(name = "mvcMemberFormServlet", urlPatterns = "/servlet-mvc/members/new-form")
public class MvcMemberFormServlet extends HttpServlet {

    @Override
    protected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        /**
         * /WEB-INF 이 경로 안에 있으면 직접 JSP 호출 할 수 없음
         * MVC 특징인 controller를 통해 JSP호출
         */
        String viewPath = "/WEB-INF/views/new-form.jsp";

        RequestDispatcher dispatcher = req.getRequestDispatcher(viewPath);

        //다른 서블릿이나 JSP로 이동할 수 있는 기능. 서버 내부에서 다시 호출 발생
        dispatcher.forward(req, resp);
    }
}

🪴 회원저장

회원저장 - Controller

package hello.servlet.web.servletmvc;

import hello.servlet.domain.member.Member;
import hello.servlet.domain.member.MemberRepository;

import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

@WebServlet(name = "mvcMemberSaveServlet", urlPatterns = "/servlet-mvc/members/save")
public class MvcMemberSaveServlet extends HttpServlet {

    //MemberRepository 객체 생성
    //Singleton을 보장하기 때문에 직접 생성이 아니라 객체 호출로 사용
    private MemberRepository memberRepository = MemberRepository.getInstance();

    @Override
    protected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {

        String username = req.getParameter("username");
        int age = Integer.parseInt(req.getParameter("age")); //웹에서 전송 받은 데이터 형식을 정수형으로 반환

        //웹에서 전송받은 데이터를 저장 로직
        Member member = new Member(username, age);
        System.out.println("member = " + member);
        memberRepository.save(member);

        //데이터 보관
        //request 객체에 데이터를 보관하여 뷰에 전달 
        req.setAttribute("member", member);

        String viewPath = "/WEB-INF/views/save-result.jsp";
        RequestDispatcher dispatcher = req.getRequestDispatcher(viewPath);
        dispatcher.forward(req, resp);
    }
}

회원저장 - View

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="UTF-8">
</head>
<body>
성공
<ul>
  <li>id=${member.id}</li>
  <li>username=${member.username}</li>
  <li>age=${member.age}</li>
</ul>
<a href="/index.html">메인</a>
</body>
</html>

📋 TIPS

JSP는 ${ }문법 제공: request의 attribute에 담긴 데이터를 편리하게 조회

profile
Study of beginner dev

0개의 댓글