8. 상태 다이어그램(State Diagrams)

상태 다이어그램(State Diagrams)

시스템이나 객체의 상태 전이를 정의합니다. 시스템이 어떤 조건에서 어떤 상태로 전환되는지를 규명합니다.

표

State	Description	Transition	Trigger
Idle	프로그램이 대기 상태인 경우	-	프로그램 시작
Tool Selected	사용자가 도구를 선택한 상태	selectTool(tool: Tool)	사용자가 도구 선택
Drawing	사용자가 도형을 그리는 상태	drawShape(shape: Shape)	사용자가 도형 그리기 시작
Color Changed	도형의 색상이 변경된 상태	changeColor(color: Color)	사용자가 색상 변경
Resizing	사용자가 도형의 크기를 조정하는 상태	resizeShape(shape: Shape)	사용자가 크기 조정
File Saved	파일이 성공적으로 저장된 상태	saveFile(filePath: String)	사용자가 파일 저장
Error	오류가 발생한 상태	handleError()	오류 발생

필드와 값

1. State
   • 시스템의 상태를 나타냅니다.
2. Description
   • 각 상태에 대한 설명입니다.
3. Transition
   • 상태 간의 전이를 나타내는 조건이나 메서드입니다.
4. Trigger
   • 상태 전이를 유발하는 이벤트나 사용자 행동입니다.

Xstate, React Query 등을 활용해 복잡한 상태 관리 로직에 대한 요령을 추가 서술 할 수 있습니다.