데이터 테이블

외부 API·데이터 소스와 연동해 목록·테이블 형태로 데이터를 표시할 때 사용하는 위젯입니다.

용도

• REST/GraphQL 등 API 응답을 테이블로 렌더링
• 동적 목록, 관리 테이블, 데이터 조회 화면

사용법

1. 툴킷의 데이터 시각화에서 데이터 테이블을 캔버스에 배치합니다.
2. 최소 3×5 크기입니다. 데이터 소스 탭에서 엔드포인트와 응답 매핑을 설정합니다.

설정 방법

• 스타일 & 콘텐츠: 라벨·설명, 강조 색상 등.
• 데이터 소스 탭:
  • 소스 커넥터: REST, GraphQL, Firebase, Supabase 등
  • HTTP 메서드·URL: 엔드포인트 주소
  • 요청 헤더: Key-Value 목록
  • 응답 매핑: 위젯 필드 ↔ JSON 경로 매핑
  • 연결 테스트: 샘플 응답 확인

라이브 미리보기

아래는 실제 데이터 테이블 위젯이 렌더된 모습입니다. 앱의 데이터 소스 탭에서 엔드포인트와 응답 매핑을 설정하면 연동된 데이터가 테이블로 표시됩니다.

데이터 테이블

연동된 데이터가 여기에 표시됩니다.

위는 실제 데이터 테이블 위젯 모습입니다. 앱의 데이터 소스 탭에서 엔드포인트·응답 매핑을 설정하면 연동된 데이터가 테이블로 표시됩니다.

설정에 따른 변경 확인

연결 테스트로 샘플 응답을 확인한 뒤, 실제 기능 페이지(/feature/카테고리ID)에서 테이블에 데이터가 표시되는지 확인합니다.