“오늘 나 뭐 했지?”에 데이터로 대답하는 법 (Haneui-Tracker 개발기)

들어가며

재택근무시엔 개발자로서 한 가지 질문을 자주 받게 됐다.

“오늘 뭐 하셨어요?”

문제는,
분명 하루 종일 코딩했는데 말로 설명하려니 늘 추상적이라는 점이다.

• “버그 좀 잡았고요…”
• “리팩토링이랑 구조 정리 좀…”
• “코드는 많이 안 늘었는데요…”

이쯤 되면 스스로도 의심이 든다.
“나 오늘 진짜 일한 거 맞나?”

그래서 생각했다.

느낌 말고, 데이터로 말해보자.

이렇게 시작된 프로젝트가
VS Code Extension Haneui-Tracker다.
내 개발 활동을 감정이 아닌 숫자로 보여주는 도구다.

---

왜 만들었나: 문제 정의 (aka 개발자의 자아성찰)

1. 정량적 성과 측정의 어려움

개발자의 성과는 숫자로 표현하기 참 애매하다.

• 커밋 수 → 리팩토링은 늘 억울하다
• 코드 라인 수 → 좋은 코드는 오히려 줄어든다
• PR 개수 → 하루 종일 한 PR이 세상을 구할 수도 있다

그럼에도 불구하고,
나의 성장 추이와 실제 활동량은 보고 싶었다.

2. 재택근무의 애매함

재택근무를 하다 보면 이런 순간이 온다.

• 하루 종일 바빴는데 결과물이 잘 안 보일 때
• 스탠드업에서 “오늘 뭐 했어요?”가 가장 어려운 질문일 때
• 스스로 생산성을 관리하고 싶은데 기준이 없을 때

그래서 필요했던 건:

• 실제 코딩 시간
• 어떤 언어를 얼마나 썼는지
• 오늘 손이 얼마나 움직였는지

---

해결 방향: 그래서 직접 만들었습니다

기존 솔루션도 찾아봤다.
하지만 대부분은 다음 중 하나였다.

• 서버 기반 → 프라이버시 부담
• 기능 과다 → 설정하다 하루 종료
• VS Code와 미묘한 거리감 → 결국 안 씀

그래서 결론은 하나였다.

로컬에서만 동작하고
VS Code에 완전히 녹아들며
켜두면 알아서 기록되는 도구

없으면?
직접 만든다.

---

기술적 아키텍처 설계

전체 구조

Extension Entry
   ├─ ActivityTracker   // 내가 뭘 했는지
   ├─ StatsCalculator   // 그래서 얼마나 했는지
   ├─ StorageManager    // 기억력 담당
   └─ UI
       ├─ StatusBar
       ├─ Sidebar
       └─ Dashboard(Webview)

한 줄 요약하면
이벤트는 모으고, 계산은 분리하고, UI는 조용하게.

---

핵심 컴포넌트

ActivityTracker – 개발자의 모든 움직임 추적

VS Code는 생각보다 많은 이벤트를 제공한다.

onDidChangeTextDocument
onDidSaveTextDocument
onDidChangeActiveTextEditor
onDidChangeWindowState

이걸 잘 엮으면 알 수 있다.

• 키보드를 치고 있는지
• 파일을 옮겨 다니는지
• 아니면 그냥 화면만 보고 있는지

비활성 시간 감지

 

const IDLE_THRESHOLD = 10 * 60 * 1000; // 10분

• 커피 마시러 간 시간은 코딩이 아니다
• 멍 때린 시간도 코딩이 아니다
• 10분 이상 조용하면 코딩 타이머는 멈춘다

타이머는 정직해야 한다.

 

라인 수 계산: 생각보다 까다로운 문제

처음엔 이렇게 생각했다.

“라인 수? 그냥 늘어난 줄 세면 되겠지”

완전히 틀렸다.

• 여러 파일 동시 수정
• 대량 붙여넣기
• 삭제 + 추가가 한 이벤트에 섞여 들어옴

그래서 해결책은 다음과 같다.

• 파일별 마지막 라인 수를 Map으로 관리
• 변경 전/후를 역산
• 추가 / 삭제 / 수정 구분 집계

이제야
진짜로 손이 움직인 만큼만 기록된다.

 

날짜 변경 감지 – VS Code는 잠들지 않는다

 

VS Code는 며칠이고 켜져 있다.
문제는 날짜는 바뀌는데 앱은 그대로라는 점이다.

• 마지막 체크 날짜 저장
• 모든 이벤트에서 날짜 변경 여부 확인
• 날짜가 바뀌면:
  • 어제 데이터 저장
  • 오늘 세션 초기화

개발자는 자고 일어나도
데이터는 정확해야 한다.

 

StorageManager – 기억은 가볍게, 오래

• 일별 데이터만 저장
• 주간 / 월간 통계는 실시간 계산
• Map / Set → 직렬화 가능한 구조로 변환

오래 써도 무거워지지 않게 설계했다.

 

Dashboard – 숫자는 시각화되어야 한다

• Chart.js + VS Code Webview
• 언어별 분포 도넛 차트
• 코딩 시간 추이 라인 차트

VS Code 테마와 자연스럽게 어울리도록 구성했다.

데이터는 많아도
보는 사람은 편해야 한다.

 

개발하면서 배운 것들

• 정확함은 늘 대가가 따른다
• 이벤트 하나 놓치면 통계가 틀어진다
• UX는 눈에 안 띄어야 잘 만든 것이다

그리고 무엇보다,

이 Extension을 만들고 나서
“오늘 뭐 했어요?”에
대시보드 스크린샷으로 답하게 됐다.

 

한계와 개선 계획

현재 Haneui-Tracker는 여전히 발전 중인 도구다.

실사용 과정에서 발견되는 버그와
개선이 필요한 부분들이 분명히 존재하며,
이를 하나씩 해결해 나가며 디벨롭을 이어가고 있다.

이 프로젝트는
“완성된 결과물”이라기보다
지속적으로 다듬어 가는 개발 기록에 가깝다.

 

성과와 회고

기술적으로

• VS Code Extension 구조 이해
• 이벤트 기반 아키텍처 설계
• Webview UI 구현 경험
• 가벼운 도구를 만드는 감각

개인적으로

• 내 개발 패턴을 데이터로 인식
• 재택근무 생산성 관리
• “필요한 도구는 직접 만든다”는 경험

마무리

이 프로젝트는 단순한 사이드 프로젝트가 아니다.

• 문제를 정의하고
• 도구를 선택하고
• 실제로 쓰는 제품으로 만든 경험

개발자는 결국
문제를 보고, 귀찮아하고, 결국 직접 만드는 사람이라고 생각한다.

Haneui-Tracker는
그 귀찮음에서 시작된, 꽤 정직한 결과물이다.

 

GitHub: https://open-vsx.org/extension/haneui-tracker/Haneui-Tracker
Version: 0.0.6
License: MIT