blocksuite 다운로드 - blocksuite 소스 코드 다운로드

blocksuite

기타 리소스

v0.19.5

다운로드

블록 스위트

경고

이 저장소는 주요 변경을 거치므로 PR을 수락하는 것을 중단합니다.

더 읽기 : #9045

개요

편집자에 대해 정말로 진지한 사람들은 자신의 프레임 워크를 만들어야합니다.

Blocksuite는 편집자 및 협업 애플리케이션을 구축하기위한 툴킷입니다. 일련의 컨텐츠 편집 인프라, UI 구성 요소 및 편집자를 독립적으로 구현합니다.

Blocksuite는 런타임으로 최소화 된 바닐라 프레임 워크를 기반으로 다양한 편집자를 구축하기위한 UI 구성 요소 라이브러리로 간주 할 수 있습니다. Blocksuite를 사용하면 다음을 수행 할 수 있습니다.

여러 자사 Blocksuite 편집자 재사용 :
- PageEditor : 광범위한 사용자 정의 및 유연성을 제공하는 포괄적 인 블록 기반 문서 편집기.
- EdgelessEditor : 옵트 인 캔버스 렌더링 지원이있는 그래픽 편집기이지만 PageEditor 와 동일한 풍부한 텍스트 기능을 공유합니다.
풍부한 Blocksuite 구성 요소 및 예제로 이러한 편집자를 사용자 정의, 확장 및 향상시킵니다. 모든 Blocksuite 구성 요소 (편집기 포함)는 기본 웹 구성 요소이므로 프레임 워크 공연 및 인기있는 프레임 워크와 상호 로프가 쉽습니다.
또는 기본 바닐라 프레임 워크를 기반으로 새로운 편집자를 처음부터 구축하십시오.

? Blocksuite는 현재 초기 단계에 있으며 구성 요소와 확장 기능이 여전히 개선되고 있습니다. 계속 지켜봐 주시기를 바랍니다.

동기 부여

Blocksuite는 Affine Knowledge Base에서 시작하여 설계 목표를 포함하여 다음을 포함합니다.

멀티 모드 편집 가능한 컨텐츠에 대한 지원 : 지식을 단일 진실의 소스로 고려할 때 다양한보기 모드 (예 : 텍스트, 슬라이드, 마인드 맵, 테이블)를 구축하려면 여전히 여러 가지 양립 할 수없는 프레임 워크가 필요합니다. 이상적으로, 콘텐츠의 표현이 어떻게 변경 되더라도 도움이되는 일관된 프레임 워크가 있어야합니다.
복잡한 지식 구성 및 시각화 : 기존 편집자는 일반적으로 단일 문서를 편집하는 데 중점을 두지 만 종종 얽힌 참조와 관련된 복잡한 구조를 다루는 데 부족합니다. 이를 위해서는 여러 문서에서 상태를 기본적으로 관리해야합니다.
협업 준비 : 실시간 협업은 종종 선택적 플러그인으로 간주되지만 실제로는 편집자 상태 관리를 위해 기본 CRDT 기술을 기본적으로 사용할 수있어보다 명확하고 신뢰할 수있는 데이터 흐름을 구축 할 수 있습니다.

Affine의 개발 과정에서, Blocksuite는 단순히 사내 편집자가되어 다재다능한 프레임 워크로 진화하고 있음이 분명해졌습니다. 그렇기 때문에 우리는 오픈 소스를 선택하고 블록 수트를 독립적으로 유지하기로 결정했습니다.

특징

Blocksuite 편집기를 사용하면 Affine의 모든 편집 기능을 선택적으로 재사용 할 수 있습니다.

아핀 데모

그리고 후드 아래에서 바닐라 블록 스위트 프레임 워크는 다음을 지원합니다.

사용자 정의 블록 및 인라인 임베드 정의.
문서의 문서 스트리밍 메커니즘을 기반으로 증분 업데이트, 실시간 협업 및 분산 데이터 동기화.
문서 편집을 위해 설계된 반응 후크와 유사한 명령 메커니즘을 기반으로 한 유형-안전 복잡한 편집 논리 작성.
문서의 지속성과 블록 스냅 샷 및 변압기를 기반으로 다양한 타사 형식 (Markdown 및 HTML)과의 호환성.
여러 문서에서 스케줄링하고 여러 편집자에서 하나의 문서를 재사용합니다.

Blocksuite를 시도하려면 빠른 시작 예제를 참조하고 @blocksuite/presets 의 사전 설정 편집기부터 시작하십시오.

건축학

Blocksuite와 Affine의 관계는 Monaco 편집기와 VSCODE 사이의 관계와 유사하지만 한 가지 주요 차이점 : Blocksuite는 Affine Codebase를 기반으로 자동 생성되지 않지만 다른 기술 스택과 독립적으로 유지 관리합니다. Affine은 React를 사용하는 동안 Blocksuite는 웹 구성 요소를 사용합니다.

이 차이점은 Blocksuite가 구성 요소 중심 철학을 기반으로 명확한 경계를 설정하여 다음을 보장했습니다.

Affine 및 기타 프로젝트는 특권없이 구성 요소를 통해 블록 수트를 동일하게 재사용하고 확장해야합니다.
React 또는 다른 프레임 워크를 사용하는지 여부에 관계없이 Blocksuite 구성 요소를 쉽게 재사용 할 수 있습니다.

이를 위해 Blocksuite 프로젝트는 헤드리스 프레임 워크와 미리 빌드 편집 구성 요소의 두 그룹으로 분류되는 주요 패키지로 구성됩니다.

뼈대
`@blocksuite/store`	공동 작업 문서를 모델링하기위한 데이터 계층. CRDT 라이브러리 YJS를 기본적으로 구축하여 실시간 공동 작업 및 시간 여행 기능으로 모든 Blocksuite 문서에 전원을 공급합니다.
`@blocksuite/inline`	인라인 편집을위한 최소한의 풍부한 텍스트 구성 요소. Blocksuite를 사용하면 다른 블록 노드의 풍부한 텍스트 내용을 다른 인라인 편집기로 분류 할 수 있으므로 복잡한 콘텐츠가 편리하게 합성 가능합니다. 이는 기존의 풍부한 텍스트 편집 기능을 구현하는 데 필요한 복잡성을 크게 줄입니다.
`@blocksuite/block-std`	편집 가능한 블록 모델링을위한 프레임 워크 공유 라이브러리. 기능은 블록 필드, 이벤트, 선택, 클립 보드 지원 등의 구조를 다룹니다.

구성 요소
`@blocksuite/blocks`	각 블록에 속하는 위젯을 포함하여 사전 설정 편집기를 구성하기위한 기본 블록 구현.
`@blocksuite/presets`	편집자 ( `PageEditor` / `EdgelessEditor` ) 및 보조 UI 구성 요소를 포함한 플러그 앤 플레이 편집 가능한 구성 요소 ( `CopilotPanel` , `DocTitle` ...).