[MAPICK] 배포주소 : https://mapick.vercel.app
- MAPICK
- 장소 기반의 경험과 관심사를 주제로, 마커와 레이어를 통해 나만의 테마 지도를 만들고, 다른 사람과 함께 편집·공유할 수 있는 인터랙티브 지도 플랫폼
- 2025 6/26 ~ 7/31
| 김태연(팀장) | 권태훈 | 이예빈 | 송지은 |
|---|---|---|---|
 |
 |
 |
 |
| @TYss00 | @KwonTaeHun00 | @llyybbb | @jieun22222 |
| 임서현(PO) | 김나단(팀장) | 노선우 | 이초롱 | 채철민 |
|---|---|---|---|---|
 |
 |
 |
 |
 |
| @nunLSH | @nathan960307 | @Noopy1 | @0802222 | @moooonbong |
김태연
마이페이지
- 마이페이지
- 작성글
- 참여글
- 좋아요글
- 댓글목록
- 찜한레이어
- 프로필정보
- 프로필사진 및 닉네임변경
- 비밀번호변경
- 관심분야재설정
- 업적표시
관리자페이지
- 신고
- 사용자관리
- 기타관리(카테고리,커스텀마커)
- 공유지도
- 관리자공지
검색
- 최근검색기록 서버연결
- 제목 or 해시태그 검색시 검색
대시보드
- 로드맵 대시보드
- 퀘스트 대시보드
퀘스트 랭킹
- 정답 or 오답처리
- 랭킹시스템
권태훈
공유 지도
- 공유 지도 대시보드
- 공유 지도 게시글 상세 페이지
- 공유 지도 참여자 목록 조회
- 공유 지도 상세 페이지
- 공유 지도 참여 페이지
- 레이어 생성
- 마커 생성
댓글
- 댓글 수정 및 삭제
이예빈
로드맵
- 로드맵 상세 페이지
퀘스트
- 퀘스트 상세 페이지
송지은
로그인 및 회원가입
- 로그인
- 회원가입
- 소셜로그인
알림
- 전체
- 게시글
- 공지
업적
- 토스트메시지로 업적달성구현
로그인전 첫화면으로 나오는 사이트 소개를 해주는 로그인전 랜딩페이지입니다.
- Gsap.js를 사용하여 애니메이션을 넣어 표현하였다.
- 튜토리얼같은 느낌으로 어떤사이트인지 소개한다.
- 로그인과 회원가입을 할수있다.
- 첫로그인시에는 자신의 관심분야를 선택하는창이 나온다.
- 관심분야를 선택하면 마이페이지에서 확인할수있다.
- 소셜로그인으로도 로그인을 할수있다.
로그인시 나오는 첫화면으로 사이트소개를 하고있다.
- 관심분야소개,인기있는 로드맵,공유지도,퀘스트를 보여준다.
- swiper를 사용하여 자동으로 넘어가거나 넘길수있도록하였다.
로드맵에 마커를찍어 자신이 소개하고싶은분야를 소개하는 공간이다.
- 자신이 추천하는 여행경로,맛집탐방등 여러가지를 지도에 마커를 찍어서 보여주는곳이다.
- 관심분야별로 볼수있다
- 최신순,인기순정렬이 가능하다.
- 인기있는것들을 Hot에서 3개볼수있다.
로드맵 메인대시보드
로드맵 생성
마커 직접찍기
주소로 마커찍기
로드맵 상세페이지
로드맵 수정
로드맵 삭제
사용자들끼리 목표(지역)를 정한후 해당하는 마커들을 같이 찍어 만드는 공간이다.
- 참여하기를 통하여 공유지도에 참여할수있다.
- 마커를 직접찍거나 주소입력으로 마커를 추가할수있다.
- Liveblocks 사용하여 실시간으로 마커들이 찍힌다.
공유지도 생성
공유지도 레이어추가
공유지도 참여하기
공유지도 레이어조회
공유지도 삭제
장소맞추기 퀘스트를할수있는 공간이다.
- 작성자는 퀘스트장소와 힌트,마감일을 적어 작성을한다.
- 맞추는사람은 사진과 내용을적어 한번 시도를할수있다.
- 대기중상태가 기본이고 작성자가 정답 또는 실패처리를 할수있다.
- 가장 빨리맞춘사람순으로 랭킹에서 순위를 나타낸다.
퀘스트 메인대시보드
퀘스트 생성
퀘스트 상세페이지
퀘스트 정답맞추기
퀘스트 정답처리
시스템공지와 관리자공지를 받을수있다.
- 게시글,댓글등의 공지와 관리자공지가있다.
- 알림클릭시 알림확인이되어 알림을 읽은표시가된다.
- 전체읽음을 누르면 전체알림이 사라진다.
게시글들을 검색할수있는 공간이다.
- 해시태그와 제목으로 검색이 가능하다.
- 검색페이지에서는 최대3개 또는 4개가 나온다.
- 가까이 클릭시 전체보기가 나오며 전체보기 클릭시 전체가나온다.
업적을달성하면 토스트메시지로 업적달성이온다.
- 해당 업적을 달성하면 토스트메시지가온다.
- 자신이얻은것은 마이페이지에서 확인이가능하다.
자신의글들과 좋아요,프로필수정등을 할수있는 공간이다.
- 프로필정보를 변경할수있다.
- 자신의 관심분야를 확인할수있다.
- 업적등 얻은것을 확인할수있다.
- 자신이 쓴 게시글,참여한글등 확인할수있다.
- 소셜로그인에서는 비밀번호를 변경할수없다.
- 일반로그인시 비밀번호를 변경할수있다.
관리자가 여러가지 처리를하는 공간이다.
- 신고를 받은것들은 대기상태이다.
- 자세히보기를 누르면 해당 게시물이 나온다.
- 게시글 삭제처리를하거나 완료처리를하면된다.
- 삭제를하면 자동으로 완료처리가된다.
- 사용자를 관리하는 공간이다.
- 사용자정보,삭제를할수있다.
- 관리자권한부여,회수를 할수있다.
- 블랙리스트를 지정,회수할수있다.
- 카테고리를 관리하는 공간이다.
- 카테고리를 생성,수정,삭제를 할수있다.
생성
간편수정
디테일수정
삭제
- 공유지도를 관리하는 공간이다.
- 공유지도를 삭제할수있다.
- 공유지도 진행율은 전체 사용자 / 참여한 사용자 비율이다.
- 관리자공지를 할수있는 공간이다.
- 공지를 생성,삭제를 할수있다.
- 시스템,이벤트,업데이트,안내사항으로 공지를 나눠서할수있다.
공지생성
공지확인
| React | TypeScript | Next |
|---|---|---|
 |
 |
 |
| Tailwindcss | Axios | Zustand | Liveblocks | Googlemap |
|---|---|---|---|---|
 |
 |
 |
 |
| Git | GitHub | Notion | Slack |
|---|---|---|---|
 |
 |
 |
 |