Git 상태 전이 시뮬레이션을 통한 인터랙티브 학습 플랫폼 구현

Context

Git의 복잡한 멘탈 모델을 단순 텍스트 기반으로 학습하는 기존 방식의 한계 분석. Staging, Committing 등 추상적인 파일 상태 변화를 시각적으로 인지하지 못하는 사용자 경험의 병목 지점 파악.

Technical Solution

• Workspace, Staging Area, Local Repository, Remote Repo 등 4단계 영역의 상태 전이 모델을 정의한 시뮬레이션 엔진 설계
• 실제 Git CLI 명령어를 입력받아 내부 상태 객체에 반영하는 CLI Sandbox 인터페이스 구현
• React와 TypeScript를 활용한 상태 기반 UI 렌더링으로 명령 실행에 따른 실시간 데이터 흐름 시각화
• Tailwind CSS 기반의 반응형 레이아웃을 적용한 단계별 가이드 시스템 구축
• Vercel을 통한 서버리스 배포로 인프라 관리 비용 제거 및 접근성 확보