소개

프로젝트

RedClip

소개

물물교환 중개 웹

개발기간

2017 . 06 . 10 ~ 2017 . 07 . 07 (29일)

개발인원

5명

담당업무

1. 맵에 좌표 값 전달 및 맵 상에 물품 등록 – daum API

2. 맵 상에서 물품을 확인할 수 있도록 하고, 마커를 통해 상세정보를 확인하도록 구현 

  (daum API)

3. GPS 및 Network 기반으로 현재위치를 검색하고, 좌표를 얻어와 주소로 변환, 맵상에서 

  선택한 위치를 주소로 등록

4. 게시판 리스트 및 네이버 스마트에디터API를 활용한 게시물 뷰 작업

개발환경

운영체제

Window 7 64bit

DB

Oracle

사용언어

Java, HTML5/CSS, JQuery, Ajax, Mybatis, JavaScript, FrameWork(Spring)

개발도구

Maven Spring Tool Suit

기타S/W

Bootstrap / Daum map / Naver Smart Editor

등록페이지

등록하고자 하는 물품의 카테고리를 선택한다.

1) 아이템명, 내용, 물건상태, 연락처를 입력한다.

2) 이미지를 4장까지 첨부가 가능하다.

3) 다음 API를 통해 주소입력이 가능하며, 입력한

   주소는 맵에 표시되고 검색도 가능하다.

등록 리스트

1. 등록 완료 후, 리스트로 등록된다.

2. 클릭 시, 상세 정보를 확인할 수 있다.

맵

1. 등록한 물품의 위치와 물품 정보를 지도에

  나타낸다.

2. 검색 기능을 제공한다.

  (해당 검색의 좌표 값을 반환)

3. 말 풍선을 클릭하면, 상세 정보 페이지로

   이동한다.

쪽지

1. 상단의 쪽지 함에 쪽지 보내기 버튼 클릭 시,

   쪽지를 보낼 수 있는 modal창을 생성한다.

2. 전송 버튼을 누르면 상대방에게 쪽지를

   전송한다.

게시판

네이버 스마트 에디터 API를 이용해 다양한 기능이 제공되어 글을 작성할 수 있다. 글 작성시 비밀번호를 입력하며 수정, 삭제 요청 시 비밀번호를 입력하여 해당 요청을 수행할 수 있다.

댓글

1. 글의 상세 페이지에서 댓글을 입력할 수 있다.

2. 세션에 등록된 닉네임을 통해 각 회원들이

   입력한 댓글에만 삭제 버튼을 활성화 시킨다.

회원관리(관리자 모드)

1. 관리자모드를 통해 회원목록, QnA질문내역,

   신고접수내역 등을 확인 및 관리할 수 있다.

2. 신고 당한 회원의 경우, 필터처리를 통해

   비회원과 접근 권한을 같이한다.

회원가입

1. 회원가입 버튼을 통해 현재 화면으로 이동한다.

2. 우편번호 검색을 눌러 다음 우편번호 서비스

   API를 가져와 주소를 입력한다.

3. 가입한 회원의 정보는 DB에 저장되고, 세션에

   회원의 정보를 등록 후에 로그인한 회원의

   정보를 세션에 저장한 후 웹을 이용할 수 있다.

메일 인증

회원 가입 시, 입력한 이메일로 인증코드와 인증코드를 입력할 수 있는 링크를 걸어준다.

신고

1. 신고버튼 클릭 시, 신고 창이 나타난다.

2. 광고 글 및 홍보, 부적절한 상품, 욕설 등을

   신고사유로 선택할 수 있다.

3. 신고가 완료되면 해당 내용은 

   관리자페이지에서 확인이 가능하다.