담배200 : 공동 편집과 권한 관리를 지원하는 담배 검수 도구

편의점에서 담배 재고를 쉽게 검수하기 위해 제작된 웹 서비스입니다.

매장 별로 '담배 목록'을 만들 수 있고 이를 편집함으로서 담배를 검수합니다.

담배 목록은 다른 사람들과 공유가 가능한데, 각 목록 생성자가 접근 권한을 관리하며, 소켓 통신을 활용해 실시간 공동 편집을 지원합니다.

담배목록이 적힌 스프레드시트를 매장별로 공유해 동시편집하는 것과 비슷합니다.

저처럼 담배검수가 귀찮은 편돌이가 많을 것 같아 만들었습니다.

🔗 https://github.com/leehyeonmin34/dambae200

문제점 & 아이디어

제공 기능

🔗 UI & 작동 영상 + 기획 보러가기

• 담배 목록
  • 담배 목록 생성/수정/삭제
  • 담배 추가/수정/삭제
  • 담배 순서 조정
  • 담배 목록 내 검색
• 동시 편집
  • 담배 목록 실시간 동시 편집 (구글 스프레드시트와 유사)
  • 목록 접근 권한 관리 (요청/허가/비허가/관리자 권한 인계)
• 그 외 기능
  • 로그인, 비밀번호 찾기
  • 알림 (Pageable 조회)
  • 설정 (개인정보 수정)
  • 업무 꿀팁 컨텐츠

프로젝트의 주요 관심사

• 실제 서비스 가능한 완성도로 서버-클라이언트 구현(API, UI, 통신 규약, 기능성)
• 소켓 통신을 통한 동시 편집 구현
• 캐시, DB 통신 최소화를 통한 성능 최적화
• 서버 확장, 대용량 트래픽과 운영을 고려한 방식
• 성능테스트를 통한 튜닝
• 로직이 잘 보이고 확장, 유지보수하기 좋은 코드

사용 기술

• Spring Boot
• Spring Data JPA
• MySQL
• Redis
• nginx
• Stomp
• Docker
• Jenkins
• Naver Cloud Platform

프로젝트 구조

• Naver Cloud Platform의 서버로 구성되어 있습니다.
• github hook을 받아 Jenkins에서 CI/CD를 진행합니다.
• Jenkins측에서 Dockerhub에 이미지를 push하고, 앱서버 측에서 이미지를 pull합니다.
• Blue-green 방식으로 무중단 배포됩니다.
• 사용자의 요청은 nginx에 의해 프론트엔드 리소스와 api요청을 분기 처리됩니다.
• WAS는 3개 서버로 운용됩니다.
• DB는 Primary-Slave 구조의 2개 서버로 운용됩니다.

ERD

프론트

UI는 실사용 시 마주할 수 있는 다양한 시나리오에 대응하면서, 다양한 해상도에서 일관되게 작동되도록 구현되었습니다.

깃허브

https://github.com/leehyeonmin34/dambae200