[팀프로젝트]MVC2 패턴을 이용한 펫 샵 with JDBC,웹 크롤링

해당 프로젝트에서 내가 맡은 역할은 모델 겸 컨트롤러이다.

약간의 뷰 파트도 맡았으며 컨트롤러가 메인이다.

약 1주일간의 설계 단계와 2주정도의 코드 작성 기간을 거쳐 총 3주 간의 개발 기간을 거쳤다.

주요 기능으로는 각종 API와 플러그인이 있으며 추가적으로 페이징 처리를 하였다.

내가 맡은 주요 코드는 이메일 SMTP,별점 플러그인,이미지 업로드,페이징 처리,모달창 플러그인이 있다.

 

개요이다.

늘어나는 온라인 수요 증가에 따른 온라인 매장이 필요성에 의해서 기획하게 되었다.

목적은 실제 서비스 가능한 수준의 웹 사이트를 목표로 설정하여 진행하였으며,

프로젝트의 주제는 '펫 샵'으로 상품 서비스의 전달이 주 된 기능이다.

 

개발환경은 주로 eclips를 이용했으며 서버는 tomcat, DB는 mySQL, 자료 공유는 github와 블로그를 이용하였다.

사용언어로는 Java와 css,JS,JSP,HTML,JQuery등이 있다.

 

일정은 08.16~09.06까지 약 3주정도 소요되었다.

 

DB 테이블 ERD이다.

외래키를 이용한 참조관계를 나타내었다.(화살표가 반대로 되어있음)

 

유저플로우이다.

관리자페이지는 구현되어있지 않고 메인페이지쪽만 구현이 되어있다.

관리자페이지는 Spring에서 추가적으로 구현될 예정이다.

 

페이징 처리 코드이다.

페이징 처리를 하는 알고리즘의 큰 틀은 View에서 보내준 page의 번호를 기반으로

필요한 모든 변수를 계산한다.

즉, 모든 변수의 계산식은 page의 번호에 의존한다.

page 번호에 해당하는 변수는 pageNum이라 칭하였으며 사진과 같이 모든 변수의 계산식은 pageNum에 의존한다.

추가적으로 페이지의 이전 블록과 다음 블록의 유무에 따른 Prev,Next버튼의 활성화 기능 역시 구현되어있다.

 

이메일SMTP이다.

구매완료 후 영수증을 이메일로 처리하기 위한 기능이다.

google 계정으로 이메일SMTP 사용을 위한 설정 후 앱 번호를 발급 받아야 사용할 수 있다.

자세한 설명은 링크를 통해 확인 할 수 있다.

smtp를 이용하여 gmail 보내기 (tistory.com)

smtp를 이용하여 gmail 보내기

 

이미지 업로드이다.

상품에 관한 리뷰 작성 시 이미지 파일을 첨부할수 있게 해두었고 해당 파일을 서버에 업로드하는 과정이다.

이 과정을 통하여 리뷰의 내용과 함께 이미지의 url를 함께 DB에 insert한다.

이 과정에서는 MultipartRequest 객체를 이용하여 파라미터를 넘겨 받아야한다.

또한 첨부파일이 없을 경우를 위하여 if문으로 serverFilename 값이 존재하는지 유무를 체크한다.

 

별점 플러그인이다.

추가적으로 hidden 타입의 input을 사용하여 별점을 준 별의 갯수를 value에 담아서 보내주고있다.

넘겨받은 별점은 컨트롤러에서 float 형태로 변환하여 DB에 저장한다.

이 외에는 테이블,vo,dao 작성과 몇 개의 view파트 jsp파일 수정 및 FC를 이용한 컨트롤러 작업을 하였다.

 

실제 index.jsp를 통한 실행 화면이다.

 

 

전체 PPT 파일이다.

PetShop (3).pptx

4.87MB

sonsunghwan94/JSPproject (github.com)

GitHub - sonsunghwan94/JSPproject

전체 코드는 깃허브에서 확인할 수 있다.