이름과 생년월일을 입력하면 달력 기준 생후 개월 수를 계산해 줍니다. 아기를 소개하는 귀여운 문구에서 시작했지만, 숫자가 아주 커져도 재미있게 사용할 수 있습니다.
시험까지 며칠 남았는지, 만난 지 100일은 언제인지, 아이가 생후 몇 개월인지. 날짜 계산은 하루 차이로 결과가 달라지는 경우가 많아 기준을 알고 계산하는 것이 중요합니다.
디데이(D-day)는 목표일을 D로 두고, 그 전날을 D-1, 다음 날을 D+1로 세는 방식입니다. 남은 날짜는 '목표일 − 오늘'의 날짜 차이입니다. 2026년 10월 28일 기준으로 12월 25일은 D-58입니다.
시작일 2026-03-01
경과일 기준: 2026-06-08은 시작 후 99일 경과
며칠째 기준: 2026-06-08은 100일째디데이와 기념일을 셀 때 첫날을 포함하는지에 따라 달라지는 계산, 만 나이 통일 이후의 나이 계산법, 생후 개월수와 말일 처리 규칙을 예시로 정리합니다.가이드 읽기 →
나만의 버전이 필요하다면 아래 작업지시 프롬프트를 AI 채팅에 붙여 넣거나, 스킬 파일을 AI 코딩 에이전트에 저장하세요. 저희가 이 도구를 만들 때 정리한 기능, 예외 상황, 테스트 케이스가 그대로 담겨 있습니다.
Claude, ChatGPT, Gemini 같은 AI 채팅에 그대로 붙여 넣으세요.
당신은 숙련된 풀스택 웹 개발자입니다. 아래 요구사항에 맞춰 "생후 개월수 계산기" 웹 도구를 만들어 주세요.
## 목표
이름과 생년월일로 생후 개월수를 계산하고 공유용 카드 이미지를 만드는 도구를 만든다.
## 핵심 기능
- 달력 기준 개월수 계산
- 기준일 선택(기본: 오늘)
- '우리 OO이는 생후 N개월이에요' 문장 생성
- SVG/PNG 카드 이미지 다운로드
- 문장 복사
## 입력
- 이름
- 생년월일
- 기준일
## 출력
- 생후 개월수
- 공유 문장
- 카드 이미지
## 예외 상황과 처리 규칙
- 기준일의 '일'이 생일보다 작으면 1개월 차감
- 기준일이 생일보다 이르면 오류
- 말일생(31일) 처리 규칙 명시
- 이름 길이가 길어도 카드 레이아웃 유지
## 구현 조건
- 서버 없이 브라우저에서 동작하는 단일 페이지(HTML, CSS, JavaScript)로 만들고, 입력 데이터를 외부로 전송하지 마세요.
- 모바일에서도 쓰기 편한 반응형 UI로 만들고, 입력 요소에는 레이블을 달아 키보드로도 조작할 수 있게 해 주세요.
- 결과에는 '복사' 버튼을 달고, 잘못된 입력에는 이해하기 쉬운 한국어 오류 메시지를 보여 주세요.
- 핵심 로직은 UI와 분리된 함수로 작성해 단위 테스트를 할 수 있게 해 주세요.
## 완료 기준 (테스트 케이스)
- 1975-10-22생, 기준일 2026-08-12 → 609개월
- 5월 15일생은 6월 14일에 0개월, 6월 15일에 1개월
- 다운로드한 이미지에 이름과 개월수 포함
먼저 구현 계획을 5줄 이내로 설명한 다음 전체 코드를 작성하고, 마지막에 위 테스트 케이스를 확인하는 방법을 알려 주세요.Claude Code 같은 AI 코딩 에이전트에서 .claude/skills/build-baby-age-calculator/SKILL.md 경로로 저장하면, 이 도구를 만들거나 고칠 때마다 다시 쓸 수 있습니다.
---
name: build-baby-age-calculator
description: 생후 개월수 계산기 도구를 새로 만들거나 수정할 때 사용합니다. 이름과 생년월일로 생후 개월수를 계산하고 공유용 카드 이미지를 만드는 도구를 만든다.
---
# 생후 개월수 계산기 만들기
## 목표
이름과 생년월일로 생후 개월수를 계산하고 공유용 카드 이미지를 만드는 도구를 만든다.
## 작업 순서
1. 아래 필수 기능, 입력, 출력을 확인하고 빠진 정보가 있으면 먼저 질문합니다.
2. 핵심 로직을 UI와 분리된 순수 함수로 구현합니다.
3. 검증 목록의 테스트 케이스로 로직을 확인합니다.
4. 입력 폼, 결과 영역, 복사 버튼을 갖춘 반응형 UI를 만듭니다.
5. 규칙에 적힌 예외 상황을 하나씩 재현해 보고 오류 메시지를 다듬습니다.
## 핵심 기능
- 달력 기준 개월수 계산
- 기준일 선택(기본: 오늘)
- '우리 OO이는 생후 N개월이에요' 문장 생성
- SVG/PNG 카드 이미지 다운로드
- 문장 복사
## 입력
- 이름
- 생년월일
- 기준일
## 출력
- 생후 개월수
- 공유 문장
- 카드 이미지
## 규칙
- 기준일의 '일'이 생일보다 작으면 1개월 차감
- 기준일이 생일보다 이르면 오류
- 말일생(31일) 처리 규칙 명시
- 이름 길이가 길어도 카드 레이아웃 유지
- 서버 없이 브라우저에서 동작하는 단일 페이지(HTML, CSS, JavaScript)로 만들고, 입력 데이터를 외부로 전송하지 마세요.
## 검증
- [ ] 1975-10-22생, 기준일 2026-08-12 → 609개월
- [ ] 5월 15일생은 6월 14일에 0개월, 6월 15일에 1개월
- [ ] 다운로드한 이미지에 이름과 개월수 포함