Angry MOMO Presentation

Size: px

Start display at page:

Download "Angry MOMO Presentation"

화주 박
6 years ago
Views:

1 PetCity 프로젝트기술명세서 Date : 조 김영회, 서아람, 손성호, 전기현, 한병권

2 목차 Petcity 1. 서비스소개 기획의도 팀원소개 요구사항정의 2. 프로젝트개요 개발환경 작업일정 시스템구조 데이터베이스구성 테이블명세 3. 기술상세 사용자서비스 관리자기능 4. 부가기능 5. 관리자페이지

3 1. 서비스소개

4 기획의도 펫시티는분양시일어날수있는거래사기와반려동물의무분별한공장양성화를막기위해개인분양시스템을갖춰보다안전하고, 안심할수있는분양이이뤄질수있도록기획하게되었습니다. 분양시스템외에결혼 / 교배, 펫도우미, 정보게시판을더하여펫과관련된다양한서비스를제공합니다. 4

5 팀원소개 공통사항 김영회서아람손성호 기획및총관리 분양시스템 mypage Ajax 멀티게시판 중고장터 List 처리 검색 찜목록 결혼 / 교배 회원관리 프론트엔드개발 HTML, CSS, Javascript 기반의웹페이지 MySQL 기반의데이터베이스 JSP 기반의웹사이트제작 MVC model2 패턴구현 Spring 을이용한관리자페이지구현 전기현 멀티게시판 펫도우미 댓글 한병권 멀티게시판 정보 Index 페이지 5

6 서비스개요 사용자 6

7 서비스개요 관리자 7

8 요구사항정의 8

9 2. 프로젝트개요

10 개발환경 공통 운영체제 Windows 10, Mac OS 소스코드작성도구 Eclipse EE, Sublime Text 3 그래픽제작도구 Adobe Photoshop CC 2015 웹서버 Apache tomcat 8.0 데이터베이스 MySQL Server 형상관리도구 GitHub Frontend Language HTML5, CSS3, JavaScript Framework Twitter Bootstrap 3, jquery Backend Language JAVA, JSP Framework MVC2, MyBatis 10

11 작업일정 11

12 시스템구조 server 1. 사용자가특정내용을웹서버에요청 2. 웹서버가 URL 이가리키는웹프로그램을실행 사용자입장에서는페이지이동이이루어진다. Petcity.jsp 4. 웹서버는 JSP 의실행결과를브라우저에전달 3. 웹프로그램은 DATABASE 에내용을저장하거나저장된내용을조회 12

13 DataBase 구성 13

14 테이블명세 (1) 14

15 테이블명세 (2) 15

16 테이블명세 (3) 16

17 테이블명세 (4) 17

18 테이블명세 (5) 18

19 테이블명세 (6) 19

20 3. 기술상세 - 서비스페이지

21 3. 기술상세 - 서비스 01 < 판매자 > 분양하기 (1) NO 설명 < 분양시작하기 > 01 < 판매자 > - 판매자가양식에맞게분양글을작성하고등록 02 < 구매자 > 02 < 구매자 > - 구매자가분양글에서분양하기버튼을클릭해서분양상태시작 21

22 3. 기술상세 - 서비스 < 구매자 > 분양하기 (2) NO 설명 < 구매자분양입금 > 01 < 구매자 > - 분양정보확인후입금하기클릭 < 구매자 > - 마일리지가부족할경우충전하기클릭 03 < 구매자 > - 충전할마일리지금액을선택하고입금완료클릭 < 구매자 > - 입금버튼을클릭하여인수확인페이지로이동 22

23 3. 기술상세 - 서비스 01 < 판매자 > 02 < 구매자 > 분양하기 (3) NO 설명 < 인수인계최종확인 > 01 < 판매자 > - 입금을한상태이므로, 구매자의정보를볼수있음. 02 < 구매자 > - 입금을한상태이므로, 분양자의정보를볼수있음. 판매자는펫을전달한후인계확인, 구매자는펫을전달받은후인수확인을하여최종거래가완료됨

