배포 주소: http://yammychu3-env.eba-qj4ecu99.ap-northeast-2.elasticbeanstalk.com/
야구를 좋아하는 모든 사람들을 위해 전국 야구장 내의 매점 정보와 밖의 맛집 정보, 커뮤니티를 제공하는 서비스
- 웹 서비스 소개
- 기술 스택
- 주요 기능
- 특이사항
- 개발 팀 소개
- 개발 기간 및 일정
- 프로젝트 후기
야미추는 야구장의 미친맛 추천의 약자로 야구장에 가서 매점을 찾느라 고생하는 팬들을 위한 안성맞춤 서비스입니다. 구장별 매점 정보에 더하여 주변 맛집, 다른 팬들의 리뷰도 서로 공유하며 소통을 할 수 있습니다.
사이트를 이용하려면 먼저 회원 가입을 해야겠죠? 네브바 상단의 회원 가입 버튼을 누르면 위 페이지로 들어오게 됩니다. 작성 정보들을 적으시고 각자 응원하는 팀을 하나 선택하고 회원 가입을 해주세요!
로그인을 진행하게 되면 메인 페이지로 이동을 하게 됩니다.
삼성은 파란색, 한화는 오렌지색으로 바뀌는 모습!
구단(구장)별로 카드를 클릭하면 해당 구장 페이지로 이동을 합니다. 회원 가입 시 입력한 구단 정보를 통해 구단 포인트 색상을 네브바와 디테일한 부분에 포인트를 줬습니다.
각자 응원하는 팀의 소속감을 느껴봐요!(여러분이 선택하는 구단의 컬러로 바뀝니다)
팔로우순, 리뷰순으로 정렬된 인기 매점 정보 카드를 통해 인기 매점 정보를 바로 접근할 수 있습니다.
하단에서는 실시간 야구 관련 뉴스 기사, 팀 순위, 우리 팀의 게시판 내용을 볼 수 있습니다.
각 구단별 페이지로 들어가면 구장 내의 스낵바의 위치와 목록들, 구장 주변의 맛집들, 그리고 이들을 검색할 수 있는 검색 기능으로 이루어져 있습니다.
음식점 목록들은 팔로우 및 리뷰가 많은 순서대로 필터 기능을 넣었습니다.
전체 보기버튼을 누르면 더 많은 정보를 볼 수 있어요!
내부, 외부, 해시태그 세 가지 중에서 원하는 검색 옵션으로 선택 후 검색도 가능합니다. SSG 랜더스 필드 내에 카페가 궁금하다구요?
구장 내의 카페와 카페들의 위치들이 아주 잘 나오는 모습을 볼 수 있답니다.
먼저 구장 내부 전체 페이지로 가보면 구장 내 스낵바의 위치와 전체 목록들을 볼 수 있고, 페이지네이션과 함께 페이지를 구현했습니다.
클릭을 하게 되면 스낵바의 이름과 정확한 위치를 자세하게 알 수 있습니다.
디테일 페이지로 들어가게 되면 그 스낵바의 위치 정보, 메뉴, 사진을 볼 수 있고 각 음식점에 대한 리뷰도 달 수 있습니다.
이번에는 각 구장별 외부 맛집 페이지입니다. 야구장 안의 매장도 중요하지만, 미리 음식을 사서 들고 가거나 경기 후 한 잔 하고 싶다면? 외부 매장 리스트도 필수죠! 외부 맛집까지 다 만들어놨습니다~
각 구장마다 5~6개 정도의 실제 구장 근처 맛집 정보를 넣었습니다. 추가하고 싶은 맛집 있으시면 언제든지 환영입니다😆
디테일 페이지는 구장 안과 비슷한데 차이점이 있다면 아래의 로드뷰 부분입니다. 외부 매장의 경우, 특히 처음 가보는 야구장일 경우 길 찾기가 어렵기 때문에 카카오맵 api를 활용하여 로드뷰 기능을 구현했습니다. 지도에서 로드뷰 버튼을 클릭하면 매장 근처 로드뷰를 볼 수 있어 위치 파악이 용이하도록 구현했습니다.
리뷰 작성시에 해시태그를 통해 태그를 달 수 있습니다.
검색 시에 원하는 해시태그가 붙은 음식점만 검색도 가능하죠!
야구 사이트면 다른 팬들과 소통도 하고 야구 얘기도 나눠야죠? 다양한 얘기를 자유롭게 할 수 있는 게시판을 만들었습니다. 네브바의 ‘커뮤니티’ 버튼을 누르면 이쪽으로 올 수 있어요.
전체 탭에서는 전체 게시글을, 야구 탭에서는 카테고리가 야구인 게시물만 볼 수 있게 설정해뒀어요. 비동기로 탭을 나누어 카테고리 별로 글을 확인할 수 있습니다. 또 본인 팀의 게시글만 확인할 수도 있는 탭도 만들었습니다. 각자 회원가입 시에 추가했던 팀별로 나뉘어져요!
야구장 같이 갈 사람 구하고 싶으시면? 어서 게시글을 작성해보세요!
게시글을 클릭해서 들어가보면 게시글의 정보(카테고리, 작성자, 내용, 작성일자, 조회수 등)와 함께 댓글 목록들이 보이네요.
게시글이 마음에 든다면 야구공을 눌러주세요⚾ 야구 사이트이니 만큼 좋아요도 야구공 이미지로 해봤어요!
댓글 작성, 수정, 삭제 역시 비동기로 구현했습니다.
같은 팀의 팬들끼리 실시간 소통을 하고싶다면 채팅 기능을 이용해보세요
프로필 페이지로 가보면 응원하는 팀과 개인정보들, 팔로우와 팔로잉, 그리고 활동 내역을 볼 수 있어요.
팔로우를 누르면 나를 팔로우 하는 사람들, 팔로잉을 누르면 내가 팔로우 하는 사람들을 볼 수 있어요. 상대방의 프로필로 이동해서 팔로우/언팔로우를 할 수 있습니다. 야미추에서 마음에 맞는 사람들과 친해져봐요.
각 활동 내역에서 링크를 타고 들어갈 수 있어요. 내가 어떤 글을 썼고, 어떤 식당에 좋아요를 눌렀는지 기억이 안 날 때, 이 기능을 활용해보세요. 음식점과 커뮤니티로 나눠봤습니다!
| Frontend | Backend | Cooperation | Release |
|---|---|---|---|
| HTML5 | Python | Git | S3 |
| CSS3 | Django | GitHub | Elastic beanstalk |
| Bootstrap | SQLite | Notion | |
| JavaScript | PostgreSQL | Discord | |
| Redis |
회원 가입로그인CRUD- 회원 가입 시 선택한 팀에 따라 홈페이지
테마 색이 바뀜 - 커뮤니티 게시글에
댓글작성 및 좋아요 - 커뮤니티 게시글
카테고리별 분류 - 팀별, 매장별
위치정보조회 - 매장별
좋아요기능 - 리뷰
별점기능 및평점계산 기능 - 매장 별 리뷰 수, 좋아요 수로
정렬기능 - 원하는 매장
검색 - 회원끼리
팔로잉 - 로컬에서의 채팅
- 모바일 환경에서도 사용 할 수 있도록 모든 페이지 반응형 웹으로 구성
김문경 - 팀장
김준환 - 팀원
김광표 - 팀원, 발표자
최근영 - 팀원
김다겸 - 팀원
이주용 - 팀원
- 개발 기간 : 11/9 ~ 11/21
- 개발 일정
개발 일정 펼쳐서 보기
- articles 앱 개발
- 좋아요, 댓글 비동기 구현
- 로드뷰 api 추가
- store, restaurant 디테일 페이지 디자인
- 구장별 store 데이터 추가
- 탑 버튼 만들기
- 기타 디자인 및 오류 수정
-
김문경
이번 과정 들어와서 조장 역할을 처음 해봤는데, 조원 전부가 너무 잘해줘서 제가 뭘 안해도 잘 진행 된것 같아서 기분이 좋았습니다. '이런 사이트가 실제로 존재하면 괜찮겠다', '이런 사이트는 어떤 기능 이 있으면 좋을까?'를 생각하면서 사이트를 만들었습니다. 그만큼 기존 클론 코딩 방식보다 흥미는 더 있었지만 난이도는 훨씬 어려웠습니다. 그럼에도 팀원들 모두가 힘을 합쳐 결국 사이트를 만들어낸 점이 성취감을 더욱 느끼게 해줬네요. 제 실력을 다시 한 번 돌아보게 되고 정말 갈 길이 멀다고 느껴 졌습니다. 최종때는 더욱 열심히 해보겠습니다. 약 2주 동안 진짜 너무 고생 많았어요 ㅠㅠㅠ 우리팀 최고👍👍
-
김다겸
야구팬인 팀원이 실제로 필요했던 웹서비스라며 만들기 시작한 프로젝트여서 2주간 정말 재밌게 구현할 수 있었습니다. 주요 기능 중 하나인 팀별 응원 채팅방 기능 배포를 실패해서 아쉽지만, 이후 리팩토링하고, 해당 서비스를 더 보완해나가는 과정에서 꼭 채팅방 기능까지 배포할 수 있도록 할 것입니다.힘든 부분들도 많았지만 서로 많이 도와가며 함께 성장할 수 있었습니다. 야미추 우리팀 너무 고생 많았습니다!
-
김준환
아이디어를 첫 날에 기획하면서 막막했는데 야구장 음식 추천이라는 너무나도 실제로 필요한\ 서비스 아이디어를 조원이 내주어서 즐거웠다. 그런데 아무래도 존재하지 않는 서비스를 만들려고 하다보니 컨셉에 맞는 마땅한 사이트를 찾는게 조금 힘들었다. 그래도 팀 분위기가 좋아서 힘들어도 즐거웠다. 2주간 협업이 뭔지 더욱 잘 알 수 있었고 모바일에서도 잘 보이는 모습을 보니 실제로 출시도 해보고 싶다. 그리고 공부할게 정말 많다. 자바스크립트는 여전히 어렵다. 더 공부해야겠다. 다들 너무 고생많으셨어요~~!!
-
최근영
부족했던 부분도 많았고 프로젝트를 진행하며 처음 접해본 경험도 많았지만 검색하고 모르는걸 팀원분들께 여쭤보고 해결해나가며 아쉽지만 만족도 높은 프로젝트를 만들어본 것 같다. 다음 프로젝트에서는 새로운 내용을 배워서 적용해보고 싶다.
-
김광표
프로젝트는 해도 해도 끝이 없고 욕심이 계속 생기는 것 같다. 처음 기획했을때는 넉넉하게 끝낼 수 있을 줄 알았는데, 하다보니 계속 기능들을 추가하게 되고, 계속 오류들이 보였다. 앞으로는 제한된 일정 안에 프로젝트를 완성하기 위해 더욱 더 확실하게 계획을 잘 짜고, 시간을 잘 분배해야겠다는 생각이 들었다. 그래도 좋아하는 주제를 하다보니 더욱 즐겁게 프로젝트에 임할 수 있었던 것 같다.
-
이주용
우당탕탕 페프였습니다. 제가 야무지지 못해서 고칠 곳이 하나 고치면 계속 생기고 그랬지만 저보다 훨씬 잘하고 야무진 팀원들 덕분에 무사히 프로젝트를 마칠 수 있음에 감사합니다 여러분들 행쇼하세요~ 엄청난 야구팬은 아니지만 커뮤니티에 상주하면서 어그로글 많이 올릴게요~
-
배포 단계에서 구현 못한 채팅 기능 추가
-
야외에서 모바일으로 사용하기에 현실적으로 웹사이트는 한계가 존재
👉 PWA(Progressive Web App)로 웹사이트를 이식해서 접근성 있는 서비스로 만들고 싶음
-
실제 상용화 된다면 각 매점과 연계하여 야구장 내 포장, 배달 서비스 등으로 발전 가능