1. https://github.com/tldraw/tldraw/tree/main/apps/www : yjs가 아닌 liveblocks을 사용
2. https://github.com/nimeshnayaju/yjs-tldraw : yjs + tldraw 합쳐서 multiplayer drawing 가능
3. https://github.com/yjs/y-websocket/blob/master/bin/server.js : 기본 yjs server -> 이용해서 어떻게 wss server만드는지 알아보기.
4. tldraw -> react native로: 필요한 기능을 어떻게 rendering할지 tldraw 코드 살펴보기.
- 살펴봐야할 코드: https://github.com/tldraw/tldraw/tree/main/packages/core (tldraw/core rendering 관련)
tldraw패키지는 editor component를 제공하고, 그 editor component는 jsx element를 리턴하는데, 이때 그 안에서 사용되는 renderer는 core패키지에서 가져온다.
- packages/tldraw contains the source for the @tldraw/tldraw package. This is an editor as a React component named <Tldraw>. You can use this package to embed the tldraw editor in any React application.
- packages/core contains the source for the @tldraw/core package. This is a renderer for React components in a canvas-style UI. It is used by @tldraw/tldraw as well as several other projects.
- https://reactjsexample.com/the-tldraw-core-renderer-and-utilities/
- https://news.hada.io/topic?id=5401 (geeknews에서 나온 부분)
'Collaborative Editing' 카테고리의 다른 글
Editing: CSS property (0) | 2023.09.21 |
---|---|
[동시 협업 툴-5] 간단한 Yjs사용한 앱 코드 분석 (3. y-websocket server with persistence) (0) | 2023.01.24 |
[동시 협업 툴-4] 간단한 Yjs사용한 앱 코드 분석 (2. Yjs Docs 살펴보기) (0) | 2023.01.19 |
[동시 협업 툴-3] 간단한 Yjs사용한 앱 코드 분석 (1. SolidJS 사용에 관해) (0) | 2023.01.17 |
[동시 협업 툴-2] Collaborate and Replicate data with CRDTs (youtube 강의 요약) (0) | 2023.01.14 |