✨ 프로젝트 소개

• NDXPRO ADMIN WEB은 NGSI-LD 기반 디지털 트윈 데이터를 정제하고 모델링·운영할 수 있는 NDXPRO 플랫폼의 핵심 관리 시스템입니다.
• 프로젝트 참여 인력
  • FE: 3명
  • BE: 3명
  • 디자이너: 1명
• 프로젝트 소개 URL
• 프로젝트 소개 영상

✨ 내가 기여한 부분

🧩 Data Manager V3 기능 설계 및 개발

출처: 이에이트(주)

• React Flow를 활용한 시각적 데이터 모델링 UI 구성
  • 다양한 Attribute, Data Model, Relationship 정보를 시각적으로 다룰 수 있도록 Dagre 트리 (Horizontal) 형식 관계도 UI를 설계
  • React Flow 기반으로 데이터 모델을 카드 형태의 노드로 표현하고, 노드 간 드래그앤드롭으로 관계(Relationship)를 생성할 수 있도록 구현
  • 디자이너와 협업해 카드 구조, 컨텍스트 메뉴, 도구 패널 등 사용자 중심의 모델링 환경을 구성
• Excel Import/Export 기능 고도화
  • 대량 데이터 일괄 등록을 위해 Excel 업로드/다운로드 기능을 구현
  • 클라이언트 측에서 셀/행 단위의 유효성 검사 결과를 시각적으로 표현
    • 백엔드에 요청하여 셀 오류 메시지(row, column, reason) 포함 응답을 받고
    • 테이블 UI에 오류 셀을 하이라이팅 및 에러 메시지 툴팁 제공
  • 백엔드와 포맷 협의 및 설계 진행, 유효성 기반 에러 UX까지 포함하여 사용자 편의성 향상

🔐 인증 세션 관리 및 로그인 리팩토링

• Axios Interceptor 기반 인증 세션 자동 관리 시스템 구현
  • 모든 요청에 쿠키 기반 accessToken을 자동 삽입하여 인증 누락 방지
  • 401 발생 시 refreshToken을 통한 토큰 갱신 → 실패 없이 기존 요청 자동 재시도
  • 갱신 중인 요청이 중복되지 않도록 isRefreshing 플래그와 failedQueue를 활용한 큐 처리 로직 구현
  • refreshToken 만료 혹은 예외 발생 시, 사용자 세션 초기화 및 강제 로그아웃 처리