부제: Hermes Agent로 만든 파일 구조를 대시보드로 시현하는 방법
텔레그램에 있는 Hermes Agent로 작업을 쌓다 보면, 단순히 파일이 늘어나는 것만으로는 전체 흐름이 잘 보이지 않습니다.
특히 대화, 회의, 결정, 액션, 프로젝트가 서로 연결되어 있을수록, “어디에 무엇이 쌓였는지”를 한눈에 보는 장치가 필요합니다.
저는 이 문제를 Markdown vault + 자동 갱신형 대시보드 조합으로 풀어봤습니다. 이렇게요.
파란색 배경의 웹사이트 스크린샷
물론 hermes에게 설계해서 만들어 달라고 했죠ㅎㅎ
hermes가 만든 파일 전체를 한눈에 보기에 편합니다.
아직은 숨어있는 파일들을 완벽히 표현하지 못하고있네요. 일단은 게시글 먼저 올리고 좀더 깎아보겠습니다.
1. 원본은 Markdown으로 둡니다
BrandonOS의 핵심 원칙은 간단합니다.
모든 중요한 기록은 Markdown으로 남긴다.
폴더 구조는 이런 식입니다.
- 00_INBOX_RAW/ : 원본 입력
- 10_LLM_WIKI/ : 개념, 원칙, 운영 지식
- 20_PROJECTS/ : 진행 중인 프로젝트
- 30_AREAS/ : 지속 관리 영역
- 40_PEOPLE/ : 사람/관계 노트
- 50_DECISIONS/ : 결정 로그
- 60_ACTIONS/ : 실행 항목
- 70_REPORTS/ : 회의록, 리포트, 기고문, 산출물
즉, Hermes Agent가 생성한 모든 결과를 파일 구조로 축적하고, 그 자체를 지식 시스템으로 보는 방식입니다.
2. 대시보드는 Markdown을 “보여주는 층”입니다
구조가 쌓이기만 하면 다시 찾기 어렵기 때문에,
그 위에 대시보드를 하나 더 얹었습니다.
구성은 이렇게 나눴습니다.
1. Markdown vault
- 원본 저장소
2. build script
- Markdown을 읽어 dashboard-data.json 생성
3. Dashboard.html
- JSON을 렌더링해 칸반, 최근 산출물, 결정, 지식 그래프를 보여줌
즉, Markdown은 기록용, HTML은 시현용입니다.
이 분리가 생각보다 중요합니다.
기록은 가볍고 안정적으로, 시현은 유연하고 보기 좋게 가져갈 수 있기 때문입니다.
3. 클릭하면 Markdown이 예쁘게 열리게 했습니다
처음에는 대시보드에서 .md 파일을 직접 열었는데,
브라우저에서 깨져 보이거나 경로가 꼬이는 문제가 있었습니다.
그래서 별도의 view.html 문서 뷰어를 만들었습니다.
이 뷰어는:
- Markdown 파일을 UTF-8로 안전하게 읽고
- # / ## / ### 제목을 실제 제목처럼 렌더링하고
- 리스트, 인용문, 코드블록도 Markdown 스타일로 표시합니다.
덕분에 대시보드에서 문서를 눌러도
원문이 깨지지 않고, 읽기 좋은 문서처럼 보이게 만들 수 있었습니다.
4. 시현 방식은 단순합니다
로컬에서 확인할 때는 아래처럼 서버를 띄우면 됩니다.
python -m http.server 8009 --bind 127.0.0.1
그리고 브라우저에서:
- 대시보드: http://127.0.0.1:8009/20_PROJECTS/BrandonOS/Dashboard.html
- 문서 뷰어: http://127.0.0.1:8009/view.html?path=70_REPORTS/Meetings/일본_회의_정리.md
Deploy 아키텍쳐는 이건데 좀 복잡해서 배포는 안하고 로컬로 진행했습니다.
다양한 유형의 아키텍처를 보여주는 다이어그램
이렇게 열면,
- 최근 회의 정리
- 결정 로그
- 액션 아이템
- 프로젝트 상태
- 지식 그래프
가 한 화면에서 연결됩니다. 요렇게요...
파란색 배경의 웹사이트 스크린샷
5. 이 방식의 장점
이 구조의 장점은 명확합니다.
- 기록이 흩어지지 않습니다
- 대화가 문서로 축적됩니다
- 문서가 대시보드에서 다시 살아납니다
- 최근 생성물과 결정이 서로 연결됩니다
- 필요한 순간 바로 찾아볼 수 있습니다
한 줄 정리
Hermes Agent의 파일 구조는 Markdown vault로 쌓고, 자동 갱신형 HTML 대시보드로 시현하면 가장 실용적입니다.
