WebSketch: 마인드맵을 위한 GWT 보드

GWT 개발자를 위한 텍스트 기반 마인드맵 도구 WebSketch

WebSketch는 GWT 기반의 웹 애플리케이션으로, 구조화된 텍스트 다이어그램을 생성하기 위해 설계되었습니다. 텍스트 박스 노드를 사용해 마인드맵처럼 작동하며, 중첩 구조와 자동 레이아웃 배치를 지원합니다. 그래픽 없이 오직 텍스트와 연결선만으로 구성되어 있으며, 데스크톱 전용입니다. 일일 스탠드업 회의, 작업 계획 수립, 또는 직접 Git 저장소에 링크를 저장하는 데 이상적입니다.

핵심 워크플로우 원칙

사용자는 중심 노드에서 시작하여 Ctrl+드래그로 새로운 요소를 추가합니다. 연결은 Shift+드래그로 생성됩니다. 텍스트 박스를 더블클릭하면 해당 노드가 중심이 되는 중첩 보드가 열립니다. 노드 위치는 텍스트 해시 값에서 자동 생성되며, 페이지 새로고침 시 레이아웃이 자동 복원됩니다.

노드의 위치를 중심에 고정하려면 홈 기호(Alt+127)를 추가하면 됩니다. 이는 ⌂BUGS[+100,+0]처럼 오프셋을 저장합니다. 텍스트 박스 내부에는 공백을 허용하지 않아 단어 하나 또는 짧은 구문만 사용할 수 있도록 제한됩니다.

주요 규칙:

• 사무실 워크플로우에 최적화된 데스크톱 전용 인터페이스.
• 수정이나 삭제 불가 — 오직 추가만 가능 (실제 종이 위에 글쓰기처럼).
• 전체 마인드맵에서 풀텍스트 검색 가능 (현재 보기 범위가 아님).
• 상단 우측에 해시 코드 표시 — 변경 사항 추적 및 수정 여부 확인 가능.

데이터 저장 형식

데이터는 간단한 파싱이 가능한 순수 텍스트 파일에 저장됩니다. 구분자는 0 0 또는 다섯 칸의 공백입니다. 예시 기초 구조:

0 0 0 BUGS

이는 루트 노드 "BUGS"를 정의합니다. 구분자가 없으면 인접한 단어들이 연속 체인을 형성합니다:

BUGS FEATURES README TESTS

결과: 평면적인 노드 시퀀스. 중첩 구조가 있는 경우:

BUGS FEATURES README TESTS 0 0 BUGS FEATURES FEATURE#1

서버 측 알고리즘은 키워드 기반으로 이웃 노드를 추출하며, 데이터베이스 없이 파일을 스캔합니다. 괄호 안의 숫자는 용어 빈도를 나타냅니다.

파일 업로드/다운로드 기능을 통해 수동 편집이 가능합니다. "시작" 탭에서는 실험용으로 원시 코드를 표시 — mermaid.live와 유사합니다.

실용적 활용 사례

• 일일 스탠드업: Jira 티켓 번호를 즉시 기록, 서비스 로딩 대기 없이 바로 사용.
• 프로젝트 계획: 기술 스택, 마감일, 의존성 관리.
• Git 통합: 저장소에 마인드맵을 저장 — 신규 개발자가 링크를 통해 시각적이고 중첩된 루트맵을 즉시 확인 가능.
• 개인 메모: 프로젝트 버그, 코드 구조, 템플릿 기록.

개발 예시: 중심 노드 "app.websketch", 버그, 기능 분기, 맞춤 좌표로 정밀 배치.

기술적 구현

GWT 2.12.2(원본 2.4.0, Eclipse 3.5 기반)으로 구축. 프론트엔드는 트리를 파싱하고 렌더링하며, 백엔드는 세 가지 서블릿을 사용합니다:

• 파일 업로드.
• 파일 다운로드.
• 키워드 기반 이웃 노드 조회 (텍스트 스캔).

GWT 업데이트로 초기 로딩 속도가 10–20% 느려졌습니다. 데이터베이스 없음 — 서버는 전체 파일을 읽고 현재 단어 기준으로 필터링합니다. 고유 링크 공유 시 인증 없이 접근 가능 — 링크 접근 즉시 읽기/쓰기 권한 부여.

좌표 예시:

BUGS FEATURES README TESTS 0 0 BUGS FEATURES FEATURE#1 ⌂BUGS[+100,+0]

GUI는 연결선을 그림과 함께, 단어 체인을 하나의 통합 노드로 처리합니다.

주요 특징

• 메모장과 Git과 호환되는 순수 텍스트 형식 — 외부 의존성 없음.
• 해시 기반 자동 위치 지정으로 일관된 레이아웃 복원 보장.
• 성능 저하 없이 계층 구조 유지 가능한 중첩 보드.
• 미니멀한 스택: GWT + 서블릿, 데이터베이스 오버헤드 0.
• 팀 협업을 위한 해시 기반 무결성 제어.

— Editorial Team