2022.12.16 MySelectShop

• 필요한 기능 확인하기
  1. 키워드로 상품 검색하고 그 결과를 목록으로 보여주기
  2. 관심 상품 등록하기
  3. 관심 상품 조회하기
  4. 관심 상품 최저가 등록하기

Product 설계

 

Product.java

 

package com.sparta.myselectshopbeta.entity;
 
import com.sparta.myselectshopbeta.dto.ProductRequestDto;
import lombok.Getter;
import lombok.NoArgsConstructor;
import lombok.Setter;
 
import javax.persistence.*;
 
@Getter
@Setter
@Entity // DB 테이블 역할을 합니다.
@NoArgsConstructor
public class Product {
 
    @Id
    @GeneratedValue(strategy = GenerationType.IDENTITY) // ID가 자동으로 생성 및 증가합니다.
    private Long id;
 
    @Column(nullable = false)
    private String title;
 
    @Column(nullable = false)
    private String image;
 
    @Column(nullable = false)
    private String link;
 
    @Column(nullable = false)
    private int lprice;
 
    @Column(nullable = false)
    private int myprice;
 
    public Product(ProductRequestDto requestDto) {
        this.title = requestDto.getTitle();
        this.image = requestDto.getImage();
        this.link = requestDto.getLink();
        this.lprice = requestDto.getLprice();
        this.myprice = 0;
    }
}

DTO

ProductResponseDto.java

 

package com.sparta.myselectshopbeta.dto;
 
import com.sparta.myselectshopbeta.entity.Product;
import lombok.Getter;
import lombok.NoArgsConstructor;
 
@Getter
@NoArgsConstructor
public class ProductResponseDto {
    private Long id;
    private String title;
    private String link;
    private String image;
    private int lprice;
    private int myprice;
 
    public ProductResponseDto(Product product) {
        this.id = product.getId();
        this.title = product.getTitle();
        this.link = product.getLink();
        this.image = product.getImage();
        this.lprice = product.getLprice();
        this.myprice = product.getMyprice();
    }
}

관심 상품 최저가 등록하기

function setMyprice() {
    /**
     * 1. id가 myprice 인 input 태그에서 값을 가져온다.
     * 2. 만약 값을 입력하지 않았으면 alert를 띄우고 중단한다.
     * 3. PUT /api/product/${targetId} 에 data를 전달한다.
     *    주의) contentType: "application/json",
     *         data: JSON.stringify({myprice: myprice}),
     *         빠뜨리지 말 것!
     * 4. 모달을 종료한다. $('#container').removeClass('active');
     * 5, 성공적으로 등록되었음을 알리는 alert를 띄운다.
     * 6. 창을 새로고침한다. window.location.reload();
     */
        // 1. id가 myprice 인 input 태그에서 값을 가져온다.
    let myprice = $('#myprice').val();
    // 2. 만약 값을 입력하지 않았으면 alert를 띄우고 중단한다.
    if (myprice == '') {
        alert('올바른 가격을 입력해주세요');
        return;
    }
    // 3. PUT /api/product/${targetId} 에 data를 전달한다.
    $.ajax({
        type: "PUT",
        url: `/api/products/${targetId}`,
        contentType: "application/json",
        data: JSON.stringify({myprice: myprice}),
        success: function (response) {
            // 4. 모달을 종료한다. $('#container').removeClass('active');
            $('#container').removeClass('active');
            // 5. 성공적으로 등록되었음을 알리는 alert를 띄운다.
            alert('성공적으로 등록되었습니다.');
            // 6. 창을 새로고침한다. window.location.reload();
            window.location.reload();
        }
    })
}

Server

 

        // 관심 상품 최저가 등록하기
    @PutMapping("/products/{id}")
    public Long updateProduct(@PathVariable Long id, @RequestBody ProductMypriceRequestDto requestDto) throws SQLException {
        Product product = new Product();
        // DB 연결
        Connection connection = DriverManager.getConnection("jdbc:h2:mem:db", "sa", "");
 
        // DB Query 작성
        PreparedStatement ps = connection.prepareStatement("select * from product where id = ?");
        ps.setLong(1, id);
 
        // DB Query 실행
        ResultSet rs = ps.executeQuery();
        if (rs.next()) {
            product.setId(rs.getLong("id"));
            product.setImage(rs.getString("image"));
            product.setLink(rs.getString("link"));
            product.setLprice(rs.getInt("lprice"));
            product.setMyprice(rs.getInt("myprice"));
            product.setTitle(rs.getString("title"));
        } else {
            throw new NullPointerException("해당 아이디가 존재하지 않습니다.");
        }
 
        // DB Query 작성
        ps = connection.prepareStatement("update product set myprice = ? where id = ?");
        ps.setInt(1, requestDto.getMyprice());
        ps.setLong(2, product.getId());
 
        // DB Query 실행
        ps.executeUpdate();
 
        // DB 연결 해제
        rs.close();
        ps.close();
        connection.close();
 
        // 응답 보내기 (업데이트된 상품 id)
        return product.getId();
    }

AllInOneController의 한계점

1. 한 개의 클래스에 너무 많은 양의 코드가 존재
   1. 코드 이해가 어려움: 처음부터 끝까지 다 읽어야 코드 내용을 이해할 수 있음
2. 현업에서는 코드 추가 혹은 변경 요청이 계속 생김
   1. 관심 상품 등록 시 Client 에게 응답 (Response) 하는 값 변경
      1. 등록된 Product 전체 정보 → 등록된 Product 의 id
   2. 최저가 (Myprice) 업데이트 조건 변경
      1. Client 가 최저가를 0원 이하로 입력 → 에러 발생
   3. DB 테이블 이름 변경
      1. Product 테이블의 lprice → lowprice 변경

 

• "절차적 프로그래밍"
  • 초기 프로그래밍 방식
  • 컴퓨터가 해야할 일들을 쭈~욱 순차적으로 나열해 놓는 코딩 방식
  • 예) AllInOneController 클래스의 각 API 처리내용
• "객체지향 프로그래밍"
  • 소프트웨어의 규모가 점점 커지면서 필요성이 부각이 됨
  • 대부분의 사람들은 한 번에 여러가지 다른 생각을 하는데 취약
  • 하나의 사물 (객체) 에 하나의 의미를 부여하는 것처럼 프로그래밍하게 됨
    • 예)
      • 뭔가 자를 것이 필요하면 '✂️' 를 떠올림 (class Sciccors)
      • 종이에 적을 게 필요하면 '✏️' 을 떠올림 (class Pen)
      • "하나의 역할" → 객체