반응형
회원 웹 기능 - 홈 화면 추가
이 전에 구현했던 회원 기능의 홈 화면을 추가한다.
@Controller
public class HomeController {
@GetMapping("/")
public String home() {
return "home";
}
}위와 같이 컨트롤러를 구현한다.
이 전에 구현했던 wellcome page가 나오지 않는 이유는 요청에 대한 우선순위 때문이다.
요청이 왔을 때 컨트롤러를 먼저 체크하고 해당하는 것이 없으면 정적 파일을 체크하는 것이다.
다음과 같이 홈이 구성된다.
회원 웹 기능 - 등록
회원의 이름을 받아서 등록하는 부분을 구현한다.
@GetMapping("/members/new")
public String createForm() {
return "/members/createMemberForm";
}
@PostMapping("/members/new")
public String create(MemberForm form) {
Member member = new Member();
member.setName(form.getName());
memberService.join(member);
return "redirect:/";
}기존 MemberController에 구현한다.
MemberForm파일을 생성하고 get/set을 구현한다.
2개의 방식이 있는데 Get방식은 조회할 때, Post방식은 데이터를 전달할 때 사용한다.
그래서 url이 같지만 방식이 달라진다.
"회원 가입"을 누르면 다음과 같이 구성된다.
html파일 내부의 폼 태그를 통해서 데이터를 받게 된다.
회원 웹 기능 - 조회
등록 기능을 통해 회원의 이름을 등록했을 때 조회하는 기능을 구현한다.
@GetMapping("/members")
public String list(Model model) {
List<Member> members = memberService.findMembers();
model.addAttribute("members", members);
return "/members/memberList";
}
여기서는 타임리프가 사용되는데 타임리프는 " HTML 파일 안에 자바 데이터를 넣는 도구"이다.
그래서 이 전에 구현한 findMembers를 활용한 member객체의 데이터를 HTML로 전달하기 위해 Model을 사용한다.
<!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>
</div> <!-- /container -->
</body>
</html>HTML파일 내에서 $가 사용된 부분이 타임리프가 사용된 부분이다.
spring1과 spring2라는 회원을 등록하고 조회하면 다음과 같은 구성이 나타나게 된다.
반응형
'WINK-(Web & App) > Spring Boot 스터디' 카테고리의 다른 글
| [2025 1학기 스프링부트 스터디] 최비성 #5주차 (0) | 2025.05.10 |
|---|---|
| [2025 1학기 스프링부트 스터디] 최비성 #4주차 (0) | 2025.05.10 |
| [2025 1학기 스프링부트 스터디] 장민주 #4주차 (0) | 2025.05.06 |
| [2025 1학기 스프링부트 스터디] 여민호 #4주차 (0) | 2025.05.06 |
| [2025 1학기 스프링부트 스터디] 류현준 #3&4주차 (0) | 2025.05.06 |
