미니 프로젝트/To Do List

[Java] TodoList ③ TodoRegisterController(DB 연결 전)

웹개발자(진) 2024. 5. 14. 15:56
반응형
잡담

메인은 TodoListController를 이용했고 이제 할 일을 사용자가 추가하는 기능을 만들어 보려고 합니다. 해당 내용을 구성하기 위해서는 우선 메인화면에서 버튼을 통해 등록할 수 있는 화면으로 넘어가게 됨으로 등록을 위한 JSP가 필요하고 GET방식을 통해서 JSP를 불러옵니다. 해당 JSP에서 사용자의 입력을 받은 데이터 값을 POST방식으로 Controller에 전송하고 TodoRegisterController에서 받은 데이터를 TodoService에 있는 register 메서드를 통해 메모리에 추가하게 됩니다. 마지막으로 sendRedirect 통해 메인으로 돌아가게 됩니다.


 

1. TodoRegisterController

우선 해당 추가하는 페이지를 받아오기 위해 GET방식을 통해 /todo/register url을 접속할 시 register.jsp가 열리게 코딩합니다. POST방식을 통해 register.jsp에서 입력받은 input 데이터를 변수로 지정하고 TodoDto 객체에 담아서 TodoService에서 메모리에 데이터를 추가하고 리다이렉트를 통해 main으로 이동합니다.

package org.zerock.demo3.todo;

import jakarta.servlet.RequestDispatcher;
import jakarta.servlet.ServletException;
import jakarta.servlet.annotation.WebServlet;
import jakarta.servlet.http.HttpServlet;
import jakarta.servlet.http.HttpServletRequest;
import jakarta.servlet.http.HttpServletResponse;
import org.zerock.demo3.todo.dto.TodoDto;
import org.zerock.demo3.todo.service.TodoService;

import java.io.IOException;
import java.time.LocalDate;

@WebServlet(name = "todoRegisterController", urlPatterns = "/todo/register")
public class TodoRegisterController extends HttpServlet {
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        // ToDo 등록 페이지로 포워딩
        RequestDispatcher dispatcher = req.getRequestDispatcher("/WEB-INF/todo/register.jsp");
        dispatcher.forward(req, resp);
    }

    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        // 요청의 문자 인코딩을 UTF-8로 설정
        req.setCharacterEncoding("UTF-8");

        // 요청으로부터 ToDo의 정보를 가져옴
        String name = req.getParameter("title");
        LocalDate dueDate = LocalDate.parse(req.getParameter("dueDate"));
        boolean finished = Boolean.parseBoolean(req.getParameter("finished"));

        // ToDoDto 객체 생성
        TodoDto todoDto = new TodoDto(name, dueDate, finished);
        
        // ToDo 등록 서비스 호출
        TodoService.INSTANCE.register(todoDto);

        // ToDo 목록 페이지로 리다이렉션
        resp.sendRedirect("/todo/list");
    }
}

 


 

2. TodoService.register()

이 코드는 ToDo 서비스를 제공하는 싱글톤 Enum 클래스입니다. ToDoDto 객체를 등록하고 관리하는 데 사용됩니다.

package org.zerock.demo3.todo.service;

import org.zerock.demo3.todo.dto.TodoDto;

import java.time.LocalDate;
import java.util.ArrayList;
import java.util.List;
import java.util.stream.Collectors;
import java.util.stream.IntStream;

public enum TodoService {
    INSTANCE;
    private List<TodoDto> todoList = new ArrayList<>();
    private int count = 0;
    
    public void register(TodoDto dto) {
        System.out.println("Register Todo " + dto);
        dto.setTno(count++);
        todoList.add(dto);

    }
}

위의 코드는 dto를 증가시켜 primary-key처럼 활용하고 있습니다. DB에 연결하게 되면 count값을 증가시켜 tno로 사용할 필요 없이 기본 기능을 이용할 수 있습니다.

  1. 일련번호(Sequence) 사용: 데이터베이스에 일련번호를 저장하고, ToDo를 추가할 때마다 이 일련번호를 증가시키는 방식입니다. 데이터베이스에서 일련번호를 관리하므로 중복이나 충돌 없이 고유한 값을 생성할 수 있습니다.
  2. 자동 증가(Auto-increment) 필드 사용: 일부 데이터베이스 시스템은 테이블의 특정 열을 자동으로 증가시키는 기능을 제공합니다. 이를 사용하면 데이터베이스가 ToDo를 추가할 때마다 해당 열의 값을 자동으로 증가시켜 고유한 값을 생성합니다.

일련번호(Sequence)를 사용하는 방법은 데이터베이스에 대한 변경이 필요하며, 데이터베이스에 대한 지식이 필요합니다. 자동 증가(Auto-increment) 기능은 일부 데이터베이스 시스템에서 기본적으로 제공됩니다.

 


 

3. register.jsp

name 속성을 통해 HTML 폼 요소에서 입력한 데이터를 서버로 전송할 수 있습니다. 이 데이터는 HTTP 요청의 파라미터로 전달되어 서버에서 처리됩니다. 주로 POST 또는 GET 메서드를 사용하여 데이터를 전송합니다. 여기서는 form문에 action을 통해 해당하는 url로 이동하고 method를 post방식으로 정하여 TodoRegisterController에서 post에 대한 url로 받습니다.

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
</head>
<body>
<h1>Todo 등록</h1>
<form action="/todo/register" method="post">
    <label for="title">Title:</label>
    <input type="text" id="title" name="title" required><br>
    <label for="dueDate">Due Date (yyyy-MM-dd):</label>
    <input type="date" id="dueDate" name="dueDate" required><br>
    <input type="checkbox" id="finished" name="finished" hidden><br>
    <button type="submit">등록</button>
    <button id="main-button"><a href="http://localhost:8080/todo/list">메인으로</a></button>
</form>
</body>
</html>

 


 

4. 출력

추가버튼을 통해 todo/register로 이동합니다.

추가 전 main화면

todo/reigster에서 title과 date값을 입력하고 등록버튼을 눌러 값을 등록해 봅니다.

register.jsp

 

추가완료

 


 

글을 마치며

오늘은 TodoRegisterController를 통해 get방식으로 페이지를 불러오고 post방식으로 값을 받아와 JSP를 이용해 출력하는 방법을 알아보았습니다. tno값은 hidden으로 숨겨두고 index처럼 사용하고 있습니다. check 같은 경우는 default값이 false로 되어있고 나중에 완료하게 되면 checked를 통해 확인할 수 있습니다. 다음시간에는 수정하는 방법에 대해 알아볼 텐데요 수정은 해당 데이터 값을 출력하고 출력값에 대한 수정이 이루어지도록 만들 예정입니다. 한 jsp안에 기능을 여러 가지 넣어서 만들어 보도록 하겠습니다. jsp를 따로따로 만들어도 되지만 좀 더 효율적으로 만들어 볼까 합니다. 감사합니다.

반응형