공공 도로의 돌발 상황(사고, 정체, 무단횡단 등)을 CCTV와 AI로 실시간 감지하고, 관제 요원이 신속하게 대응할 수 있는 시스템 필요.

RAVIT은 공공 CCTV 데이터와 AI를 활용한 ITS(Intelligent Transport Systems) 도로 관제 솔루션입니다. 도로 돌발 상황 감지, 좌회전 감지, 무단횡단 감지 등 실시간 교통 상황을 모니터링하고 알림을 제공합니다. 전신 프로젝트인 BCITS로 부천시 공공기관 납품을 완료했습니다.

[담당 범위]
프론트엔드 개발자로서 UI/UX 기획부터 개발 환경 구축, 기능 개발, 배포, CI/CD까지 프론트엔드 전 영역을 전담했습니다.

[해결 방안]

1. UI/UX 기획
- 관제 요원의 사용 시나리오 분석 및 정의
- Draw.io를 활용한 와이어프레임 작성
- 실시간 모니터링에 최적화된 대시보드 UI 설계

2. 프론트엔드 개발 환경 구축
- npm workspace 기반 모노레포 구축
- Atomic Design Pattern 도입으로 컴포넌트 재사용성 확보
- React-Query 도입으로 서버 상태 관리 효율화
- Storybook 도입으로 컴포넌트 문서화 및 독립 테스트 환경 구축

3. 핵심 기능 개발
- 실시간 도로 CCTV 영상 스트리밍 표시
- 돌발 상황(사고, 정체, 낙하물 등) 실시간 알림
- 돌발 상황 이력 관리 (리스트뷰, 맵뷰)
- 도로 카메라, 서버 등 장비 관리 기능
- AI Hyper Parameter 및 감지 Rule 관리 기능
- 유저 관리 (회원가입, 로그인, 권한 관리)
- 데이터 시각화 대시보드

4. 배포 및 CI/CD
- Docker, Nginx를 활용한 사내 개발 서버 배포
- Bitbucket Pipeline 기반 CI/CD 구축
- PR 시 테스트 빌드, main 브랜치 머지 시 자동 배포

[기술적 의사결정]
- 모노레포 구조 채택: 관제 시스템, 관리자 페이지 등 여러 앱을 효율적으로 관리
- Atomic Design Pattern: 관제 UI의 일관성 유지 및 컴포넌트 재사용
- Storybook: 디자이너 없이 개발자가 UI를 검증할 수 있는 환경 확보

[성과]
- BCITS로 부천시 공공기관 정상 납품 완료
- 기획부터 배포까지 프론트엔드 전 과정 독립 수행 경험 확보
- 모노레포, CI/CD 등 개발 인프라 구축 역량 확보