[Spring] 5.ํšŒ์› ๊ด€๋ฆฌ ์˜ˆ์ œ - ์›น MVC ๊ฐœ๋ฐœ

 

1.  ํšŒ์› ์›น ๊ธฐ๋Šฅ - ํ™ˆ ํ™”๋ฉด ์ถ”๊ฐ€

- ํ™ˆ ์ปจํŠธ๋กค๋Ÿฌ ์ถ”๊ฐ€

ใ„ด controller - HomeController

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

 

- ํ™ˆ ํ™”๋ฉด ๋งŒ๋“ค๊ธฐ

ใ„ด resource - templates - home.html

<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<body>
  <div class="container">
      <div>
        <h1>Hello Spring</h1> 
        <p>ํšŒ์› ๊ธฐ๋Šฅ</p>
        <p>
          <a href="/members/new">ํšŒ์› ๊ฐ€์ž…</a> 
          <a href="/members">ํšŒ์› ๋ชฉ๋ก</a>
        </p> 
      </div>
  </div> <!-- /container -->
</body>
</html>

* ๋จผ์ € ์š”์ฒญ์ด ์˜ค๋ฉด ๋งตํ•‘๋œ '/'์ด ์žˆ์Œ -> ๋ฐ”๋กœ ํ•ด๋‹น ์ปจํŠธ๋กค๋Ÿฌ ํ˜ธ์ถœ๋˜๊ณ  ๋๋‚จ

* static์— ์žˆ๋Š” index.html์€ ํ›„์ˆœ์œ„ (์ •์  ๋ฆฌ์†Œ์Šค์—์žˆ๋Š”)

 

2.  ํšŒ์› ์›น ๊ธฐ๋Šฅ - ๋“ฑ๋ก

- memberController์— ๋งตํ•‘ ์ถ”๊ฐ€

@Controller
public class MemberController {

  private MemberService memberService;
  
  @Autowired
  public MemberController(MemberService memberService) {
    this.memberService = memberService;
  }
  
  @GetMapping("/members/new")
  public String createForm() {
    return "members/createMemberForm";
  }
  
}

templates - members - createMemberForm.html

<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<body>
  <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 -->
</body>

Controller - MemberForm.class

public class MemberForm {
  private String name;
  
  public String getName() {
    return name;
  }
  
  public void setName(String name) {
    this.name = name;
  }
}

ํ™ˆ์ปจํŠธ๋กค๋Ÿฌ

  @PostMapping("/members/new")
  public String create(MemberForm form) {
    Member member = new Member();
    member.setName(form.getName());
    
    memberService.join(member);
    
    return "redirect:/";
  }

-> MemberForm (Argument Resolver์— ์˜ํ•ด์„œ ์ฒ˜๋ฆฌ)

     html์—์„œ name์†์„ฑ๊ฐ’๊ณผ MemberForm์˜ String name ์ด ์ผ์น˜ํ•˜๋ฉด MemberForm์— html์—์„œ post๋กœ ๋„˜๊ฒจ์ค€ ๊ฐ’์ด ๋“ค์–ด๊ฐ€๊ฒŒ๋จ

    (name = "name"  ๋”ฐ์˜ดํ‘œ ์•ˆ์˜ name)

 

3.  ํšŒ์› ์›น ๊ธฐ๋Šฅ - ์กฐํšŒ

- memberController์— ๋งตํ•‘ ์ถ”๊ฐ€

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

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>
    </div> <!-- /container -->
    </body>
    </html>
  • ๋„ค์ด๋ฒ„ ๋ธ”๋Ÿฌ๊ทธ ๊ณต์œ ํ•˜๊ธฐ
  • ๋„ค์ด๋ฒ„ ๋ฐด๋“œ์— ๊ณต์œ ํ•˜๊ธฐ
  • ํŽ˜์ด์Šค๋ถ ๊ณต์œ ํ•˜๊ธฐ
  • ์นด์นด์˜ค์Šคํ† ๋ฆฌ ๊ณต์œ ํ•˜๊ธฐ