diff --git a/SETUP.md b/SETUP.md new file mode 100644 index 0000000..e53b365 --- /dev/null +++ b/SETUP.md @@ -0,0 +1,179 @@ +# 사주보기 설정 가이드 + +## 카카오 앱 키 설정 + +카카오톡 공유 기능을 사용하려면 카카오 개발자 앱 키가 필요합니다. + +### 1. 카카오 개발자 계정 생성 + +1. [카카오 개발자 센터](https://developers.kakao.com/) 접속 +2. 카카오 계정으로 로그인 +3. 개발자 등록 (처음 사용 시) + +### 2. 애플리케이션 생성 + +1. **내 애플리케이션** 메뉴 클릭 +2. **애플리케이션 추가하기** 클릭 +3. 앱 정보 입력: + - 앱 이름: `사주보기` (또는 원하는 이름) + - 사업자명: `개인` 또는 사업자명 +4. **저장** 클릭 + +### 3. JavaScript 키 발급 + +1. 생성한 앱 선택 +2. **앱 키** 메뉴에서 **JavaScript 키** 복사 + - 예: `a1b2c3d4e5f6g7h8i9j0k1l2m3n4o5p6` + +### 4. 플랫폼 설정 + +1. **플랫폼** 메뉴 선택 +2. **Web 플랫폼 추가** 클릭 +3. 사이트 도메인 등록: + - 개발 환경: `http://localhost:3003` + - 배포 환경: `https://your-domain.com` +4. **저장** 클릭 + +### 5. 환경 변수 설정 + +1. 프로젝트 루트의 `.env.local` 파일 열기 +2. `NEXT_PUBLIC_KAKAO_APP_KEY=` 뒤에 복사한 JavaScript 키 붙여넣기 + +```bash +NEXT_PUBLIC_KAKAO_APP_KEY=a1b2c3d4e5f6g7h8i9j0k1l2m3n4o5p6 +``` + +3. 개발 서버 재시작 + +```bash +npm run dev +``` + +### 6. 동작 확인 + +1. 사주 결과 페이지에서 **공유하기** 버튼 클릭 +2. 카카오톡 아이콘 클릭 +3. 카카오톡 로그인 후 친구 선택하여 공유 테스트 + +--- + +## 절기 기준 사주 계산 + +이 프로젝트는 정확한 사주 계산을 위해 **24절기**를 기준으로 월주를 계산합니다. + +### 절기란? + +- 1년을 24개로 나눈 계절의 구분점 +- 사주에서 월주는 양력 월이 아닌 절기를 기준으로 계산 +- 예: 입춘(立春) 이후가 인월(寅月) + +### 주요 절기 + +| 절기 | 시기 | 월주 | +|------|------|------| +| 입춘 | 2월 4일경 | 인월 (寅月) | +| 경칩 | 3월 5일경 | 묘월 (卯月) | +| 청명 | 4월 4일경 | 진월 (辰月) | +| 입하 | 5월 5일경 | 사월 (巳月) | +| 망종 | 6월 6일경 | 오월 (午月) | +| 소서 | 7월 7일경 | 미월 (未月) | +| 입추 | 8월 7일경 | 신월 (申月) | +| 백로 | 9월 8일경 | 유월 (酉月) | +| 한로 | 10월 8일경 | 술월 (戌月) | +| 입동 | 11월 7일경 | 해월 (亥月) | +| 대설 | 12월 7일경 | 자월 (子月) | +| 소한 | 1월 5일경 | 축월 (丑月) | + +--- + +## 대운 계산 + +### 대운이란? + +- 10년 단위로 변화하는 큰 운의 흐름 +- 각 사람마다 대운이 시작되는 나이가 다름 + +### 대운 시작 나이 계산 + +1. **양남음녀** (양년생 남자, 음년생 여자) + - 순행: 생일부터 **다음 절기**까지의 일수 계산 + +2. **음남양녀** (음년생 남자, 양년생 여자) + - 역행: **이전 절기**부터 생일까지의 일수 계산 + +3. **대운수 공식** + - 일수 ÷ 3 = 대운 시작 나이 + - 예: 24일 → 8세부터 대운 시작 + +### 양년/음년 구분 + +- 년간(天干)이 **양**(甲, 丙, 戊, 庚, 壬): 양년 +- 년간(天干)이 **음**(乙, 丁, 己, 辛, 癸): 음년 + +--- + +## 음력 변환 + +### 음력 생일 입력 + +1. 생년월일 입력 시 **음력** 버튼 선택 +2. 윤달인 경우 **윤달** 체크박스 선택 +3. 자동으로 양력 날짜로 변환되어 사주 계산 + +### 지원 범위 + +- 1900년 ~ 2100년 +- 윤달 지원 + +### 주의사항 + +- 음력 1월 1일 = 양력 1월 말 ~ 2월 초 +- 매년 음력과 양력의 대응 날짜가 다름 +- 정확한 변환을 위해 `lunar-calendar` 라이브러리 사용 + +--- + +## 개발 환경 + +### 필수 요구사항 + +- Node.js 18+ +- npm 또는 yarn + +### 설치 + +```bash +npm install +``` + +### 개발 서버 실행 + +```bash +npm run dev +``` + +http://localhost:3003 에서 확인 + +### 빌드 + +```bash +npm run build +npm start +``` + +--- + +## 기술 스택 + +- **Next.js 14** - React 프레임워크 +- **TypeScript** - 타입 안정성 +- **Tailwind CSS** - 스타일링 +- **jsPDF + html2canvas** - PDF 생성 +- **lunar-calendar** - 음력 변환 +- **Kakao SDK** - 카카오톡 공유 + +--- + +## 라이선스 + +© 2025 쟁승메이드. All rights reserved. diff --git a/app/layout.tsx b/app/layout.tsx index 0d0a747..7b1524d 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -22,6 +22,8 @@ export default function RootLayout({ }: Readonly<{ children: React.ReactNode; }>) { + const kakaoAppKey = process.env.NEXT_PUBLIC_KAKAO_APP_KEY; + return ( @@ -31,15 +33,17 @@ export default function RootLayout({ crossOrigin="anonymous" async > -