24 3. 기술상세 - 서비스 분양하기 (4) NO 설명 < 마이페이지분양히스토리 > 내가작성한분양글 / 신청한분양글로분류하여현재진행단계인분양글및거래완료된분양글의이력을조회가능 24

25 3. 기술상세 - 서비스 분양하기주요소스 NO 설명 01 < 거래가시작된분양글은 01 조회불가능 > -state 컬럼을통한조건지정및 JSTL 분기처리를통해거래진행이 시작된분양글은조회를차단 02 25

26 3. 기술상세 - 서비스 분양하기주요소스 02 NO 설명 02 < 마이페이지를통해분양글의 단계별로접속및거래진행가능 > -거래단계별로 state 컬럼을변경해서구분하고, 마이페이지에서분양상태를명시해줌으로써사용자가거래의현재진행단계를쉽게파악할수있고, 원활한거래를지속할수있음. 03 < 종료된분양글 > 03 - 거래가종료된글을클릭하면, 종료된글로알럿이발생함. 26

27 분양시스템

3. 기술상세 - 서비스 01 02 NO 예약하기 (1) 설명 01 < 펫도우미글작성 > - 펫도우미가글을작성하고세부서비스내용을선택 03 02 < 예약가능일선택 > -

28 3. 기술상세 - 서비스 NO 예약하기 (1) 설명 01 < 펫도우미글작성 > - 펫도우미가글을작성하고세부서비스내용을선택 < 예약가능일선택 > - 예약받을날짜를 Date Picker 플러그인을이용하여선택 03 <Date Picker 플러그인의주요코드 > - 시작일을선택하고닫힐때종료일의선택할수있는최소날짜를선택한시작일로지정 28

3. 기술상세 - 서비스 02 예약하기 (2) NO 설명 01 < 펫도우미등록완료 > - 글작성을완료하면펫도우미등록이완료되고서비스내용이표시 01

29 3. 기술상세 - 서비스 02 예약하기 (2) NO 설명 01 < 펫도우미등록완료 > - 글작성을완료하면펫도우미등록이완료되고서비스내용이표시 < 검색 > - 예약하고싶은서비스를검색 < 예약일선택 > - 예약하기버튼을누르고예약날짜를선택하면예약완료메시지와함께예약페이지로이동 29

30 3. 기술상세 - 서비스 02 예약하기 (3) NO 설명 01 < 신청한예약목록확인 > - 마이페이지의예약확인에서예약신청일을확인할수있고펫도우미의정보를확인할수있다 < 예약취소 > - 예약취소버튼을누르면예약취소알림창이나오고예약이취소됨. 30

31 3. 기술상세 - 서비스 예약하기주요소스 01 NO 설명 01 < 예약중복날짜는선택불가능 > - 동일한펫도우미글의예약이되어있는날짜에는선택불가능하도록 disable 처리 02 < 데이터베이스의정보를받는처리 > - 데이터베이스에저장되어있는예약날짜를넘겨받는소스 < 예약일을 disable 할수있도록가공 > - 전달받은예약날짜의크기만큼반복문을실행시켜 disable 시킬변수에저장 03 31

32 예약시스템

기법을이용하여페이지이동없이정보를선택하여전달 02 03 03 < 선택한업체를저장해서검색 > -

33 3. 기술상세 - 서비스 정보검색 (Daum Open API) 01 NO 설명 01 < 지역정보펫정보 > - 지역을설정하면설정한지역의업체정보를출력 02 < 지역의업체정보를선택하는소스 > - Ajax 기법을이용하여페이지이동없이정보를선택하여전달 < 선택한업체를저장해서검색 > - 선택한정보를 tt 변수에저장하여 Daum Open API 에서제공하는 keywordsearch 함수의파라미터로전달 33

