- 캐비닛 대여 서비스: 42서울의 캐비닛 400여 개를 편리하게 대여 및 반납할 수 있는 서비스
- 효율적이고 원활한 서비스: 제한된 자원으로 많은 사용자가 원활하게 사용할 수 있는 서비스
- 관리자 플랫폼: 캐비닛 대여 현황 및 상태를 도식화하여 관리자의 작업이 수월한 플랫폼
- 클러스터 별 캐비닛 배치도를 바탕으로 실제 위치에 따른 캐비닛 대여 현황을 확인할 수 있습니다.
- 클러스터에 방문할 필요 없이 간편하게 캐비닛 대여 및 반납이 가능합니다.
- 캐비닛마다
READ/UPDATE가능한 메모장을 제공합니다.- 공유 캐비닛의 경우, 캐비닛 사용자들끼리만 공유 가능한 메모장을 제공합니다.
- 지속할 수 있고, 확장할 수 있는 서비스를 지향하고, 한정된 자원으로 증가하는 사용자들에게 양질의 서비스를 제공하기 위해 Cabi 팀은 다음과 같이 노력했습니다:
- CI 워크플로우를 구축하여 빌드, 테스트를 자동화하여 개발자들의 생산성을 높였습니다.
- CD 워크플로우를 구축하여 배포과정을 자동화하여 안정적인 서비스를 제공했습니다.
- 코드 리뷰를 통해 팀원들의 코드 품질을 향상시키고, 팀원들 간의 지식 공유를 통해 개발자들의 역량을 향상시켰습니다.
- 유지/보수와 기능 추가가 용이하도록 코딩 컨벤션을 정하고, 문서화 작업 및 이슈 관리를 체계화했습니다.
- Notion, Slack 등의 협업 툴들을 이용하여 팀원 간 정보 시차와 격차를 줄였습니다.
- 주기적이지만 유동적인 회의를 통해 목표와 분업을 명확히 하여 효과적인 협업을 진행했습니다.
- 시설관리팀과 실사용자들과 끊임없이 소통하면서 사용자 친화적인 서비스를 제공했습니다.
- 웹, 모바일 환경에서도 이용에 불편함이 없도록 반응형 웹 디자인을 적용했습니다.
- 사용자가 쉽게 캐비닛을 찾을 수 있도록 실제 사용 공간에 따른 맵을 표시했습니다.
- 원활한 사용자 경험을 위해 페이지를 포함한 캐러셀을 구현했습니다.
- 사용자가 서비스 상태를 명확하게 인지할 수 있도록 로딩과 에러 코드에 따른 렌더링을 구현했습니다.
- 정책이나 UI/UX 등 빠르게 변화하는 환경을 원활히 반영할 수 있도록 하드코딩을 피하고 props와 환경변수를 이용해 유지보수성을 높였습니다.
- 사용자가 층별로 캐비닛 정보를 조회할 때 빠른 응답속도를 위해 쿼리 최적화로 성능을 향상했습니다.
- 공유 캐비닛에서 발생하는 동시성 문제를 해결하기 위해 적절한 락 전략을 구성하고, 데드락을 방지하는 로직을 구현했습니다.
- 블랙홀에 빠진 사용자(퇴학 처리된 사용자)를 적절하게 처리하기 위해 스케줄러를 구성하여 자동으로 해당 사용자의 접근 및 권한을 정리하고 시스템에서 안전하게 제거하도록 했습니다.
- 연체/대여/반납 등 중요한 이벤트에 대해 사용자에게 알림을 제공함으로써 사용자가 서비스를 더욱 편리하게 이용할 수 있도록 했습니다.
- 로깅, 인증과 같은 횡단 관심사에 대해 AOP를 적용하여 중복되는 코드를 줄이고, 유지보수성을 높였습니다.
| 분야 | 기술스택 | 선정이유 |
|---|---|---|
| Common |  TypeScript |
컴파일 타임에 에러를 검출하여 서비스 과정에서 발생할 수 있는 오류를 최소화했습니다. |
 Prettier |
기본적인 코딩룰 적용으로 가독성 향상 및 코드 양식을 통일했습니다. | |
| Front-End |  React |
컴포넌트 기반의 UI 구현으로 재사용성을 높이고 상태 관리를 통해 성능을 최적화했습니다. |
 Recoil |
API 요청 최소화 및 컴포넌트간 공유하는 상태를 효율적으로 관리하여 리렌더링을 최적화했습니다. | |
 styled-components |
CSS in JS를 통해 컴포넌트와 스타일 간의 의존성을 제거하여 컴포넌트 단위의 재사용성을 향상했습니다. | |
 Vite |
esbuild를 통한 빠른 번들링과 HMR을 통해 생산성을 향상했습니다. | |
| Back-End |  Spring Framework |
Spring Framework 기반의 프로젝트로, 다양한 레퍼런스와 라이브러리를 활용하여 안정적인 서비스를 구축했습니다. |
 MariaDB |
활성화된 커뮤니티를 통해 여러 레퍼런스를 이용, 개발 중 발생하는 여러 문제들을 해결했습니다. | |
| Infra |  nginx |
로컬 개발환경에서 리버스 프록시를 통한 프론트/백엔드 서버 라우팅으로 개발의 편의성을 높였습니다. |
 AWS |
비용효율적이고 신뢰도가 높은 웹서비스로 판단, EC2/RDS/S3/CloudFront 등의 솔루션들을 사용하여 신속하고 안정적인 서비스 환경을 구성했습니다. | |
 Docker |
컨테이너를 통해 프러덕션과 로컬 환경의 동일성을 유지하고, 배포과정을 자동화하여 개발환경의 일관성을 유지했습니다. | |
 Github Actions |
CI/CD를 통해 테스트, 배포를 자동화하여 무중단 서비스를 지원, 효율성과 효과성을 높였습니다. | |
  Prometheus/Grafana |
애플리케이션 서버의 상태를 모니터링하여 이상 징후를 빠르게 파악하고 대응하여 서비스의 안정성을 높였습니다. |
| 🐇dongglee | 🍑 eunbikim | 🥔 gyuwlee | 🐬huchoi | 👻 hybae |
|---|
| 🍒 hyoon | 🍏 hyospark | 🙉 inshin | 🧑 |
🐶 jiwchoi |
|---|
| 🐯 joopark | 🚀sanan | 🐻 seuan | 🤑seycho | 😺 sichoi |
|---|
| 🍎 skim | 🍪 spark | ✏️yooh | 🪀 yoyoo | 🎒 yubchoi |
|---|
| 🌑 daewoole | 🐝 hyungnoh | 🐻❄️ jpark2 | 🎨 jusohn | 🤓 seonghmo | 🚀 wchae |
|---|
| 🐶 surlee | 🐣 hyowchoi | 👽 sohyupar | 🦝 jimchoi | 🛼 jeekim | 🍾 miyu | 🧸 gykoh |
|---|
 |
|---|