5. 게시글 읽기

5.1 데이터 조회 과정

 

데이터 조회

DB에 저장된 데이터를 웹 페이지에 출력하는 과정

사용자가 웹 페이지 URL을 요청하면 서버의 컨트롤러가 해당 URL을 찾아 repository에 전달, DB에서 데이토 조회를 요청

이후 해당 데이터를 entity로 변환해 뷰 템플릿으로 전달

 

5.2 단일 데이터 조회하기

 

URL 요청받기

DB에 저장한 데이터를 웹 페이지에서 확인하기 위해서는 해당 출력 페이지에 접속, URL 요청이 필요

 

컨드롤러

조회할 데이터가 Article인 경우 ArticleController에 코드를 추가

 

@GetMapping( )

ULR 요청을 받기 위해 기존 코드 맨 아래에 작성하는 어노테이션

괄호 안에는 URL 주소를 입력하고 ULR 중괄호 안에는 사용할 변수를 입력

ex) @GetMapping("/articles/{id}")

 

show( )
URL 요청을 받아 수행하는 메서드로 매개변수로 ULR의 변수를 가져와 사용

 

@PathVariable

URL 요청으로 전달된 전달값을 컨트롤러의 매개변수로 가져오는 어노테이션

@GetMapping("/articles/{id}")
public String show(@PathVariable Long id){
    return "";
}

 

데이터 조회

@Autowired
private ArticleRepository articleRepository;

 

findBy{ }( )

특정 변수를 조회해 DB에서 해당 데이터를 불러오는 역할

Article articleEntity = articleRepository.findById(id);

 

모델에 데이터 등록

public String show(@PathVariable Long id, Model model){
(중략)
}

: 모델 사용을 위해 show( ) 메서드의 매개변수로 model 객체를 설정

model.addAttribute("article", articleEntity);

: addAttribute( ) 메서드를 통해 모델에 데이터 등록

 

뷰 페이지 반환

return "directory/filename";

: 디렉터리 내에 저장된 파일명으로 뷰 페이지를 반환

 

@NoArgsConstructor

기본 생성자 코드를 작성하지 않아도 자동으로 사용할 수 있도록 하는 롬복

 

5.3 데이터 목록 조회하기

 

단일 데이터

조회 시 repository가 entity를 반환하지만, 테이터 목록을 조회하는 경우 entity의 묶음인 리스트를 반환

 

findAll( )

repository 내에 있는 모든 데이터를 가져오는 메서드

public interface ArticleRepository extends CrudRepository<Article, Long> {
    @Override
    Iterable<Article> findAll();
}

 

데이터 등록

@GetMapping("/articles")
public String index(Model model){
    List<Article> articleEntityList = articleRepository.findAll();

    model.addAttribute("articleList", articleEntityList);

    return "";
}

: model.addAttribute( ) 메서드를 이용해 articleEntityList 등록

 

뷰 페이지 설정

디렉터리 내에 mustache 파일을 생성해 헤더, 푸터를 작성하고 이를 뷰 페이지로 설정

{{>layouts/header}}

<table class="table">
    <thead>
    <tr>
        <th scope="col">Id</th>
        <th scope="col">Title</th>
        <th scope="col">Content</th>
    </tr>
    </thead>
    <tbody>
    {{#articleList}}
        <tr>
            <th>{{id}}</th>
            <td>{{title}}</td>
            <td>{{content}}</td>
        </tr>
    {{/articleList}}
    </tbody>
</table>

{{>layouts/footer}}