React로 무한 캔버스 앱을 만드는 tldraw SDK

핵심 요약

• tldraw는 React 기반 무한 캔버스 엔진으로, 커스텀 셰이프·도구·바인딩·UI 컴포넌트를 만들 수 있는 완전 확장형 SDK다.
• 압력 감지 드로잉, 기하학적 셰이프, 리치 텍스트, 화살표, 스냅 기능, 이미지·비디오 지원 등 드로잉과 다이어그래밍 기능을 제공한다.
• Editor API로 런타임에 캔버스를 제어할 수 있으며, LLM 통합과 AI 에이전트 구축을 위한 캔버스 프리미티브를 지원한다.
• @tldraw/sync를 통해 자체 호스팅 가능한 실시간 협업 기능을 제공한다.
• DOM 기반 렌더링으로 YouTube, Figma, GitHub 등 임베드된 웹사이트를 지원하며, 데스크톱·터치·태블릿·모바일 전 플랫폼에서 작동한다.
• Google, Shopify, BlackRock, Autodesk, ClickUp, Replit, Luma, Runway 등 50개 이상의 상용 제품에서 사용 중이다.
• 개발 서버는 localhost:5420에서 실행되며, Node.js 20.0.0 이상이 필요하다.
• tldraw.dev/docs에서 문서와 사례 연구를 제공하며, 5.1.x부터는 패키지에 DOCS.md와 RELEASE_NOTES.md가 포함된다.
• Multiplayer, Agent, Workflow, Chat, Image Pipeline, Branching Chat, Shader 스타터 킷이 MIT 라이선스로 제공된다.
• 개발 사용은 무료이나 프로덕션 사용은 라이선스 키가 필요하다.