프로젝트 개요

프로젝트

NEIFI

관련분야

사회 복지

개발기간

2014.12.26~2015.1.27

개발환경

운영체제

Windows 7

DB

Oracle 11g XE

사용언어

JAVA JDK6, HTML5, JSP, JavaScript, CSS3, JQuery, Servlet 3.0, Ajax

개발도구

Eclipse, Spring Tool Suite, Oracle 11g XE, Apache Tomcat 7.0, SVN Repository

기타 S/W

Adobe Photoshop

개요

1. 자신의 기부, 후원금의 사용이 모두 공개되는 투명한 기부시스템

2. 후원을 원하는 단체별로 페이지를 부여하여 자신의 단체를 직접 홍보 가능

3. 단체별 온라인쇼핑몰 운영으로 쇼핑을 하면서 후원이 가능

4. 총 관리자와 단체별 관리자의 기능 분할로 차별화된 관리자서비스 제공

데이터베이스 다이어그램

세부기능 요약 및 설명

상세화면

기능설명

1. NEIFI 홈페이지의 메인화면이다.

2. 부트스트랩 반응형 메뉴바

3. 단체페이지가 태그 된 이미지 슬라이더

4. 후원현황과 공지사항 샵에서 판매하는 물품을 보여주는 컨텐츠

5. 나눔기업들의 링크와 수상내역을 보여주는 푸터

1. 상단 메뉴바인 헤더부분에 로그인 모달을 hidden으로 숨겨놓고 로그인버튼을 누르거나 로그인이 필요한 페이지를 요청하게되면 로그인 모달창이 나타나게 된다.

2. 아이디찾기, 비밀번호찾기 또한 모달로 실행된다.

1. MVC 패턴 기반의 기본적인 table 형식의 jsp 페이지에 Bootstrap framework를 씌워 반응형으로 만들었다.

2. 부트스트랩을 적용한 게시판 글쓰기

3. 글 목록에서 전체, 작성자별 ,제목별 ,내용별로 CheckBox로 선택해서 검색가능

4. 동적쿼리를 이용해 게시판 글 목록 출력과 글 검색을 1개의 쿼리로 구현

5. 전체관리자 접속 시, 수정,삭제 가능

1. 회사상세정보

2. 조직도

3. 찾아오시는 길 소개

1. 단체관리자가 가입 후에 자신의 단체를 PR할수 있는 사진 또는 동영상과 함께 소개 글을 올릴 수 있다.

2. 단체 관리자들이 등록한 후원단체 목록이 이미지 또는 동영상 파일과 후원단체 이름으로 보여진다.

3. 이미지를 클릭 하면 해당되는 단체의 상세정보를 볼 수 있는 페이지로 이동한다.

1. Ajax를 이용한 실시간 후원금 확인이 가능하다.

2. 사진을 클릭해서 해당 상세보기 페이지로 들어올 때 session에 단체번호(gprnum)을 담아 해당 후원단체가 가입 시 입력한 정보를 볼 수 있다.

3. 해당 단체관리자 id일 경우 이미지 또는 동영상& 후원단체 소개글이 수정 가능하다.

4. 후원단체가 등록한 이미지 또는 동영상 과 후원단체 소개 글을 볼 수 있다.

5. 후원하기 버튼을 클릭하면 해당 단체의 후원금 결제 페이지로 이동한다.

1. 내 정보쓰기 버튼 클릭 시 Jquery를 이용해 가입 시 입력한 나의 회원정보를 결제 정보에 이용할 수 있다.

1. 후원 받은 내역을 Datepicker를 이용한 날짜 별 검색이 가능하다.

2. 검색 결과를 png 또는 jpg이미지 파일, pdf파일로 다운로드 가능하고, 프린트로 결과물을 얻을 수 있다.

1. Nano gallery plugins를 이용한 앨범 구성.

2. 세션에 담긴 단체.개인별 아이디등급을 구분해서 단체 ID만 사진등록하기 버튼 생성

3. multipart/form-data 타입을 이용한 이미지 여러 장 업로드 수정 및 삭제 기능

4. 유효성 검사 플러그 인을 이용한 이미지 등록 시 이미지가 없을 경우에 alert창 생성

5. 등록한 앨범 수정 시 이미지가 없어도 글만 수정가능

1. 부트스트랩을 적용한 게시판 글쓰기

2. 글 목록에서 전체, 작성자별 ,제목별 ,내용별로 CheckBox로 선택해서 검색가능

3. 동적쿼리를 이용해 게시판 글 목록 출력과 글 검색을 1개의 쿼리로 구현

4. ID를 검사해서 등록한 ID가 맞으면 수정,삭제 가능

5. Ajax Load 메소드를 통해 댓글 jsp페이지 본문하단에 출력시키는 방식으로 댓글기능 구현

6. 세션에 담긴 ID 검사해서 댓글 등록 삭제 가능

1. 봉사활동 후기를 올리거나 그에 관련된 내용을 올릴 수 있는 게시판으로써, 스마트 에디터를 이용한 사진 첨부/편집, 텍스트 편집이 가능하다.

2. 부트스트랩을 적용한 게시판 글쓰기

3. 글 목록에서 전체, 작성자별 ,제목별 ,내용별로 CheckBox로 선택해서 검색가능

