JMT Project(맛집 리뷰&소개)
KH정보교육원
2024.11.01 13:21
만나조 (디지털컨버전스)공공데이터 융합 자바개발자 양성과정A5 1회차 | |
|---|---|
| 팀장/팀원 | 정**(팀장) : 1. 관리자 페이지 - 전반적인 화면 구성과 기능 구현 - 관리자 로그인 - 관리자 계정만 로그인 가능하도록 설계 - 관리자 계정 외 admin 이하 요청 주소 접속 시 admin 로그인 페이지로 이동하도록 필터 설정 - 회원 관리 페이지 - 전체 Ajax 를 통한 비동기 동작 페이지 - 회원 현황판 - 전체 회원, 활동 회원, 차단 회원, 탈퇴 회원 수 조회 - 차단, 탈퇴 버튼 동작 시 마다 최신화 - 회원 목록 - 조회 조건(전체, 탈퇴, 차단) 과 검색 유형, 검색어를 받아 페이지 이동, 검색 버튼 클릭 시 마다 새로 조회(Ajax 를 통한 비동기 동작) - 각 회원 차단, 탈퇴 기능(Ajax 를 통한 비동기 동작) - 가게 관리 페이지 - 가게 정보 조회 - 검색어를 통해 원하는 가게 목록만 조회 가능 - 각 가게 정보 클릭 시 팝업 창으로 가게 상세 정보 조회 가능 - 가게 상세 팝업 - 가게 클릭 시 DB 에서 해당 가게 정보를 가져와 팝업 창에 동기화 - 가게 이름, 가게 사진, 메뉴 정보, 위치 주소 정보, 전화번호, 카테고리 표시 - 팝업창 수정, 삭제 버튼을 통해 가게 정보 삭제하거나 수정 페이지 이동 가능 - 가게 삭제 - 팝업 창에 있는 삭제 버튼을 통해 삭제 가능 - 가게 등록 - 가게 관리 페이지에 있는 등록 버튼을 통해 등록 페이지 이동 - 사진 / 이름 / 메뉴 / 전화번호 / 카테고리 / 지역 / 주소 / 유효성 검사 - 플러스, 마이너스 버튼을 통해 메뉴 개수 변경 가능 - Interceptor 를 이용해 DB 에 저장된 카테고리, 지역 유형 가져와 사용 - 가게 수정 - 팝업 창에 있는 수정 버튼을 통해 수정 페이지 이동 - 사진 / 이름 / 메뉴 / 전화번호 / 카테고리 / 지역 / 주소 / 유효성 검사 - 사진 변경 안 할 시에는 기존에 있던 사진 그대로 사용 - 플러스, 마이너스 버튼을 통해 메뉴 개수 변경 가능 - Interceptor 를 이용해 DB 에 저장된 카테고리, 지역 유형 가져와 사용 - 신고 관리 페이지 (리뷰, 점메추 게시판, 댓글) - 신고 현황판 - 각 유형마다 전체 신고 수, 조치, 미조치, 금일 신고 수 조회해 현황판에 저장 - Ajax 를 통한 비동기 조회로 신고 처리가 완료될 때마다 동기화되어 작동 - 신고 목록 조회 - 미조치 신고, 최신 신고 순으로 조회 - 신고 유형 신고자 이름, 신고 번호로 원하는 신고만 조회 가능 - 신고 번호, 신고자, 신고 일자, 신고 유형 정보 표시 - 처리된 신고는 클릭시 회원 차단, 게시글 삭제, 처리 버튼 클릭 불가 - 각 신고 클릭 시 팝업 형태로 상세 조회 가능 - 신고 상세 팝업 - 신고 유형, 신고 일자, 신고자, 피신고 회원 정보, 신고 내용 확인 가능 - 피신고자 table 에서 해당 회원 차단 혹은 글 삭제 가능(Ajax 를 통한 비동기 동작) - 이미 차단된 회원은 차단 버튼 비활성화 - 이미 삭제된 게시글은 삭제 버튼 비활성화 - 아래 쪽 textarea 에 신고 조치 상황 적어 저장 가능 - 조치 완료 버튼을 누르면 처리된 신고 조치 상태로 DB 업데이트 - 신고 처리된 팝업 - 처리 완료되면 차단, 삭제, 처리 버튼 비활성화 - 기존 상세 팝업 정보에 더해 작성한 조치 상황 정보 확인 가능 - 공지 사항 CRUD - 공지 목록 - 검색어를 통해 원하는 공지 목록만 조회 가능 - 공지 삭제 - 각 공지에 있는 삭제 버튼을 통해 삭제 가능 - 공지 등록 - 등록 버튼을 통해 등록 페이지 이동 - 등록 페이지에서 공지 제목 / 카테고리 / 내용 입력하여 수정 - 제목 / 카테고리 / 내용 유효성 검사 - 공지 수정 - 각 공지에 있는 수정 버튼을 통해 수정 페이지 이동 - 수정 페이지에서 공지 제목 / 카테고리 / 내용 입력하여 수정 - 제목 / 카테고리 / 내용 유효성 검사 1. 헤더 - 내비게이션 - 메인 / 점메추 / 공지 사항 / FAQ 페이지 빠른 이동 - 로그인 회원 가입 빠른 이동 - 로그인 안되어있을 시 헤더 오른쪽 위에 로그인 회원 가입 링크 존재 - 마이 페이지 팝업 - 로그인 시 마이 페이지 이동 / 로그 아웃 기능이 포함된 팝업 버튼 표시 - 관리자 계정 로그인 시 관리자 페이지 이동 기능 추가 표시 |
| 정** : - 로고 디자인 - 고궁 데이트 맛집 추천용 느낌을 내기 위해 귀엽고 팝한 컬러로 선정 - 메인페이지용 / 헤더용 / 파비콘용 별도 파일 제작 - 톤앤매너, 디자인 무드, 폰트 설정, 전반적 CSS 체크 후 수정 - 메인 컬러로 뽑은 Teal 색상 기준으로 달콤한 사탕, 여름 느낌의 포인트 컬러 선정 - 무채색 계열 활용하여 단정한 느낌 - [폰트] 메인 나눔스퀘어 / 포인트 넥슨고딕 - 공지사항 뷰 - 페이지네이션 활용, 1 페이지에 5개 리스트 조회한 후 페이지 넘기기 - 최상단 신규 글에만 new 글자 표시 - 상세조회 - 가데이터 입력 - FAQ 뷰 - JQuery 활용하여 토글 기능 구현 - 어드민 사이드 페이지 - 화면 구성, 레이아웃 - a 태그로 화면 전환 - 어드민 - FAQ 관리 - FAQ 게시판 CRUD - FAQ 관리 페이지 레이아웃 CSS - FAQ 수정 버튼 누르면 수정 페이지 이동 - FAQ 삭제 버튼 누를 시 화면에서 표시하지 않음 (DB에서 확인 가능) - FAQ 신규 작성하면 등록 - FAQ 내용 수정 및 제목, 내용 유효성 검사 - FAQ 등록된 내용 삭제 - 가데이터 입력 - 기타 - 가게 관리 데이터 입력 10% - 보고서 공통 부문 작성 - 사이트 최소 기능 QA | |
| 김** : 1. 마이페이지 - 마이페이지 관련 주요기능 링크 2. 로그인 - 이메일과 비밀번호를 이용한 로그인 기능 구현 3. 회원가입 - 이메일, 이메일 인증번호, 비밀번호(BCrypt암호화를 이용), 비밀번호 확인, 이름을 통한 회원가입 기능 비동기를 통한 유효성 검사 기능(이메일, 비밀번호, 이름 형식 지정) 4. 회원 탈퇴 - 현재 비밀번호 확인을 통한 회원 탈퇴기능 (MEMBER_DEL_FL = ‘Y’ 로 변경) 5. 비밀번호 변경 - 현재 비밀번호를 기반으로 새 비밀번호를 설정함 (alert를 이용한 유효성 검사 진행) 6. 비밀번호 찾기 - 이메일 인증을 이용한 임시 비밀번호 발급 기능 구현(임시 비밀번호는 8자리 숫자 대문자 소문자, 특수문자 혼용 랜덤) 7. 찜 목록 조회 - 세션에서 로그인되어있는 memberNo의 정보를 가져와 자료들을 map 형식으로 묶어 자료 전달, 페이지네이션 기능 구현 | |
| 홍** : - 점메추 게시판 - 점메추게시판 메인화면 - 게시물 목록 구현 - 무한스크롤 구현 - 회원일때, 게시글 수정, 삭제가능 - 수정버튼 클릭시 현재 나와있는 게시글정보 그대로 수정화면으로 전환 - 회원이 아닌경우, 글쓰기 버튼 클릭 시 alert - 게시물 작성된 시점 표기 - 내글이 아닌경우 + 회원인 경우만 게시글 신고기능 구현 - 게시글 신고기능 클릭 시, 3종류의 사유로 신고가능 - 신고기능 밖 화면 클릭시 신고기능팝업창 닫기 - 점메추 게시판 - 글쓰기기능 - 점심메뉴추천게시판에서 글쓰기버튼 누르면 글쓰기 게시판으로 화면전환 - 제목, 본문내용입력 작성, 사진삽입 후 글쓰기 게시판으로 데이터 넘기기 - 사진 삽입시 미리보기, X버튼으로 미리보기 삭제 가능 - 점메추 게시판 - 댓글기능 - 댓글보기 토글 클릭 시 비동기로 댓글창 볼 수 있게 구현 - 열린 댓글 창에서 회원만 댓글입력가능(비회원일시 댓글창 안보이게) - 댓글 수정기능 - 수정버튼 누르면 → 수정textarea 뜨면서 -수정하기, 수정취소로 버튼 교체 - 댓글 신고기능 - 댓글 신고기능 누르면 pop-up창 뜨면서 3종류의 사유로 신고가능 - 점메추 게시판 - 검색기능 - 각각 분류에 따라 제목, 작성자, 본문내용 검색기능 구현 | |
| 김** : 1. 메인홈페이지 - 가게에 관한 검색 - 검색기능으로 음식종류,지역 원하는 제목을 입력하여 가게 검색 가능 - 카테고리 조합하여 검색 가능 - 음식 종류, 지역 선택 - 카테고리 선택시 해당 카테고리 검색 가능 - 카테고리 인터셉터이용한 지역 목록조회 - 메인페이지 대표 가게 목록 - 인기순, 최신등록순,리뷰 많은 순 - 가게 상세 조회 - 찜 기능 - 회원이 찜한 가게 정보를 한번에 알아볼수있게해주는 기능 - 회원번호와 가게 정보가 일치하는게 존재한다면 INSERT된걸 보여주는 기능 1. 가게 검색 페이지 - 검색한 결과 기록 확인 - 지역,음식 카테고리 - 검색한 카테고리 기록 - 가게 검색 페이지에서 검색 가능 - 최신순, 리뷰 많은 순, 찜 많은 순 정렬 가능 - 찜 100분율하여 얼마나 찜 했는지 % 확인 가능 | |
| 김** : 1. 가게 상세 정보 페이지 조회 - 가게 기본 정보 - 해당 가게의 이름, 찜 여부, 카테고리, 사진, 전화번호, 위치 상세주소 표시 - 해당 가게의 대표 메뉴와 가격 표시 - 가게 지도 - 해당 가게의 정확한 위치를 지도로 표시 - 지도는 카카오 맵 api를 사용하여 구현 - 방문자 평가 - 리뷰 목록 보기 - 해당 가게의 리뷰 목록을 조회하여 출력 - 리뷰 작성자의 이름, 프로필 이미지, 작성 날짜 출력 - 리뷰는 사진과 텍스트가 같이 출력 됨 - 리뷰에 가게를 추천, 비추천 하는지 출력 - 해당 리뷰가 로그인한 회원이 작성한 리뷰면 수정, 삭제 가능 - 수정 페이지로 이동하여 전에 작성한 내용을 출력 - 삭제 시 비동기로 삭제 처리 후 리뷰 목록 새로 조회 - 해당 리뷰가 로그인한 회원이 아니라면 신고 가능 - 신고는 팝업 레이어 형식으로 출력 - 신고 카테고리와 신고 내용(빈칸 가능) 선택 후 신고 가능 - 한 리뷰에 중복된 카테고리로 신고 불가능 - 로그인을 하지 않은 회원은 수정, 삭제, 신고 불가능 - 리뷰 목록 정렬 - 정렬을 선택하지 않은 상태에서는 최신 순으로 정렬 - 정렬 팝업에서 최신순, 오래된순 선택 가능 - 정렬 시 비동기로 화면에 출력 - 리뷰 더보기 - 기본적으로 1개의 리뷰가 페이지 하단에 출력됨 - 리뷰 리스트 하단에 평가 더보기 버튼을 누르면 비동기로 1개의 리뷰를 추가 - 해당 가게의 모든 리뷰를 불러왔을때 더보기 버튼이 사라짐 2. 해당 가게 리뷰 등록 - 가게에 대한 리뷰 작성 - 해당 가게에 대한 전반적인 평가와 리뷰를 작성 - 로그인 하지 않은 회원은 작성 불가능 - 해당 가게에 대한 추천, 비추천을 버튼 형식으로 구현 - 가게 리뷰는 사진과 이미지 파일을 동시에 사용 가능한 SummerNote에디터 사용 - 작성 완료 버튼 누르면 리뷰 db에 저장 후 해당 가게 상세정보 페이지로 이동 - 작성 취소 버튼 누르면 바로 해당 가게 상세정보 페이지로 이동 | |
| 개요 | 광화문부터 충무로까지 12개 역 기준, 서울 내 고궁 있는 지역구를 기반으로 데이트할 만한 맛집 추천 플랫폼입니다. |
| 구현기능 | 회원 - 로그인 / 로그아웃 - 회원 가입 / 탈퇴 - 내 정보 조회 / 수정 - 비밀번호 변경 - 리뷰 / 찜 목록 확인 관리자 페이지 - 회원 현황 조회 - 회원 차단 / 탈퇴 기능 - 가게 정보 등록 / 수정 / 삭제 - 신고 현황 조회 - 신고 처리(회원 차단 / 글 삭제) - 공지 등록 / 수정 / 삭제 - FAQ 등록 / 수정 / 삭제 가게 상세 조회 페이지 - 상세 정보 조회 - 방문자 평가 조회 - 방문자 평가 작성 - 방문자 평가 수정/삭제 - 방문자 평가 신고 메인 화면 - 검색창을 통해 가게 확인 - 음식 / 지역별 카테고리 구분 - 인기순 / 최신순 / 리뷰순 확인 가게 검색 - 음식 카테고리 선택 - 지역 카테고리 선택 - 지도 API 확인 - 찜 - 리뷰 작성 - 리뷰 신고 점메추 게시판 - 게시글 전체 조회 - 상세 조회 - 등록 / 수정 / 삭제 - 댓글 조회 / 등록 / 수정 / 삭제 공지사항 - 공지사항 조회 (비회원/회원) - FAQ 조회 (비회원/회원) |
| 설계의 주안점 | 등록된 맛집에 호불호와 리뷰를 남길 수 있고 그 데이터를 기반으로 맛집정보를 정렬하여 표시합니다. 점메추 게시판을 통해 해당 지역에서 맛집을 추천하거나 의견을 공유할 수 있는 사이트입니다. |
| 사용기술 및 개발환경 | 개발 언어 :Java, JS, CSS, HTML Framework, Library, API :Spring Boot, Mybatis, Lombok, JQuery, Java MailSender, 다음주소 API, 썸머노트 DBMS : Oracle Tool : Eclipse(STS), DBeaver, VisualStudio Server : Tomcat 10.1 형상관리 : Git, Github OS : Windows10/11 |
 | |
목록으로 
댓글쓰기 
0 
