상품 구현
먼저 상품목록을 html로 넘겨줘야하기떄문에
상품을 구현해보겠다.
ItemEntity 작성
@Entity
@NoArgsConstructor
@Getter
public class Item {
@Id
@GeneratedValue(strategy = GenerationType.IDENTITY)
private Long id;
private String name;
private String content;
private int price;
private int count;
@ManyToOne
@JoinColumn(name = "member_id")
private Member member;
@Builder
public Item(String name, String content, int price, int count, Member member) {
this.id = id;
this.name = name;
this.content = content;
this.price = price;
this.count = count;
this.member = member;
}
}상품엔티티는 상품이름과 설명, 가격, 재고로 간단하게 구성했고
Member와 다대일 관계로 매핑해주었다.
ItemRepository 작성
public interface ItemRepository extends JpaRepository<Item, Long> {
}ItemService 작성
ItemService
public interface ItemService {
List<Item> itemList();
}ItemServiceImpl
@Service
@RequiredArgsConstructor
public class ItemServiceImpl implements ItemService {
private final ItemRepository itemRepository;
public List<Item> itemList(){
return itemRepository.findAll();
}
}Service - Impl 구조로 작성했고
DB에 저장된 모든 상품들을 반환하는 기능만 추가했다.
BoardController 작성
@Controller
@RequiredArgsConstructor
public class BoardController {
private final ItemService itemService;
@GetMapping("/")
public String index(Model model){
model.addAttribute("items", itemService.itemList());
return "index";
}
}"/" 경로로 접속시 서비스에서 아이템리스트를 받아 model에 담아 html로 넘겨준다.
메인페이지
index.html 작성
<!DOCTYPE html>
<html lang="en" xmlns:sec="http://www.thymeleaf.org/extras/spring-security">
<head>
<title>Title</title>
<div th:replace="/fragments/header.html :: header"></div>
</head>
<body>
<div th:replace="/fragments/nav.html :: nav"></div>
<div class="container">
<h1>상품 목록</h1>
<div sec:authorize="isAuthenticated()">
사용자 : <span sec:authentication="name"></span>
권한 : <span sec:authentication="authorities"></span>
</div>
<table class="table">
<thead>
<tr>
<th>상품명</th>
<th>가격</th>
<th>남은 수량</th>
</tr>
</thead>
<tbody>
<tr th:each="item : ${items}">
<td>
<a th:href="@{/detail/{id}(id=${item.id})}" th:text="${item.name}"></a>
</td>
<td th:text="${item.price}"></td>
<td th:text="${item.count}"></td>
</tr>
</tbody>
</table>
</div>
</body>
</html>header와 상단 nav바는 fragment로 관리했고
부트스트랩과 thymeleaf로 구성했다.
시큐리티와 타임리프를 연동해서 현재 시큐리티 정보들을 받아올수있는데
먼저 build.gradle에 종속성 추가를해줘야한다.
implementation 'org.thymeleaf.extras:thymeleaf-extras-springsecurity5'그리고 html 상단태그에
xmlns:sec="http://www.thymeleaf.org/extras/spring-security"을 추가해준다.
이제 sec: 을 이용해 현재 시큐리티 정보들을 얻을수있는데 간단히 설명하자면
sec:authorize="isAuthenticated()" : 로그인되었을때만 표시한다.
sec:authentication="name" : 현재 사용자의 username을 표시
sec:authentication="authorities" : 현재 사용자의 권한 목록표시
header.html 작성
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:fragment="header">
<meta charset="UTF-8">
<link rel="stylesheet" th:href="@{/css/bootstrap.min.css}">
<script th:src="@{/js/bootstrap.bundle.min.js}"></script>
</head>
</html>부트스트랩 ccss와 js만 설정해주었다.
nav.html 작성
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org"
xmlns:sec="http://www.thymeleaf.org/extras/spring-security">
<div th:fragment="nav" class="mb-5">
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<div class="container-fluid">
<a class="navbar-brand" href="/">Home</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link" href="/auth/login" sec:authorize="isAnonymous()">로그인</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/auth/signup" sec:authorize="isAnonymous()">회원가입</a>
<a class="nav-link" href="/logout" sec:authorize="isAuthenticated()">로그아웃</a>
</li>
</ul>
<form class="d-flex">
<input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success" type="submit">검색</button>
</form>
</div>
</div>
</nav>
</div>
</html>nav바에도 똑같이 sec를 이용하였다
sec:authorize="isAnonymous()" : 익명 사용자에게 표시
sec:authorize="isAuthenticated()" : 로그인된사용자에게 표시
