에디터는 Caliu에서 가장 오래 머무는 곳이라서, 가장 공을 들여요. 앱마다 플랫폼 자체의 텍스트 기술 위에 만든 자기만의 에디터가 있고, 모두 한 가지 약속을 지켜요. 저장되는 건 일반 Markdown이고, 눈에 보이는 건 그 Markdown이 입력하는 즉시 제자리에서 서식을 입은 모습이에요.
하나의 순환, 세 개의 에디터
Caliu의 모든 에디터는 같은 세 가지 일을 해요.
- 읽기: 노트의 Markdown을 읽고 제목, 목록, 할 일, 인용, 코드, 표 같은 구조를 파악해요.
- 보여 주기: 그 구조를 서식이 적용된 텍스트로 보여 주고, 필요할 때까지 문법은 숨겨요.
- 쓰기: 편집한 내용을 다시 Markdown으로 써요. 다른 어떤 Markdown 앱에서도 읽을 수 있는 같은 일반 텍스트예요.
노트를 열기만 해서는 노트가 바뀌지 않아요. 노트는 편집할 때만 바뀌기 때문에, 다른 기기에서 노트를 읽어도 몰래 다시 쓰이는 일은 없어요.
웹에서: ProseMirror
웹 에디터는 Tiptap으로 만들었고, Tiptap은 ProseMirror 위에 올라가 있어요. ProseMirror는 잘 알려진 많은 글쓰기 도구가 쓰는, 브라우저용 리치 텍스트 편집 도구 모음이에요. 코드 블록은 많은 코드 에디터가 쓰는 하이라이터인 Shiki로 색을 입혀요.
iPhone, iPad, Mac에서: Apple의 자체 텍스트 시스템
Apple 에디터는 Apple의 네이티브 텍스트 뷰(iPhone과 iPad에서는 UITextView, Mac에서는 NSTextView)와 Apple 자체 앱을 움직이는 텍스트 엔진인 TextKit 위에 바로 만들었어요. Markdown은 GitHub와 같은 사양을 따르는 Apple의 swift-markdown 라이브러리로 읽고, 원래 쓴 방식을 그대로 살려서 다시 써요. _italic_ 대신 *italic*으로 썼다면 그대로 남아요.
노트 전체가 하나로 이어진 텍스트 뷰예요. 그래서 문단을 넘나드는 선택, 스크롤, 편집이 자연스럽게 느껴져요. 표나 코드 블록처럼 일반 텍스트가 아닌 것은 텍스트 위에 얹은 별도의 뷰로 그려요.
Android에서: 플랫폼의 텍스트 필드
Android 에디터는 Android 자체의 텍스트 필드 위에 만들었고, 입력하는 대로 스타일이 입혀져요. Markdown은 commonmark-java로 읽고, Apple 앱과 같은 기준으로 검증해요. 수백 개의 샘플 문서가 Apple 기기에서와 마찬가지로 Android 에디터에서도 들어간 모습 그대로 나와야 해요.
네이티브 텍스트가 중요한 이유
텍스트 편집은 앱이 잘 해내기 가장 어려운 일 중 하나예요. 텍스트 엔진을 새로 만드는 대신 각 플랫폼의 엔진 위에 만들었기 때문에, Caliu는 기기가 이미 할 줄 아는 모든 것을 그대로 누려요. 자동 수정과 맞춤법 검사, 받아쓰기, 한국어, 일본어, 중국어 입력기, VoiceOver와 TalkBack 같은 화면 읽기 프로그램, 그리고 익숙한 선택 핸들과 단축키까지요.
Markdown 보기
실제로 무엇이 저장되어 있는지 보고 싶다면 소스 모드로 바꿔 보세요. #과 *까지 모두 포함한 원본 Markdown이 보이고, 거기에서 바로 편집할 수도 있어요. 소스 모드 문서를 참고하세요.