오늘은 회원관리 웹MVC와 스프링 DB접근기술에 대해 공부했다.
회원 웹 기능 - 홈 화면 추가
controller 패키지안에 HomeController 클래스를 만든다.
@Controller
public class HomeController {
@GetMapping("/")
public String home() {
return "home";
}
}home으로 return 하기 때문에 home.html 파일을 templates 패키지안에 만들어준다.
<!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>
실행후 localhost:8080에 들어가면 이런 창이 나오게된다.
MemberController에 이 코드를 추가한다.
@GetMapping("/members/new")
public String createForm() {
return "members/createMemberForm";
}templates패키지 안에 members 패키지를 만들고 그안에 createMemberFrom.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>
</html>결과창에서는 회원 가입으로 들어가면 이름과 등록 버튼이 나온다.
회원 웹 기능 - 등록
controller 패키지안에 MemberForm이라는 클래스를 만든다.
public class MemberForm {
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
private String name;
}MemberController에 이 코드를 추가한다.
@PostMapping("members/new")
public String create(MemberForm form) {
Member member = new Member();
member.setName(form.getName());
memberService.join(member);
return "redirect:/";
}redirect:/는 제출이 완료되면 홈화면으로 돌려보내는 것이다.
결과창에서는 회원가입으로 들어가서 이름을 등록하면 홈화면으로 돌아온다.
@GetMapping은 데이터를 조회할 때 사용하고, @PostMapping은 데이터를 전달하거나 등록할 때 사용한다.
회원 웹 기능 - 조회
MemberController에 코드를 추가한다.
@GetMapping("members/")
public String list(Model model) {
List<Member> members = memberService.findMembers();
model.addAttribute("members", members);
return "members/memberList";
}templates패키지 안에 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>
</div> <!-- /container -->
</body>
</html>
결과창에서는 회원가입으로 들어가서 이름을 등록하고, 회원목록을 누르면
그동안 등록했던 이름들의 목록을 볼 수 있다.
메모리에 데이터가 저장되어 있기때문에 서버를 내렸다가 다시 열면 목록이 모두 지워진 것을 확인할 수 있다.
이 데이터들을 파일이나 데이터베이스에 저장해야하기 때문에
스프링 데이터베이스 엑세스 기능이 필요하다.
이 강의는 인프런 김영한님의 스프링 입문을 듣고 작성한 글입니다. 문제시 삭제하겠습니다.
[무료] 스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술 - 인프런 | 강의
스프링 입문자가 예제를 만들어가면서 스프링 웹 애플리케이션 개발 전반을 빠르게 학습할 수 있습니다., - 강의 소개 | 인프런...
www.inflearn.com
'Spring' 카테고리의 다른 글
| 주문과 할인 도메인 (0) | 2022.03.15 |
|---|---|
| Spring 기본편 시작 (0) | 2022.03.14 |
| 스프링 빈과 의존관계 (0) | 2022.01.20 |
| 스프링 입문 - 회원 관리 예제, 백엔드 개발 (0) | 2022.01.19 |
| 스프링 입문 - 스프링 웹 개발 기초 (0) | 2022.01.18 |
댓글