6개 AI 모델로 불량률 85% 감소를 달성한 차세대 자동차 제조 모니터링 시스템
- 🎯 불량률 85% 감소 - AI 예측 분석으로 품질 혁신
- 🤖 6개 AI 모델 적용 - 공정별 전문 AI 시스템
- 📊 99% 실시간 처리율 - 1분 간격 실시간 AI 분석
- 🔍 24/7 무인 감시 - AI 자동 모니터링 시스템
- 통합 문의: 복합 이슈를 다중 AI가 협업하여 해결
- 안전 전문가: GPT 기반 안전 분석 및 솔루션 제공
- 기술 전문가: Gemini 기반 기술 상담 및 문제 진단
- 실시간 API 연동: 백엔드 AI 모델과 실시간 통신
- 실시간 표면 검사: Azure Storage 연동 이미지 AI 분석
- 자동 불량 분류: 스크래치, 도장 결함 AI 자동 탐지
- 기계별 AI 통계: 실시간 결함률 분석 및 예측
- 시뮬레이터 연동: AI 모델 테스트 및 검증 환경
- 설비 이상 예측: 전류/진동 패턴 머신러닝 분석
- 복합 이상 탐지: 다중 센서 데이터 AI 융합 분석
- 공정 효율 최적화: 머신러닝 기반 생산성 개선
- 유압펌프 및 생산품 상태 목록
- 유압 펌프 실시간 현황 그래프
- 프레스 생산품 결함 실시간 현황 모니터링
- 로봇 용접기 상태 목록
- 로봇 용접기 상태 차트 모니터링
- 시뮬레이터 제어
- 전체 장비 상태 목록
- 도장 표면 결함 실시간 현황 모니터링
- 전착 도장 설비 실시간 현황 모니터링
- 도장 설비 시뮬레이터 제어
- 조립 라인 상태 목록
- 조립 공정 효율성 상태 모니터링
- React 19.1.1 - 최신 React 기반 UI
- React Router Dom - SPA 라우팅 시스템
- Styled Components - 모던 CSS-in-JS 스타일링
- Chart.js + Recharts - 고급 데이터 시각화
- Lucide React - 모던 아이콘 라이브러리
- Axios - HTTP 클라이언트 라이브러리
- WebSocket - 실시간 데이터 통신
- WebSocket - 이상 알림 + 모니터링 데이터
- Auto-reconnection - 자동 재연결 및 오류 복구
- 1분 간격 업데이트 - 초고속 실시간 처리
- 4개 공정별 통합 모니터링 인터페이스
- 실시간 데이터 시각화 및 차트 업데이트
- 장비 상태 목록 및 알림 시스템
- 카테고리별 이슈 선택 UI
- 다중 AI 모델 상담 결과 표시
- 실시간 채팅 인터페이스
- 도장/차체 공정 시뮬레이터 원격 제어
- 실시간 시뮬레이션 상태 모니터링
- 테스트 시나리오 실행 및 결과 확인
- 회원가입/로그인 인터페이스
- 관리자 페이지 및 권한 관리
- 개인 설정 및 마이페이지
- 공지사항 및 이슈 트래킹
- 게시글 작성/수정/삭제 기능
- 팀원 간 소통 플랫폼
| 팀원 | 담당 페이지 | 설명 |
|---|---|---|
| 김태현 | PaintingMonitoring | 도장 공정 모니터링 페이지 구성 및 api 연동 |
| 이원욱 | PaintingMonitoring | 도장 공정 모니터링 페이지 구성 및 api 연동 |
| 김해연 | PressMonitoring | 프레스 공정 모니터링 페이지 구성 및 api 연동 |
| 배소연 | PressMonitoring, Board | 프레스 공정 모니터링 페이지 구성 및 api 연동, 게시판 페이지 |
| 권도윤 | AssemblyMonitoring | 의장 조립 공정 모니터링 페이지 구성 및 api 연동 |
| 한다현 | VehicleMonitoring, Admin, Dashboard, ChatBot ui | 통합 모니터링, 차체 공정 모니터링, 관리자, 회원 가입, 로그인, 메인 페이지 구성 및 api 연동, 챗봇 UI 구성 |
- Node.js 16.0.0 이상
- npm 또는 yarn
# 프로젝트 클론
git clone [repository-url]
cd smart_FE
# 의존성 설치
npm install# .env 파일 생성
REACT_APP_API_BASE_URL=http://localhost:8088
REACT_APP_PAINTING_SURFACE_API_BASE_URL=http://localhost:8089# 개발 모드 실행
npm start브라우저에서 http://localhost:3000 접속
# 프로덕션 빌드
npm run buildsrc/
├── api/ # API 연동 모듈
│ ├── auth.js # 인증 API
│ ├── client.js # API 클라이언트
│ ├── index.js # API 통합 모듈
│ ├── paintingSurfaceDefect.js # AI 결함 탐지 API
│ └── user.js # 사용자 API
├── components/
│ ├── charts/ # AI 데이터 시각화
│ │ ├── ProcessChart/ # 공정별 AI 차트
│ │ └── RealTimeChart/ # 실시간 차트
│ ├── layout/ # 레이아웃 컴포넌트
│ │ ├── Header/
│ │ ├── PageLayout/
│ │ └── Sidebar/
│ ├── list/ # 리스트 컴포넌트
│ └── ui/
│ ├── ChatBot/ # AI 챗봇 시스템
│ │ ├── components/ # 챗봇 컴포넌트
│ │ ├── config/ # 설정
│ │ ├── data/ # AI 이슈 데이터
│ │ ├── hooks/ # AI 상담 로직
│ │ ├── services/ # API 서비스
│ │ ├── styles/ # 스타일링
│ │ └── utils/ # 유틸리티
│ ├── EquipmentList/ # 장비 목록
│ └── PageTitle/ # 페이지 제목
├── hooks/ # 커스텀 훅
├── pages/ # 공정별 모니터링 페이지
│ ├── Admin/ # 관리자 페이지
│ ├── AssemblyMonitoring/ # 조립 공정 모니터링
│ ├── Board/ # 게시판
│ ├── Dashboard/ # 통합 대시보드
│ ├── Home/ # 홈 페이지
│ ├── MyPage/ # 마이페이지
│ ├── PaintingMonitoring/ # 도장 공정 모니터링
│ ├── PressMonitoring/ # 프레스 공정 모니터링
│ ├── Register/ # 회원가입
│ └── VehicleMonitoring/ # 차체 공정 모니터링
├── router/ # 라우팅
├── services/ # 서비스 계층
└── styles/ # 글로벌 스타일
| 지표 | 성능 | 설명 |
|---|---|---|
| 불량률 감소 | 85% | AI 예측 분석 도입 후 품질 개선 |
| 실시간 처리율 | 99% | 1분 간격 실시간 AI 데이터 처리 |
| AI 모델 수 | 6개 | 공정별 특화된 AI 전문가 시스템 |
| 무인 모니터링 | 24/7 | AI 기반 상시 자동 감시 체계 |
프로젝트에 대한 문의사항이나 제안이 있으시면 이슈를 생성해 주세요.
🚀 AI가 이끄는 스마트 팩토리의 미래를 경험해보세요!