데이터 출력 화면(HTML) 만들기

Dami·2024년 1월 19일
0

SPRING

목록 보기
13/14
post-thumbnail

크게 설정 할 파일은 1. Controller, 2. template, 3.build.gradle 가 있다.
이미 Repository는 만들어져 있다고 가정한다.

1.Controller

QuestionController.java

package com.mysite.sbb.question;

import java.util.List;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;

import lombok.RequiredArgsConstructor;

@RequiredArgsConstructor
@Controller
public class QuestionController {

    private final QuestionRepository questionRepository;//레포지토리 인터페이스 참조

    @GetMapping("/question/list")
    public String list(Model model) {
        List<Question> questionList = this.questionRepository.findAll();
        model.addAttribute("questionList", questionList);
        return "question_list";
    }
}
  • @RequiredArgsConstructor : Lombok에서 제공하는 어노테이션으로 클래스에 필요한 생성자를 자동으로 생성하는 역할, final로 선언 되거나 @NonNull 어노테이션이 붙은 필드의 생성자를 생성한다.
    → 즉, private final QuestionRepository questionRepository;의 생성자를 자동으로 (내부적으로) 생성함.

     public QuestionController(QuestionRepository questionRepository) {
         this.questionRepository = questionRepository;
     }

    다시 말해, 내부적으론 이렇게 생성된 것

  • Model class : 이를 통해 데이터를 템플릿에 전달할 수 있다. → 자바 class와 template 간 연결 고리 역할이라 볼 수 있음. Model 객체에 값을 담아 두면 템플릿에서 이 값 사용 가능.
    따로 객체를 생성할 필요X. Controller의 method에 매개변수로 지정만 해두면 알아서 Model 객체 생성함.

  • return "question_list";: template의 이름이 question_list.html 그냥 문자열을 화면에 띄울 때 쓰던 @ResponseBody은 필요가 없어진다.

2. template

테이블 구조로 데이터를 표기함.
templates/question_list.html

<table>
    <thead>
        <tr>
            <th>제목</th>
            <th>작성일시</th>
        </tr>
    </thead>
    <tbody>
        <tr th:each="question : ${questionList}">
            <td th:text="${question.subject}"></td>
            <td th:text="${question.createDate}"></td>
        </tr>
    </tbody>
</table>
  • th:each="qeustion : ${questionList}"
    th : 타임 리프에서 사용하는 속성 → 자바 코드와 연결 됨
    QuestionController.java에서 Model에 저장한 questionList${questionList}로 일겅 와 question 변수에 대입한다. 그 후 list의 개수<tr> ... </tr> 로 출력 반복
  • Timeleaf 속성

    • if, else if
      th:if="${question != null}"
    • 반복문
      th:each="question : ${questionList}"
      th:each="question, loop : ${questionList}"
    • text
      th:text="${question.subject}"
      <td>[[${question.subject}]]</td>

3. build.gradle

dependencies {

    implementation 'org.springframework.boot:spring-boot-starter-thymeleaf'
    implementation 'nz.net.ultraq.thymeleaf:thymeleaf-layout-dialect'
}

타임리프를 사용하기 위해 파일을 수정한다.

출처 : 점프 투 스프링부트

0개의 댓글