- 정보의 유/무 여부에 따라 보여줄 메시지가 다르다.
- 현재 유저가 프로필을 수정할 수 있는 권한이 있는지 판단해야 한다.
AccountController에 프로필 뷰 요청하는 핸들러 구현
package me.weekbelt.studyolle.account;
@RequiredArgsConstructor
@Controller
public class AccountController {
// 기존 코드 .......
@GetMapping("/profile/{nickname}")
public String viewProfile(@PathVariable String nickname, Model model,
@CurrentUser Account account){
Account byNickname = accountRepository.findByNickname(nickname);
if (byNickname == null){
throw new IllegalArgumentException(nickname + "에 해당하는 사용자가 없습니다.");
}
model.addAttribute(byNickname); // byNickname의 상위타입의 이름의 camel_case로 key값이 설정된다.
model.addAttribute("isOwner", byNickname.equals(account));
return "account/profile";
}
}
유저 프로필을 위한 /accout/profile.html 생성
<!DOCTYPE html>
<html lang="en"
xmlns:th="http://www.thymeleaf.org">
<!--head-->
<head th:replace="fragments.html::head"></head>
<body class="bg-light">
<!--네비게이션 바-->
<div th:replace="fragments.html::main-nav"></div>
<div class="container">
<div class="row mt-5 justify-content-center">
<div class="col-2">
<!--Avatar-->
<svg th:if="${#strings.isEmpty(account.profileImage)}"
class="img-fluid float-left rounded img-thumbnail"
th:data-jdenticon-value="${account.nickname}" width="125" height="125"></svg>
<img th:if="${!#strings.isEmpty(account.profileImage)}"
class="img-fluid float-left rounded img-thumbnail"
th:src="${account.profileImage}" width="125", height="125"/>
</div>
<div class="col-8">
<!--nickname-->
<h1 class="display-4" th:text="${account.nickname}">Weekbelt</h1>
<!--Bio-->
<p class="lead" th:if="${!#strings.isEmpty(account.bio)}" th:text="${account.bio}"></p>
<p class="lead" th:if="${#strings.isEmpty(account.bio) && isOwner}">
한 줄 소개를 추가해 주세요.
</p>
</div>
</div>
<div class="row mt-3 justify-content-center">
<div class="col-2">
<div class="nav flex-column nav-pills" id="v-pills-tab" role="tablist" aria-orientation="vertical">
<a class="nav-link active" id="v-pills-intro-tab" data-toggle="pill"
href="#v-pills-profile" role="tab" aria-controls="v-pills-profile"
aria-selected="true">소개</a>
<a class="nav-link" id="v-pills-study-tab" data-toggle="pill"
href="#v-pills-study" role="tab" aria-controls="v-pills-study"
aria-selected="false">스터디</a>
</div>
</div>
<div class="col-8">
<div class="tab-content" id="v-pills-tabContent">
<div class="tab-pane fade show active" id="v-pills-profile" role="tabpanel" aria-labelledby="v-pills-profile-tab">
<p th:if="${!#strings.isEmpty(account.url)}">
<span><i class="fa fa-link col-1"></i></span>
<span th:text="${account.url}" class="col-11"></span>
</p>
<p th:if="${!#strings.isEmpty(account.occupation)}">
<span><i class="fa fa-briefcase col-1"></i></span>
<span th:text="${account.occupation}" class="col-9"></span>
</p>
<p th:if="${!#strings.isEmpty(account.location)}">
<span><i class="fa fa-location-arrow col-1"></i></span>
<span th:text="${account.location}" class="col-9"></span>
</p>
<p th:if="${isOwner}">
<span><i class="fa fa-envelope-o col-1"></i></span>
<span th:text="${account.email}" class="col-9"></span>
</p>
<p th:if="${isOwner || account.emailVerified}">
<span><i class="fa fa-calendar-o col-1"></i></span>
<span th:if="${isOwner && !account.emailVerified}" class="col-9">
<a href="#" th:href="@{'/checkemail?email=' + ${account.email}}">가입을 완료하여면 이메일을 확인하세요.</a>
</span>
<span th:text="${#temporals.format(account.joinedAt, 'yyyy년 M월 가입')}" class="col-9"></span>
</p>
<div th:if="${isOwner}">
<a class="btn btn-outline-primary" href="#" th:href="@{/settings/profile}">프로필 수정</a>
</div>
</div>
<div class="tab-pane fade" id="v-pills-study" role="tabpanel" aria-labelledby="v-pills-study-tab">
Study
</div>
</div>
</div>
</div>
<!-- footer -->
<div th:replace="fragments.html::footer"></div>
</div>
</body>
</html>
참고: https://www.inflearn.com/course/%EC%8A%A4%ED%94%84%EB%A7%81-JPA-%EC%9B%B9%EC%95%B1#
스프링과 JPA 기반 웹 애플리케이션 개발 - 인프런
이 강좌에서 여러분은 실제로 운영 중인 서비스를 스프링, JPA 그리고 타임리프를 비롯한 여러 자바 기반의 여러 오픈 소스 기술을 사용하여 웹 애플리케이션을 개발하는 과정을 학습할 수 있습니다. 이 강좌를 충분히 학습한다면 여러분 만의 웹 서비스를 만들거나 취직에 도움이 될만한 포트폴리오를 만들 수 있을 겁니다. 활용 웹 개발 프레임워크 및 라이브러리 Java Spring Spring Boot Spring Data JPA Thymeleaf 온라인 강의 스
www.inflearn.com
'스프링과 JPA 기반 웹 어플리케이션 개발 > 1부 (개발환경, 회원가입, 로그인, 계정설정)' 카테고리의 다른 글
| 22. 프로필 수정 (0) | 2020.04.21 |
|---|---|
| 21. Open EntityManager (또는 Session) In View 필터 (0) | 2020.04.21 |
| 19. 로그인 기억하기(RememberMe) (0) | 2020.04.21 |
| 18. 로그인 / 로그아웃 테스트 (0) | 2020.04.20 |
| 17. 로그인 / 로그아웃 (0) | 2020.04.20 |
