드디어 회원 웹 기능을 구현하는 과정의 마지막 단계에 도달했다.
오늘은 웹 기능 중 회원 조회를 하는 기능을 구현해보았다.
회원 웹 기능 - 조회
지난 시간에 POST 방식을 통해 form을 전달해서 회원을 등록할 수 있도록 회원 가입 기능을 만들었다. 이제 회원 가입이 완료된 회원들의 목록을 보여주는 회원 목록 기능을 구현해볼 것이다. 일단 단순히 조회의 기능을 구현할 것이므로 Get방식을 사용해야 할 것이다.
MemberController
에 조회를 위한 다음 메소드를 추가한다.
@GetMapping("/members")
public String list(Model model) {
List<Member> members = memberService.findMembers();
model.addAttribute(attributeName: "members", members);
return "members/memberList";
}
그리고 나면 templates를 먼저 불러오기 때문에 항상 해오던 것처럼 템플릿 파일을 먼저 생성해야한다. templates 디렉토리밑에 html 파일을 생성하고 memberList.html
로 네이밍한다.
/members/memberList.html
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<body>
<div class="container">
<div>
<table>
<thead>
<tr>
<th>#</th>
<th>이름</th>
</tr>
</thead>
<tbody>
<tr th:each="member : ${members}">
<td th:text="${member.id}"></td>
<td th:text="${member.name}"></td>
</tr>
</tbody>
</table>
</div>
</form>
</div>
</body>
</html>
이제 실행시켜보자.
다음과 같이 홈 화면에서 회원가입을 누르고
spring1과 spring2를 각각 등록버튼을 눌러 등록해보았다. 그 후, 홈 화면에서 회원 목록을 눌러보면 다음과 같이 우리가 등록했던 spring1과 spring2가 등록된 것을 볼 수 있다.
페이지 소스 보기를 통해 코드를 더 자세히 살펴보면 다음과 같이 spring1과 spring2가 렌더링 되어 있는 것을 알 수 있다.
자, 그렇다면 작동원리는 무엇일까? 우선 memberList.html
에서 ${members}
를 주목해보자. ${ }는 모델 안의 값을 꺼낼 때 사용했었다. MemberController
에서 model
을 우리가 어떻게 구현했었냐면 model.addAttribute("members", members);
와 같이 구현했었다. 그리고 members 안에는 모든 회원을 list로 담아놓게 했다. 그런 후에,
<tr th:each="member : ${members}"> // 객체 꺼냄
<td th:text="${member.id}"></td> // 꺼낸 객체의 id 출력
<td th:text="${member.name}"></td> // 꺼낸 객체의 name 출력
th
(loop를 돌게 하는 thymeleaf 문법) 를 통해 loop를 돌면서 로직을 실행시킬 때, 첫 번째 객체를 꺼내서 멤버에 담고 객체의 id를 출력하고, name을 출력하면서 종료된다. 여기서 id는 getter, setter 접근 방식 (다른 말로는 접근자 프로퍼티, access property) 으로 Member
class의 getId
, getName
에 접근해서 값을 가져오게 된다.
지금까지의 과정을 통해 회원 웹 기능을 모두 구현하고 마무리했다. 화면상 (View) 으로 사용자들에게 입력을 받고 입력받은 데이터를 컨트롤러 (Controller) 를 통해 모델 (Model) 에 업데이트 시키고, 모델은 업데이트 된 내용을 사용자들에게 다시 보여준다 (View). 이 모든 일련의 과정들이 우리가 지금까지 구현한 MVC 패턴 구조이다.
(출처:XESCHOOL)
그렇다면 이렇게 해서 백 엔드 서버 구현은 끝난 것일까? NOPE
우리가 만든 server를 셧다운했다가 다시 부팅하게 되면
이렇게 우리가 등록했던 회원들이 온데간데 없이 사라져 있는 것을 볼 수있다....
왜 그럴까? 우리가 저장했던 회원 목록은 메모리에 저장한 것이기 때문이다. 예전 컴퓨터구조? 시간에 배웠던 RAM/ROM 개념과 똑같다. RAM은 컴퓨터를 재부팅하게 되면 사라지게 되는 휘발성이 강한 임시 메모리인데 그런 곳에 저장한다면 남아있을리가 없다.
그래서 우리는 ROM. 즉, 데이터베이스(DB) 에 이를 저장해서 반영구적으로 사용해야할 것이다. 다음 시간부터는 스프링이 DB에 접근하는 방법과 기술들, 개념 등을 학습할 계획이다.