[스프링 입문]회원 관리 예제 - 웹 MVC 개발

Hyeonjun·2022년 8월 15일

스프링입문

목록 보기

5/8

HomeController

@Controller
public class HomeController {

    @GetMapping("/")
    public String home(){
        return "home";
    }
}

컨트롤러에 “/”로 매핑된 것이 있다면, index.html은 무시됨.

Tomcat에서 요청을 받으면

스프링 컨테이너에 매핑된 것이 있는지 찾고, 매핑된 것이 있다면 컨테이너에서 return

없다면 정적 페이지가 존재하는지 확인

회원 웹 기능 - 등록

MemberController

@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:/";
}

createMemberForm.html

<div class="container">
  <form action="/members/new" method="post">
    <div class="form-group">
      <label for="name">이름</label>
      <input type="text" id="name" name="name" placeholder="이름을 입력하세요">
    </div>
    <button type="submit">등록</button>
  </form>
</div> <!-- /container -->

동작방식

GetMapping(”/members/new)를 확인하고, members/createMemberForm 페이지로 이동함.
createMemberForm에 있는 input에 이름을 입력하고, submit 버튼을 누르면
action을 통해 post 방식으로 “members/new”로 요청
PostMapping(”members/new”)로 이동
createMethod 호출됨.
이때, 스프링이 알아서 MemberForm에 있는 name에 값을 넣어줌.
이후 join()으로 저장.

MemberController

@GetMapping("/members")
public String list(Model model){
    List<Member> members = memberService.findMembers();
    model.addAttribute("members", members);
    return "members/memberList";
}

MemberList

<!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>