I WRITE DOWN MY THOUGHTS, CREATE DESIGNS,

TAKE PHOTOS & VIDEOS, AND LISTEN TO MUSIC MOST OF THE TIME.

(COPYRIGHT © 2024 ANZI. ALL RIGHT RESERVED)

노트를 만들 결심그런데 이제 포기한

ID.72 / 2026.02.26. 12:51

LAYOUT

무슨 생각이었는지는 모르겠지만, 내가 생각하는 이상적인 노트가 세상에 없는 것 같아서 그냥 만들어보자는 생각을 한 적이 있다. 결과적으로 실패했고 원하는 것을 만드는 근처에도 못 가긴 했지만 에디터까지는 만든게 있어서 기록차 포스팅을 하기로 했다. 그 앱의 이름은 LAYOUT이었는데 대충 어떤 늬앙스인지는 알겠지만 당시 왜 그렇게 지었는지 당장은 생각이 나질 않는다.

노트 컨셉은 지금 생각해보면 현재 Tana 라는 앱과 유사한데, 기술 부족으로 이 컨셉을 프로토타이핑하지는 못했고 그냥 Facebook의 lexical을 이용한 에디터와 몇 가지 컴포넌트 만듦새를 구현하는데 그쳤다. 이걸 만드는 당시에는 바이브 코딩 이전이었기 때문에 한땀 한땀 만드느라 시간이 꽤 오래 걸렸지만, 방망이 깎는 노인 느낌으로 만드는 과정에서는 꽤 재미있게 작업을 했던 기억이다. 그게 벌써 4년 전
처음에는 브라우저에서 동작하는 형태로 구현하다가 중간에 Electron 프로젝트로 변경하면서 진행했고, 만드는 중에 그만두긴 했지만 나름대로 Typography의 무게감이라던가 만듦새라던가, 사용할 때 느껴지는 가벼운 느낌은 꽤 마음에 들게 나와서 중도하차한 프로젝트이긴 했지만 나름대로의 의미가 있는 작업이다.

Tech Stacks & Library

4년 전 스택이기 때문에 지금 보면 조금 올드한 스택일 수는 있다.
현재 스택은 대체로 AI 결정해서 현재에도 유효한 스택인지는 나도 모름..

• React & Electron

Stitches (Deprecated)

Radix UI & Colors

cmdk

dexie

lexical

mobx

Features

• Basic Text Editor

• Typography

• Floating Toolbar

• Light & Dark Theme

• Spotlight

• Icon Picker

• Dialog, Toast, Context Menu, Tabs

Prototype

🔗 https://layout-mu.vercel.app/#/layout

당시 프로토타이핑 중이던 Web 배포 버전이 남아있어서 남겨둠. 데이터는 브라우저의 IndexDB를 사용하므로 서버로 전송되는 정보는 아무것도 없기 때문에 막 써봐도 된다. 최종 버전과는 컬러감이라던가 UI 디테일 등이 거친 상태의 버전이다.

Shortcuts & Typography

Spotlight
meta + k
Toggle Sidebar
meta + \
Toggle Theme
meta + /
Underline
meta + u
Italic
meta + i
Bold
meta + b
Sup
meta + shift + =
Code
meta + e