개인생산성 대시보드 개선작업

Goalmeter v2 — 로컬 데모를 "로그인되는 실제 배포 서비스"로

소개 — 무엇을, 왜

계획한 시간과 실제로 쓴 시간의 차이를 눈으로 확인하고, AI 회고로 하루를 돌아보는 1인용 목표·시간관리 웹앱(Goalmeter) 을 계속 업그레이드 하고 있습니다.

• 할 일 앱은 "체크"는 되지만 계획한 시간만큼 실제로 썼는지는 보여주지 못합니다.

• 시간을 블록으로 계획해도 목표·회고와 한 줄기로 이어지지 않습니다.

• 혼자 쓰는 회고는 객관성이 약합니다 → AI(Gemini) 코멘트로 보완합니다.

목표는 분명했습니다. 내 컴퓨터에서만 돌던 데모 → 로그인해서 쓰는 실제 배포 서비스로 끌어올리기.

📸 [캡처 1 — 여기]: 대시보드 홈 전체 (완료율 · 계획 대비 실적 · 14일 추세선 · 이번 달 활동 달력). "완성된 모습"을 먼저 보여주는 대표 이미지.

진행 방법 — 도구와 활용

사용한 도구

활용 방식 — "요청 → 만들기 → 화면 확인 → 배포"

저는 코드를 직접 짜지 않고, 원하는 동작을 말로 설명하면 Claude가 만들고·확인하고·배포하는 방식으로 진행했습니다.

ALT

한국어 앱 스크린샷

시스템 구조

ALT

한국어의 구조를 보여주는 다이어그램

브라우저(React)가 화면을 담당하고, 데이터는 Supabase에 사용자별로 저장됩니다. AI 회고는 브라우저에서 Gemini를 바로 호출합니다(키는 내 브라우저에만 저장). 코드를 GitHub에 올리면 Vercel이 자동으로 배포합니다.

핵심 한 바퀴 (사용 흐름)

ALT

칩의 구조를 보여주는 다이어그램

ALT

한국의 시간 관리 앱 스크린샷

ALT

한국 시간 관리 앱 스크린샷

ALT

한국 달력의 스크린샷

ALT

한국 달력 앱의 스크린샷

활용 프롬프트 전문 — AI 일일 회고에 보내는 프롬프트

앱이 그날 데이터를 정리해 Gemini에 보내는 프롬프트입니다. 작업별 시작 시각·소요 시간과 네 가지 조언 지시(시작 시각을 지켰는지 / 계획 대비 실제 소요 / 완료율 / 목표·주간계획과의 연결)가 핵심입니다.

당신은 사용자의 하루를 돌아보는 따뜻하면서도 통찰력 있는 회고 코치입니다.
아래 데이터를 바탕으로 한국어로 4~6문장의 회고 코멘트를 작성하세요.
구체적인 숫자를 짚되, 격려와 다음 행동 제안을 균형 있게 담으세요. 이모지는 절대 쓰지 마세요.
특히 아래 세 가지를 반드시 구체적으로 짚어 의견과 조언을 주세요:
1) 시작 시각 준수: 계획한 시작 시각을 잘 지켰는지(늦게 시작했거나 미룬 작업이 있는지)와 개선 조언.
2) 계획 시간 대비 실제 소요: 어떤 작업이 계획보다 초과/단축됐는지 패턴을 짚고, 시간 추정·집중에 대한 조언.
3) 완료율: 무엇을 끝냈고 무엇이 남았는지, 다음에 완료율을 높일 방법.
4) 목표·주간계획 연계: 오늘 한 일이 사용자의 목표와 이번 주 계획에 얼마나 기여했는지(또는 벗어났는지) 의견을 주고, 다음 행동 조언을 목표·주간계획과 연결해 제시.

[날짜] 2026-06-03
[전체] 작업 2/3개 완료 (완료율 67%)
[시간] 계획 3시10분 / 실제 7시10분 (계획 대비 실적 226%)

[작업별 시간] (계획 시작·소요 / 실제 시작·소요, 시작 지연·소요 증감)
- 걷기 1시간 (운동) [완료]: 계획 07:00 시작·3시10분 / 실제 09:00 시작·5시, 시작 120분 지연, 소요 +110분 초과
- 1차적용 (사이드 프로젝트) [완료]: 계획 없음 / 실제 15:50 시작·2시10분
- 학습지 풀이 (영어 회화) [미완료]: 계획 없음 / 실적 없음

[목표별 (목표치 대비 오늘 수행)]
- 운동 (목표: 주 4회): 오늘 1/1 완료, 계획 3시10분 / 실제 5시
- 영어 회화 (목표: 매일 30분): 오늘 0/1 완료, 계획 0분 / 실제 0분

[이번 주 계획 (주간계획 항목별 이번 주 진행)]
- 운동 4회 (운동): 이번 주 1일 배치 중 1일 완료
- 주 5회 회화 연습 (영어 회화) [주간 완료체크됨]: 이번 주 1일 배치 중 0일 완료

[사용자의 감상]
오늘 시간관리 부족... 좀더 신경써야 겠다.

위 내용을 반영해 회고 코멘트만 출력하세요.

결과와 배운 점

결과

• 내 컴퓨터에서만 돌던 데모 → 로그인해서 쓰는 실제 배포 서비스 완성 → https://goalmeter-v2.vercel.app

• 목표 → 주간 → 일일 → 회고 → 대시보드가 사용자별 데이터 위에서 한 바퀴로 동작합니다.

배운 점 · 꿀팁

1. 먼저 만들고, 문서는 만든 것을 따라가게 한다. 대화로 빠르게 만든 다음 기획서(PRD)를 구현된 내용에 맞춰 갱신했더니, 문서와 실제가 서로 어긋나지 않았습니다.

2. "왜 안 되는지부터 확인하고 고쳐줘"라고 요청하면 원인을 제대로 잡습니다. "그냥 고쳐줘"보다 결과가 좋았습니다.

3. 헤드리스 브라우저로 실제 클릭 확인을 시키면, 코드만 봐서는 놓치는 버그(화면이 한 박자 늦게 바뀌는 문제 등)를 잡아냅니다.

4. 이름을 잘 짓는 것이 곧 사양이다. "시간정확도(226%)"가 헷갈려서 → "계획 대비 실적(계획이 있는 작업만)"으로 개념과 이름을 바꾸니 의미가 분명해졌습니다.

겪은 시행착오 (가장 크게 헤맨 것들)

1. 배포가 계속 멈춤 — 원인은 의외로 *커밋 작성자 이메일을 claude가 임으로 가짜로 만들어 Vercel이 빌드를 막은 것이었습니다. 이메일을 실제 주소로 바꾸니 한 번에 풀렸습니다.

2. 불필요한 기능을 찾아 삭제함. — 너무 많은 욕심으로 기능을 추가하려 하였음. 불필요했던 기능(이월기능)은 삭제함.

앞으로의 계획

• 목표의 수치화 고민, 목표가 수치화 되면 정량적인 목표관리가 될 수 있음 (고민중)

• 월간 AI 종합 회고, 알림/리마인더, 반복 작업, 하위 목표 (다음 단계)

• 구굴 캘린더 연계, 구글캘린더의 task를 가져와 적용하기(다음 단계)

참고 :

• 배포 URL : https://goalmeter-v2.vercel.app

• id/pwd ([email protected]/gpters)