4. 동적쿼리를 이용해 게시판 글 목록 출력과 글 검색을 1개의 쿼리로 구현

5. ID를 검사해서 등록한 ID가 맞으면 수정,삭제 가능

6. Ajax Load 메소드를 통해 댓글 jsp페이지 본문하단에 출력시키는 방식으로 댓글기능 구현

7. 세션에 담긴 ID 검사해서 댓글 등록 삭제 가능

1. Ajax를 이용한 실시간 총 누적기부금액과 총 누적기부회원 수 확인이 가능하다.

2. 개인회원이 후원단체에 후원결제를 완료하면 게시판 형식으로 후원현황에 등록된다.

1. 모든 단체의 샵에 올라온 상품들을 보여준다

2. 카테고리별로 상품을 분류하여 볼 수 있다.

3. 우측 퀵메뉴를 통하여 최근 본 상품 최대 4개까지 확인이 가능하다.(하루가 지나면 초기화)

1. 샵에서 본 상품중 장바구니 담기를 클릭한 상품 리스트를 볼 수 있다.

2. 부분적으로 주문,삭제가 가능하며 select box를 이용한 전체물품 선택,부분물품 선택을 이용하여 주문하기와 삭제가 가능

1. 구매하고자 하는 상품을 결제하는 페이지

2. 구매하고자 하는 상품의 개수가 여러 개일 경우 상품들의 총 가격과 개수를 보여준다

3. 내 정보쓰기 버튼으로 아이디에 저장된 회원정보를 자동으로 가져다 쓸 수 있다.

4. 우편번호 검색 플러그인으로 전국 주소검색이 가능하다.

1. 회원 정보를 수정하는 페이지

2. 우편번호 검색 플러그인을 이용하여 주소를 얻어올 수 있다.

3. 좌측의 사이드 바 메뉴에서 원하는 메뉴로 이동할 수 있다.

1. 회원의 후원내역을 조회하는 페이지.

2. 기본적으로 제공되는 최근 1달, 최근 1주로 검색하거나 직접 날짜를 지정해서 조회할 수 있다.

1. 회원탈퇴 페이지.

2. 탈퇴사유를 선택하고, 정보처리에 동의하면 회원탈퇴가 가능하다.

3. 제시된 사유 외에 기타 사항일 경우 내용을 기재해야 한다.

1. 전체 후원내역을 검색할 수 있는 페이지.

2. 후원자 ID, 단체명을 키워드로 검색할 수 있다.

1. 탈퇴,강등된 회원 조회 페이지

2. 아이디와 탈퇴사유 번호를 통해 조회가 가능하다.

1. 전체 회원목록을 열람하는 페이지.

2. 후원자 ID, 단체명을 키워드로 검색할 수 있다.

3. 이름(단체명)을 클릭할 경우, 팝업창으로 확인할 수 있다.

1. 단체 승인 페이지

2. 단체회원으로 가입신청 한 회원의 등급을 승인하기 버튼을 통해 단체회원으로 조정한다.

3. 부적격하다고 판단될 경우, 거절하기 버튼으로 회원등급을 비회원으로 조정한다.

1. 회원 제제 페이지

2. 아이디, 이름(단체명)으로 조건부 검색이 가능하다.

3. 강등된 회원의 경우 회원등급이 0으로 조정되며, 비회원 처리되어 서비스를 이용할 수 없다.

1. 선택한 상품의 정보를 볼 수 있다.

2. select box를 이용한 수량선택이 가능하다.

3. 선택한 수략만큼 금액이 변동한다.

4. 즉시 구매하기와 장바구니담기가 가능하다.

1. 단체가 모집하고 있는 봉사 게시판 리스트를볼 수 있다.

2. 단체는 봉사모집하기 버튼이 활성화된다.

3. 마감이 완료된 봉사게시물은 신청할 수 없으며 모집중인 게시물은 일반회원에겐 신청버튼,게시물을 등록한 단체에게는 모집종료버튼이 활성화 된다.

4. 게시물 10개마다 다음페이지로 넘어갈 수 있도록 페이징 처리가 되어있다.

5. 일반회원의 경우 신청한 게시물은 신청완료가 뜨며 중복 신청을 할 수 없다.

1. 실제 봉사기간과 장소, 모집기간, 모집인원과 제목 내용을 입력할 수 있다.

2. Datepicker를 사용하여 날짜를 선택 할 수있다.

3. 모집인원에 한글을 입력하지 못하도록 하였다.

1. 봉사활동 상세 내역을 확인할 수 있다.

2. 신청자의 몇가지 정보가 자동으로 입력되어있다.

3. 한줄 남기기로 단체에 어필을 할 수 있다.

1. 해당 봉사게시물을 지원한 봉사자의 정보와 한줄남기기를 볼 수 있다.

2. Select box를 이용하여 선택적으로 봉사자 선정이 가능하게 하였다.

3. 봉사자 선정 가능 인원수를 보여주고 체크 할 수 있다.

1. jQuery Validation Plugin을 이용하여 무결점 체크와, Ajax를 이용한 id,email 중복체크, 약관 체크 여부를 실시간으로 검증한다.

2. Postcode API를 이용하여 주소 입력을 구현하였다.