캔버스 사용하기
PageFlow 캔버스는 애플리케이션 데이터를 편집하는 대신 라우트 그래프를 탐색하도록 설계되었습니다.
이동과 확대·축소
- 스크롤하거나 트랙패드를 사용해 포인터를 중심으로 확대·축소합니다.
- 빈 캔버스 공간을 드래그해 뷰포트를 이동합니다.
- 페이지 카드를 선택해 초점을 맞추고 관계를 표시합니다.
- 브라우저 뷰포트 컨트롤로 모바일과 데스크톱 미리보기를 비교합니다.
페이지에 초점 맞추기
페이지를 선택하면 연결된 페이지가 화면에 들어오고, 선택한 미리보기가 활성 iframe으로 전환되며, 탐색 핫스팟이 표시됩니다. 전체 그래프에 필요한 것보다 많은 맥락이 있을 때 초점 보기가 유용합니다.
라우트 그룹 탐색하기
공통 경로 구간이 있는 라우트는 덱으로 나타날 수 있습니다. 덱을 열어 다음 단계를 확인하세요. PageFlow는 활성 그룹의 이동 경로를 유지하고 단계 사이를 애니메이션으로 전환하여 현재 맥락을 명확히 보여 줍니다.
연결 읽기
연결에는 방향이 있습니다. 나가는 선은 출발 페이지에 대상 페이지로 이동하는 알려진 방법이 있음을 뜻합니다. 선이 없다고 탐색이 불가능한 것은 아닙니다. 계산된 대상은 애플리케이션이 노출한 뒤에만 발견됩니다.
미리보기 갱신하기
PageFlow는 제한된 대기열에서 오래된 페이지를 캡처합니다. 선택된 페이지와 보이는 페이지가 우선 처리됩니다. 라우트와 링크 변경은 HMR로 전달되며 기존 썸네일은 새 캡처가 준비될 때까지 유지됩니다.
팁
- 홈 또는 기본 진입 라우트에서 시작하세요.
- 큰 애플리케이션에서는 한 번에 하나의 라우트 그룹에 들어가세요.
- 초기화 쓰기 작업이 있는 페이지에 초점을 맞추기 전에 테스트 데이터를 사용하세요.
- 페이지가 계속 준비되지 않으면 명시적 준비 신호를 추가하세요.