하동본부 화학물질 안전관리

2024.09 ~ 2024.10

🧑‍🔬 프로젝트 내 역할: 관리자 페이지 개발 담당 및 앱 개발 보조 (기여율 40%)

프로젝트 개요

Flash21 재직 중, 한국전력 하동빛드림본부 내부의 안전 관리 업무를 효율화하기 위한 애플리케이션을 개발했습니다.

  • 화학물질, 안전보호구, 위험구역 정보 제공 및 안전 검사 일정 체계적 관리
  • 기존 인쇄물 중심 안전관리 한계 보완, 사용자 중심 인터페이스 도입
  • 모바일 앱 중심으로 접근성 강화, 데이터 활용도 증대

1) 일정 관리 달력 컴포넌트 구현

  • 앱 UX와 통일성 유지를 위한 일정 조회 달력 컴포넌트 설계
  • 국내 공휴일 정보를 holidays-kr에서 받아 렌더링
  • 성과: 앱/웹 UX 통일성 유지, 고객 요구사항에 맞춘 경험 제공
일정 조회 달력 스크린샷
일정 조회 달력 스크린샷

2) React Native/웹 공통 날짜·시간 헬퍼 함수 설계

  • Luxon 기반으로 JS Date 한계를 보완한 프로젝트 맞춤형 유틸 설계
  • 재사용 가능한 API와 간단한 문서화로 팀 내 활용성 강화

3) 위험구역 방문 횟수 시각화

  • @nivo/line으로 방문 데이터를 직관적으로 표현
  • 관리자의 빠른 인지가 가능하도록 그래프 인터페이스 설계
  • 성과: 관리자 업무 효율성 향상
@nivo/line으로 구현한 위험지역 방문횟수 화면
@nivo/line 기반 위험지역 방문횟수 화면

4) QR 코드 기반 정보 제공 및 출력 기능

  • react-to-print로 QR 포함 화학물질 정보 인쇄 기능 추가
  • 요구에 맞춘 QR/출력 레이아웃 커스터마이징
인쇄용 QR을 확인하는 모달
인쇄용 QR 확인 모달 (일부 마스킹)
인쇄 미리보기 화면
인쇄 미리보기 화면

성과

  • 안전 관리 효율성과 데이터 활용성 강화
  • 앱과 웹의 UX 통일성 확보

배운 점

  • 불완전한 요구사항 속 고객 피드백 기반 문제 정의와 해결 역량 강화
  • 명확한 요구사항 정의와 현실적인 일정 관리의 중요성 체감
  • RN/웹 환경의 UX 통일성과 라이브러리 커스터마이징 경험 → 재사용성/유지보수성 고려한 설계