---
# System prepended metadata

title: 'PJT-4 네이버 예약서비스 : 상세 페이지 개발'

---

# PJT-4 네이버 예약서비스 : 상세 페이지 개발

## Front-End 요구사항

- 전체 코드는 객체리터럴 패턴으로 구현해야 하고, 더불어 전역변수를 최소화해야 합니다.
- 한 개 이상 객체리터럴을 사용할 수 있습니다.
- 상단 타이틀 이미지 영역의 애니메이션은 CSS3의 transition과 transform을 활용해서 구현해야 합니다.
- 상단에 추가로 노출해야 하는 기타 이미지는 Ajax요청을 통해 가져옵니다.
- DOMContentloaded 이후에 모든 자바스크립트 로직이 동작하게 합니다.
- Event delegation으로 처리할 수 있는 영역은 최대한 delegation방법으로 처리합니다.
- Templating 작업은 handlebar 라이브러리를 사용해서 구현해야 합니다. 
- 함수 하나에 여러 개의 기능을 넣지 않고, 함수를 여러 개로 분리합니다.
- 중복코드를 제거하고 공통부분은 공통함수로 만듭니다.
- 변수와 함수 이름은 본인이 정한 코딩컨벤션을 최대한 지킵니다.
- 접기/펼치기 기능은 jQuery 라이브러리를 사용할 수 있습니다.
 
## Front-End Issue
 

## Back-End Issue 요구사항

- controller, service, dao로 레이어드 아키텍쳐를 구성합니다.
- spring JDBC를 이용하여 주어진 테이블로부터 입력, 수정, 삭제, 조회하는 DAO와 DTO를 작성합니다.
- 서비스 인터페이스를 작성하고 해당 인터페이스에 비지니스 메소드를 추가합니다.
- 서비스 인터페이스를 구현하는 클래스를 작성하고 클래스 내 메소드에 적절한 트랜잭션에 관련된 애노테이션을 사용합니다.
- 클라이언트에게 Web API를 제공하기 위해 RestController 를 작성합니다.

## Back-End Issue

1. DTO 설계

- Comment
    - reservation_info
    - reservation_user_comment
- CommentImage : Comment 안에 List
    - reservation_user_comment_image
    - file_info
- DisplayInfo
    - prduct
    - display_info
    - category
- DisplayInfoImage
    - display_info_image
    - file_info
- ProductImage
    - product_image;
    - file_info
- ProductPrice
    - product_price


- 예외 처리 (자료가 없을때 처리)
- history back(오시는 길 처(리, 스크롤 위치, 카테코리 클릭)
- 짧은 글은 펼쳐보기 버튼 없애기
- controller api 음수값 validation 처리
- 

## API 재설계

- detail페이지 (/detail/{displayInfoId})
    - productImages
    - displayInfo
    - displayInfoImage
    - comments(+commentImages)
        - averageScore

- review페이지 (/review/{displayInfoId})
    - comments(+commentImages)
    - displayInfo