👀 서비스 소개

QR 코드 기반 스마트 케이블 관리 웹 앱 플랫폼

케이블 설치 및 제거 과정에서 발생하는 수작업의 번거로움과 오류를 줄이고, 관리 효율성을 극대화하는 스마트 케이블 관리 서비스

📅 프로젝트 기간

2024.08.02 ~ 2024.09.12 (6주)

⭐ 주요 기능

• QR 코드 생성 및 인쇄
• 작업자 선택하여 알림 및 메일 전송
• 실시간 알림
• 엑셀 보고서 생성
• 로그 및 유지보수 내역 필터링
• 채팅형 FAQ
• 관리자 일정 관리
• 차트를 이용한 데이터 시각화
• 자동 로그아웃

⛏ 기술스택

구분	내용
사용언어
라이브러리
개발도구
서버환경
데이터베이스
협업도구

⚙ 시스템 아키텍처

📌 서비스 흐름도

📌 ER다이어그램

🖥 화면 구성

관리자 웹

로그인 화면

메인 대시보드

점검 관리

QR 코드

로그 내역

유지보수 내역

사용자 관리

작업자 앱

메인

QR인식 후 케이블 정보

점검

👨‍👩‍👦‍👦 팀원 소개

곽효정	김건이	이승지	박선우
Back-End / Web	Front-End / App	Back-End / Web	Back-End / DB
ZXing 라이브러리를 활용 QR Chart.js 사용 데이터 시각화 Full Calendar 활용 일정 관리 Apache POI 활용 엑셀 보고서	MLkit 활용 QR 인식 최적화 AES 암호화 통한 데이터 보안 Retrofit2 이용 안정적 서버통신 AWS EC2 배포 환경	로그 및 유지보수 페이지 필터링 작업자 지정 및 앱에 알림 전송 알림과 동시에 이메일 전송 SockJS 이용 실시간 알림 확인	로그인, 회원가입, 정보 수정 더미 데이터 생성 및 DB 구축 ChatGPT 활용 채팅형 FAQ 구축 파인튜닝 통해 질문의 정확도 향상
github	github	github	github

🤾‍♂️ 트러블슈팅

랜더링 시 데이터 테이블 초기화 오류

필터 적용 시에만 테이블을 초기화하여 해결

시뮬레이터에서 가능하던 QR 인식이 배포 후 실제 핸드폰에서 인식 오류

정확한 영역을 지정해서 인식을 높임

답변 중 할루시네이션 오류

프롬프트 엔지니어링을 통해 더 정확한 응답 생성

HTTPS 전환 과정에서 403 Forbidden 오류 및 CORS 문제 발생

CORS 설정을 구체적으로 지정
백엔드 -> @CrossOrigin 수정, Nginx -> CORS 추가