34 지역검색시스템

35 3. 기술상세 - 서비스 찜하기 NO 설명 01 < 찜하기버튼 > - 찜하기버튼을누르면마이페이지의찜목록으로이동 - 분양, 결혼 / 교배, 펫도우미게시판에서원하는글에찜선택가능 < 마이페이지의찜목록 > - 자신이찜한목록과정보를확인할수있는페이지 02 - 제목을누르면해당글로이동 < 찜목록삭제 > - 원하지않는찜목록을삭제할수있다 35

36 3. 기술상세 - 서비스 찜하기주요소스 NO 설명 01 < 다른테이블의정보를불러오기 > - 다른테이블의정보를불러오기위하여 SQL 의 Join 기능을이용 02 < 예약가능일선택 > - 카테고리분류가 parcels 일때는 p 로시작하는모든카테고리를검색 - 카테고리분류가 wedding 일때는 w 로시작하는모든카테고리를검색 36

37 부가기능

38 4. 부가기능 - 게시판및댓글프로필이미지 01 프로필이미지 NO 설명 01 <Read 페이지의프로필이미지 > - 가입시등록한프로필이미지가게시판에글을작성할경우, 프로필이미지가보여짐 < 댓글프로필이미지 > - 게시판과더불어댓글작성시에도자신의프로필이미지가같이보여짐 38

39 4. 부가기능 - 아이디 / 비밀번호찾기 01 아이디 / 비밀번호찾기 NO 설명 01 < 아이디찾기 > - 가입시입력한이름과이메일주소를입력하면, 아이디를이메일로보내주는기능 < 비밀번호재설정 > - 가입시입력한이메일주소를입력할경우, 임시비밀번호를이메일로보내주는기능 39

40 4. 부가기능 - 게시판내캐러셀이미지 캐러셀이미지 NO 설명 01 < 게시판내캐러셀이미지 > - 분양게시판, 결혼 / 교배게시판에서는이미지등록시캐러셀이미지로표현 01 40

41 4. 부가기능 - 특정일자동완성 DatePicker 활용 NO 설명 < 날짜자동완성 > - 펫의가임기날짜를자동완성하는기능을만들기위해, DatePicker 와자바스크립트를활용하여구현 01 41

42 관리자페이지 (Spring)

43 5. 관리자페이지 인덱스 관리자인덱스 NO 설명 01 < 인덱스페이지 > - 공지사항, 게시판관리, 분양관리, 회원관리로공지사항글작성및수정기능, 게시물삭제및회원탈퇴기능이구현됨 43

44 5. 관리자페이지 의존성주입 (DI) 의존성주입 NO 설명 01 < 의존성주입 > - 객체간의의존성이존재하므로, 제어반전에의하여특정객체에필요한다른객체를프레임워크가자동으로연결시켜주도록구현함. 44

45 5. 관리자페이지 공지사항 공지사항연동 NO 설명 01 < 공지사항연동 > - 관리자페이지에서공지사항, FAQ, QNA 를작성하면, 서비스 Index 페이지의공지사항, FAQ, QNA 가작성및수정이된다. 45

46 5. 관리자페이지 게시판및회원관리 게시판및회원관리 NO 설명 01 < 게시판및회원관리 > - 관리자페이지에서는각각의게시판의글을삭제할수있으며, 회원또한삭제할수있음. 46

47 감사합니다.

PowerPoint Presentation

PowerPoint Presentation 서비스소개 1 2 프로젝트개요 기술상세 사용자서비스 3 4 기술상세 관리자기능 Our Services our Service 기획의도 Contents 서비스소개 요구사항정의 팀원소개 서비스개요 기획의도 > 팀원소개 > 서비스개요 > 요구사항정의 1 3 4 2 About us 1 2 3 4 최근반려동물에대한관심과사랑그리고키우는수증가 가족같이생각하게됨 반려동물젂용스튜디오를통해추억으로남기게됨