회원 웹 기능 - 홈 화면 추가

package com.ujin.ujinspring.controller;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
@Controller
public class HomeController {
@GetMapping("/")
public String home(){
return "home";
}
}

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf/org">
<body>
<div class="container">
<div>
<h1>Helloc Spring</h1>
<p>회원 기능</p>
<p>
<a href="/members/new">회원 가입</a>
<a href="/members">회원 목록</a>
</p>
</div>
</div> <!-- /container -->
</body>
</html>
locathost:8080 입력

이런 화면이 보여지게 되고
회원가입을 누르면 페이지가 아래 그림과 같이 이동된다

그런데 그 전에 만들어둔 static - index.html이 왜 작동하지 않는걸까?
아무것도 출력할 것이 없으면 index.html이 welcome 페이지로 작동하도록 만들어 두었다
우선순위 때문이다

웹 브라우저에서 요청이 오면 먼저 스프링 컨테이너에 관련 컨트롤러가 있는지 찾고
없을 경우 static 파일을 찾도록 되어있는데 index.html도 마찬가지로
1. 요청이 오면 HelloController에 간다 홈 화면에 Mapping된 url이 있다
2. 바로 이동한다
회원 웹 기능 - 등록
이전에 만들어둔 controller - MemberController을 수정하도록 한다
@GetMapping("/members/new")
public String createForm(){
return "members/createMemberForm";
}
추가한 내용

새로운 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>
</html>
createMemberForm.html에 들어가는 내용

이후 위와 같이 진행을 해주면 이렇게 출력이 된다.
한글이 깨져나오면 아래를 넣어주세요
<head>
<meta charset="utf-8">
</head>
여기까지 회원 등록을 하는데 필요한 껍데기를 완성했습니다!
이제 회원을 등록하는 controller을 만들어보도록 하겠습니다

package com.ujin.ujinspring.controller;
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:/"; // 홈 화면으로 돌려보냄
}
MemberController.java에 내용 추가
다시 localhost:8080을 실행시켜 "Spring"이라고 입력한 뒤 등록버튼을 누르면 아무것도 출력되지 않는다
1. 먼저 회원 가입으로 들어간다
2. Members/new로 들어간다

3. 이동하면 탬플릿에서 찾는다
4. html이 뿌려짐
spring이라고 입력하고 등록버튼을 누르면 html에서 acton url로 post 방식으로 넘어온다
GetMapping는 url을 바로 쳐서 넘어가는 것이고
PostMapping는 데이터를 form같은데 넣어서 전달할 때 사용한다
url은 같아도 방식에 따라 다르게 매핑할 수 있다
회원 웹 기능 - 조회
@GetMapping("/members")
public String list(Model model){
List<Member> members = memberService.findMembers();
model.addAttribute("members", members);
return "members/memberList";
}
MemberController.java에 내용을 추가한다
멤버의 리스트 자체를 전부 Model에 담아 화면에 넘긴다
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>
</body>
</html>

여기서 members를 읽어드린다
List에서는 members 전체를 key:value 형식이다
이렇게 모든 회원이 끝날 때까지 돌면서 출력한다

메모리에 저장하는 방식이기 때문에 자바를 끄면 회원 목록이 전부 사라지게 된다
메모리 같은 곳에 저장하여 해결할 수 있다
'Spring' 카테고리의 다른 글
| 스프링 DB 접근 기술 2 ( 스프링 통합 테스트 | 스프링 JdbcTemplate ) (0) | 2022.01.27 |
|---|---|
| 스프링 DB 접근 기술 1 ( H2 데이터베이스 설치 | 순수 JDBC ) (0) | 2022.01.26 |
| 스프링 빈과 의존관계 ( 컴포넌트 스캔과 자동 의존관계 설정 | 자바 코드로 직접 스프링 빈 등록하기 ) (0) | 2022.01.24 |
| 회원 관리 예제 2 - 백엔드 개발 ( 회원 서비스 개발 | 회원 서비스 테스트 ) (0) | 2022.01.21 |
| 회원 관리 예제 1 - 백엔드 개발 ( 비즈니스 요구 사항 정리 | 회원 도메인과 리포지토리 만들기 | 회원 리포지토리 테스트 케이스 작성 ) (0) | 2022.01.20 |