디지털가든-홈페이지-관리

디지털가든 홈페이지 관리 워크플로우

개요

Obsidian 노트를 Digital Garden (Eleventy + Vercel)으로 퍼블리시하는 전체 워크플로우.

항목 내용
사이트 MSK8R Lab Digital Garden
SSG Eleventy v2.0.1
호스팅 Vercel (Hobby Plan)
GitHub medibb/digitalgarden
Deploy 경로 /workspace/digitalgarden-deploy/
Obsidian 소스 /workspace/obsidian/

퍼블리시 명령

# 변경사항 확인만 (실제 반영 안 함)
bash tools/scripts/digitalgarden_publish.sh --dry-run

# 실제 퍼블리시
bash tools/scripts/digitalgarden_publish.sh

Claude Code에서: /publish 또는 "퍼블리시해줘"

퍼블리시 스크립트 동작 순서

tools/scripts/digitalgarden_publish.sh 실행 시:

  1. 미팅 MOC 자동 생성

    • #회의/랩미팅, #회의/치료실미팅 태그가 있는 파일 스캔
    • 💻Dataview/랩미팅목록.md, 치료실미팅목록.md에 정적 테이블 자동 갱신
    • Obsidian에서는 Dataview 쿼리, 디지털가든 웹에서는 정적 테이블로 표시

  2. 연구 현황 동기화

    • 🗂️MemoBox/Task.md의 <!-- research-status-start/end --> 테이블 읽기
    • digitalgarden/MSK8R Lab.md의 같은 마커 사이에 상태 이모지(🟢/🔴/🟡) 포함 테이블 갱신

  3. dg-publish 파일 스캔

    • obsidian/에서 dg-publish: true frontmatter가 있는 .md 파일 검색
    • digitalgarden-deploy/src/site/notes/와 비교하여 새/변경 파일 식별
    • 제외: .trash/, .ipynb_checkpoints/, obsidian/digitalgarden/, .obsidian/, CLAUDE.md

  4. 파일 복사 → Git commit → Push

    • Author: medibb <48613484+medibb@users.noreply.github.com> (Vercel Hobby Plan 필수)
    • Vercel이 main 푸시 감지 → 자동 빌드 & 배포

홈페이지 구조

섹션 내용 자동화
Quick Access PNUH 대시보드 링크 수동
🔥 진행 중 Active 프로젝트 + 회의 목록 링크 수동
📊 연구 프로젝트 현황 Task.md에서 연구 상태 테이블 자동 (퍼블리시 시)
MSK8R Lab 소개 미션, 연구 주제 수동
Research Topics 6개 연구 주제 테이블 + 개별 페이지 링크 수동
Highlights Featured Research, Grants, Awards 수동
PI / Links / Contact 연구자 정보 수동
섹션 내용
🏥 시술 Intervention, ESWT
📋 의무기록 EMR Templates, 처방메모, 심사삭감
🏋️ 운동재활 재택운동, 도수운동, 회전근개/요추 콘티
📚 참고·교육 MSK Summary, 전공의교육, PA매뉴얼
📦 완료 Archive 테이블

Eleventy 커스터마이징 (.eleventy.js)

위키링크 처리

기능 구현
표시텍스트 link 필터 (pipe regex)
파일명 (pipe 없음) link 필터 (no-pipe regex 추가)
서브디렉토리 검색 findNoteFile() — 루트에 없으면 하위 폴더 탐색
대소문자 보존 slugify() 대신 원본 파일명 사용
이미지 임베드 image.png → <img src="/img/user/Attachments/image.png">

파일 트리 (filetreeUtils.js)

스타일 (custom-style.scss)

.table-wrapper table {
    width: 100%;
}

미팅 노트 추가 방법

새 미팅 파일 작성 시 필수 메타데이터:

---
dg-publish: true
---
-   `Title:` ; 랩미팅 YYYY-MM-DD
-   `Type:` ;
-   `Tags:` #회의/랩미팅
-   `meeting Date:` YYYY-MM-DD
-   `Reviewed Date:` YYYY-MM-DD

이미지 추가 방법

  1. 이미지를 obsidian/Attachments/에 저장
  2. 노트에서 파일명.png로 참조
  3. deploy repo의 src/site/img/user/Attachments/에도 이미지 복사 필요
  4. Eleventy가 !... → <img src="/img/user/Attachments/..."> 자동 변환

새 페이지 퍼블리시 체크리스트

  1. 파일 frontmatter에 dg-publish: true 추가
  2. (선택) dg-path: 설정 — 파일 트리에서 표시될 경로
  3. bash tools/scripts/digitalgarden_publish.sh --dry-run으로 확인
  4. bash tools/scripts/digitalgarden_publish.sh로 배포
  5. Vercel 배포 확인

주의사항

항목 내용
Git author 반드시 medibb <48613484+medibb@users.noreply.github.com> (Vercel Hobby Plan)
obsidian/digitalgarden/ Obsidian 플러그인용 폴더, 스크립트에서 자동 제외
.eleventyignore src/site/notes/digitalgarden/ 추가됨 (중복 빌드 방지)
Dataview 쿼리 웹에서 미작동 → 정적 테이블 병행 필요
포트 충돌 빌드/서버 관련 포트 kill 금지 → 사용자에게 보고

관련 파일

파일 역할
tools/scripts/digitalgarden_publish.sh 퍼블리시 자동화 스크립트
digitalgarden-deploy/.eleventy.js Eleventy 설정 (위키링크, 이미지)
digitalgarden-deploy/src/helpers/filetreeUtils.js 파일 트리 permalink 처리
digitalgarden-deploy/src/helpers/linkUtils.js 그래프 링크 처리
digitalgarden-deploy/src/site/styles/custom-style.scss 커스텀 CSS
config/commands/publish.md Claude Code /publish 커맨드
obsidian/digitalgarden/MSK8R Lab.md 홈페이지 소스
obsidian/digitalgarden/PNUH.md 임상 대시보드 소스
obsidian/🗂️MemoBox/Task.md 연구 현황 마스터 테이블
💻Dataview/랩미팅목록.md 랩미팅 MOC (자동 갱신)
💻Dataview/치료실미팅목록.md 치료실미팅 MOC (자동 갱신)

Comments