일주일간 강사님이 팀을 짜주시는 동안 개인 플젝을 진행했다.
국비 3개월간 정말 많은 일들도 있었고 중간중간 자격증 시험 공부를 하여 공부의 방향성도 많이 깨지기도 했다. 그래서 Spring을 들어가고 혼자 만들어보니 정말 어려웠다. 어려웠던 부분 위주로 정리해보려 한다.
구매자 회원가입 후 DB에 저장하기
@RequestMapping("buyerLoginProcess")
public String getBuyerByLogin(HttpSession session, BuyerDto buyerDto) {
BuyerDto sessionBuyer = buyerService.getBuyerByLogin(buyerDto);
if(sessionBuyer==null) {
return "buyerLoginPage";
} else {
session.setAttribute("sessionBuyer", sessionBuyer);
return "redirect:../buyerMainPage";
}
}
@Service
public void buyerByLogin(BuyerDto buyerDto) {
BuyerDto sessionBuyer = buyerSqlMapper.selectBuyerIdAndPw(buyerDto);
return sessionBuyer;
}
interface mapper--
public BuyerDto selectBuyerIdAndPw(BuyerDto buyerDto);
xml mapper--
<select id="selectBuyerIdAndPw" resultType="com.dong.shop.dto.BuyerDto">
select * from shop_buyer
where buyer_id = #{buyer_id} and buyer_pw = #{buyer_pw}
</select>회원가입 페이지에서 아이디, 비밀번호 등 여러 필요 요소들을 입력하고 jsp에서 form 태그로 registerComplete 페이지로 파라미터를 보내 DB에 저장한다. 후 로그인 화면에서 아이디와 비밀번호를 입력하고 controller에서 받아 session에 저장되있는 buyer 정보들을 받아 쿼리 조건에 각각 대입하여 비교한다. 일치하지 않거나 정보가 null이면 로그인 실패 화면으로 넘어가고 일치한다면 구매자 메인 페이지로 redirect한다. 판매자 페이지도 위와 동일하다.
판매자 메인 페이지
판매자 메인 페이지는 관리자처럼 한눈에 볼 수 있게 UI를 만들어 봤다.
판매자가 등록 상품들과 판매된 상품에 대한 리뷰 게시판 그리고 판매된 상품의 배송 상태..
판매자가 상품을 등록할 때 메인 이미지와 상세 이미지 등록부터 헬이 였다. 기능 하나하나를 넘기는데
정말 많은 시간과 노력을 쏟았다. 에초에 java문법이나 객체지향의 원리를 대충 이해하고 있었던 나로써는 생각하고 GPT나 잘하는 친구들에게 물어보아도 이해가 바로바로 되지 않았다.
강사님은 개발자는 자료구조를 필수로 잘 다뤄야한다고 강조하셨고 대부분 많은 DTO를 받아올때 자료구조를 사용하여 알려주셨다. 메모리 구조까지 곁들여 강의를 해주셨는데 정말 어려웠다. 더 나은 개발자가 되기 위해선 메모리 관리도 잘해야 한다고 하셨다.
@RequestMapping("productRegistration")
public String productRegistration() {
return "productRegistration";
}
jsp--
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
<title>productRegisteration</title>
<style>
.custom-border {
border: 1px solid gray;
border-radius: 15px;
}
.col-login {
border-bottom: 1px solid gray;
}
</style>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-3">
<a href="../seller_board/sellerMainPage">
<img class="img-fluid" src="/shop/resources/img/logo_1.png">
</a>
</div>
<div class="col"></div>
</div>
<div class="row mt-3">
<div class="col">
<img class="img-fluid" src="/shop/resources/img/whitebg.png">
</div>
</div>
<div class="row mt-5">
<div class="col"></div>
<div class="col custom-border">
<div class="row my-3">
<div class="col fw-bold fs-2 text-center text-gray">상품 등록</div>
</div>
<form action="./productRegistrationComplete" method="post" enctype="multipart/form-data">
<div class="row mt-5">
<div class=" col form-floating">
<input type="text" name="product_title" class="form-control" id="floatingInput" placeholder="상품명">
<label for="floatingInput">상품명</label>
</div>
</div>
<div class="col mt-1">
<select class="form-select" name="category_id">
<option selected>판매카드 선택</option>
<option value="1">프리미엄</option>
<option value="2">포인트</option>
<option value="3">자동차</option>
<option value="4">여행, 항공</option>
<option value="5">쇼핑</option>
<option value="6">생활</option>
</select>
</div>
<div class="row mt-1">
<div class="col form-group">
<textarea class="form-control" id="detail_explain" rows="4" name="detail_explain" placeholder="상품 설명"></textarea>
</div>
</div>
<div class="row mt-1">
<div class="col">
<input class="form-control" type="text" name="price" placeholder="가격">
</div>
<div class="col">
<select class="form-select" name="total_seller_amount">
<option selected>수량</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
</select>
</div>
</div>
<div class="row mt-1">
<div class="col">
<label class="custom-file-label" for="fileUpload" id="fileLabel">메인 사진 등록</label>
<input name="mainImg" type="file" class="form-control" id="fileUpload" multiple accept="image/*">
</div>
</div>
<div class="row mt-1">
<div class="col">
<label class="custom-file-label" for="fileUpload" id="fileLabel">상세 사진 등록</label>
<input name="productFiles" type="file" class="form-control" id="fileUpload" multiple accept="image/*">
</div>
</div>
<div class="row mt-5">
<div class="col fs-6 text-center">나는 판매자인 동시에 소비자</div>
</div>
<div class="row my-2">
<div class="col d-grid">
<button class="btn btn-dark btn-block">상품등록</button>
</div>
</div>
</form>
</div>
<div class="col"></div>
</div>
<div class="row"></div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-kenU1KFdBIe4zVF0s0G1M5b4hcpxyD9F7jL+jjXkk+Q2h455rYXK/7HAuoJl+0I4" crossorigin="anonymous"></script>
</body>
</html>부트스트랩을 사용하여 간단하게 레이아웃을 짜보았다.
현대카드를 좋아해서 사이트를 보면서 비슷하게 만들어 보았다.
이런식이다.
다시 컨트롤러로 받는다.
@RequestMapping("productRegistrationComplete")
public String productRegistrationComplete(HttpSession session,
ProductRegistrationDto productDto, MultipartFile mainImg,
MultipartFile[] productFiles) {
//메인 이미지는 한개로 받으려고 한다. 상세 이미지는 배열로 여러개를 받으려 한다.
SellerDto sessionUser = (SellerDto)session.getAttribute("sessionUser");
if(sessionUser == null) return "redirect:../sellerLoginPage";
//상품 등록페이지는 로그인 세션 정보가 없다면 로그인 페이지로 리다이랙트한다.
List<ProductImageDto> mainImageDtoList = new ArrayList<>();
if(mainImg != null) {
String rootFolder = "/맥북, 윈도우 파일경로/";
SimpleDateFormat sdf =. ew SimpleDateFormat("yyyy/MM/dd");
String today = sdf.format(new Date());
File targetFolder = new File(rootFolder + today);
if(!targetFolder.exists()) {
targetFolder.mkdirs();}//폴더가 없으면 폴더 생성
String fileName = UUID.randomUUID().toString();
fileName += "_" + System.currentTimeMillis();
String originalFileName = mainImg.getOriginalFilename();
String ext = originalFilename.subString(originalFileName.lastIndexOf(".");
String saveFileName = today + "/" + fileName + ext;
try {
mainImg.transferTo(new File(rootFolder + saveFileName));
} catch(Exception e) {
e.printStackTrace();
}
productDto.setLink(saveFileName);
}
List<ProductImageDto> productImageDtoList = new ArrayList<>();
if(productFiles != null) {
for(MultipartFile multipartFile : productFiles) {
if(multipartFile.isEmpty()) {
continue;
}
String rootFolder = "/경로/";
SimpleDateFormat sdf = new SimpleDateFormat("yyyy/MM/dd");
String today = sdf.format(new Date());
File targetFolder = new File(rootFolder + today);
if(!targetFolder.exists()) {
targetFolder.mkdirs();
}
String fileName = UUID.randomUUID().toString();
fileName += "_" + System.currentTimeMillis();
String originalFilename = multipartFile.getOriginalFilename();
String ext = originalFileName.substring(originalFileName.lastIndexOf(".");
String saveFileName = today + "/" + fileName + ext;
try {
multipartFile.transferTo(new File(rootFolder + saveFileName));
} catch(Exception e) {
e.printStackTrace();
}
ProductImageDto productImageDto = new ProductImageDto();
productImageDto.setImage_link(saveFileName);
productImageDtoList.add(productImageDto);
}
}
int sellerId = sessionUser.getId();
productDto.setSeller_id(sellerId);
sellerBoardService.productRegistration(productDto, productImageDtoList);
return "productRegistrationComplete";
파일 업로드는 API로 사용했다.
