포트폴리오
웹TOVLAB 자체 구현 ShowcaseFEATURED
InspectFlow 품질 검사 워크스페이스 Showcase
검사 대기 목록, 이미지 비교, 판정 후보 선택, 검토 상태 변경 UI를 구현한 TOVLAB 자체 제작 Showcase입니다. LOT·검사 건수·판정 후보는 포트폴리오 시연용 fixture입니다.
프로젝트 화면
PC 화면
1모바일 웹
1주요 기능
검사 후보 표시판정 기준 보기통과·재촬영·보류 선택LOT 이력검사 대기열모바일 화면
구축 내용
실제 개발 범위에 포함된 주요 작업입니다.
주요 구현 범위
- 검사 후보와 확인 영역을 보여 주는 워크스페이스
- 통과·재촬영·보류를 선택하고 판정 결과를 저장하는 UI
- 검사 대기열·LOT 이력 메뉴와 모바일 레이아웃
기술 스택
Next.js 16 (App Router)React 19TypeScriptReact Context APIuseReducerCSS VariablesCustom CSSESLint 9
작업 배경과 확인한 문제
- 사용자가 현재 상태와 다음 조치를 확인할 수 있도록 화면을 구성했습니다.
- 화면에 보이는 값은 포트폴리오 시연용 fixture로 분리했습니다.
진행 결과
- 이 항목은 TOVLAB 자체 구현 Showcase입니다. 이미지에 보이는 항목과 수치는 UI와 상태 흐름을 확인하기 위한 포트폴리오 fixture입니다.
우선 적용 범위
- 검사 후보 표시
- 판정 기준 보기
- 통과·재촬영·보류 선택
- LOT 이력
이후 확장 방향
- 실제 이미지 수집 경로 연결
- 검사 기준 버전 관리
- LOT 이력과 권한 관리
유사하게 적용할 수 있는 경우
- 상태 확인과 다음 조치 UI가 필요한 업무 화면
- 필터·선택·검토 단계를 가진 웹 서비스
상담 전에 정리하면 좋은 내용
- 확인할 상태와 다음 조치 규칙
- 실제 데이터·권한·연동의 범위
- 모바일에서 우선할 업무 흐름