메인 칼럼 개발일지 작업물 연락처
← cuenote 프로젝트
cuenote

GitHub 연동이랑 Knowledge Graph 만들기

GitHubGraphD3.jsOCR

“로컬 우선”이라고 해놓고 클라우드 백업이 아예 없으면 실용성이 떨어진다. 그래서 GitHub을 백업 저장소로 쓸 수 있게 연동을 넣기로 했다.

API vs Clone, 뭘로 갈까

처음에 GitHub REST API로 파일을 올리고 내리는 방식을 생각했는데, 그러면 로컬 파일 시스템이랑 싱크가 꼬인다. 결국 clone 기반으로 가기로 했다. 무겁긴 한데 git status로 변경 파일 추적하고, 선택적으로 stage해서 커밋하는 워크플로우가 자연스럽다.

AI 커밋 메시지 자동 생성도 붙였는데 이건 솔직히 반쯤 재미로 넣은 건데 생각보다 편하다.

제일 삽질한 건 GitHub 환경이랑 로컬 환경에서 파일 경로 처리를 통합하는 부분. vault.py에서 환경 타입에 따라 경로를 다르게 뱉어야 하는데, 처음에 이걸 컴포넌트마다 분기 처리해놔서 나중에 코드가 지저분해졌다. 결국 서버 쪽에서 통일하도록 리팩터링.

Knowledge Graph

이건 좀 욕심을 부린 건데, 노트 간 관계를 AI가 분석해서 D3.js force 그래프로 보여주는 기능이다. 노드가 노트고, 유사도 높은 노트끼리 선으로 연결된다.

D3.js force 시뮬레이션의 물리 파라미터(charge, collision, distance) 튜닝이 은근 노가다였다. 노트가 적을 때랑 많을 때 느낌이 완전 달라서 슬라이더로 유사도 임계값을 조절할 수 있게 했다. 클러스터 편집도 사용자가 직접 할 수 있게 넣었는데 UI가 좀 복잡해진 감이 있다.

OCR도 넣었다

PDF 텍스트 추출이랑 이미지 OCR도 이 시기에 구현했다. EasyOCR 기본으로 쓰고, 필기 인식은 TrOCR, 복잡한 이미지는 Gemini Vision으로 분기. URL 넣으면 웹페이지를 마크다운으로 변환하는 것도 넣었는데 이건 BeautifulSoup으로 긁어오는 거라 크게 어렵진 않았다.

이 즈음에 Pyright도 돌렸는데 타입 에러가 꽤 나왔다. Python 코드 규모가 커지니까 타입 체킹 없이는 못 버티겠더라.

김현빈 Developer & Writer

기술, 포스팅 관련 질문, 프로젝트 협업 등 연락주시면 언제든지 회신 드립니다.