faq-guide

# 초보자 FAQ 가이드

> "이건 어디서 설정해?" 모든 질문에 대한 답변

---

## 빠른 찾기 목차

| 질문 | 파일 위치 |
|-----|---------|
| [API 키 설정](#api-키-설정) | `.env.local` |
| [색상 변경](#색상-변경) | `tailwind.config.ts` |
| [폰트 변경](#폰트-변경) | `src/app/layout.tsx` |
| [로고 변경](#로고-변경) | `public/logo.png` |
| [페이지 제목 변경](#페이지-제목-변경) | `src/app/layout.tsx` |
| [결제 설정](#결제-설정) | `.env.local` + `src/lib/stripe.ts` |
| [데이터베이스 연결](#데이터베이스-연결) | `.env.local` + `prisma/schema.prisma` |
| [로그인 설정](#로그인-설정) | `src/lib/auth.ts` |
| [메뉴 추가](#메뉴-추가) | `src/components/Navigation.tsx` |
| [새 페이지 추가](#새-페이지-추가) | `src/app/[페이지명]/page.tsx` |

---

## 1. 환경변수 / API 키

### API 키 설정

**질문:** "OpenAI API 키는 어디에 넣어?"

**위치:** `.env.local` (프로젝트 루트)

```env
# .env.local

# AI 서비스
OPENAI_API_KEY=sk-xxxxxxxxxxxxxxxx
ANTHROPIC_API_KEY=sk-ant-xxxxxxxxxxxxx

# 결제
STRIPE_SECRET_KEY=sk_live_xxxxxxxxxxxxx
STRIPE_PUBLISHABLE_KEY=pk_live_xxxxxxxxxxxxx
STRIPE_WEBHOOK_SECRET=whsec_xxxxxxxxxxxxx

# 데이터베이스
DATABASE_URL=postgresql://user:password@host:5432/db

# 인증
NEXTAUTH_URL=http://localhost:3000
NEXTAUTH_SECRET=your-secret-key-here

# 소셜 로그인
GOOGLE_CLIENT_ID=xxxxxxxxxxxxx.apps.googleusercontent.com
GOOGLE_CLIENT_SECRET=xxxxxxxxxxxxxxxx

# 스토리지
CLOUDFLARE_R2_ACCESS_KEY=xxxxxxxxxxxxx
CLOUDFLARE_R2_SECRET_KEY=xxxxxxxxxxxxx
CLOUDFLARE_R2_BUCKET=my-bucket
```

**주의사항:**
- `.env.local`은 git에 올리면 안 됨 (`.gitignore`에 포함되어 있음)
- `NEXT_PUBLIC_` 접두사가 붙은 것만 브라우저에서 접근 가능
- 배포 시 Vercel/Railway 대시보드에서 환경변수 설정 필요

---

## 2. 디자인 / 스타일

### 색상 변경

**질문:** "메인 색상을 파란색에서 초록색으로 바꾸고 싶어"

**위치:** `tailwind.config.ts`

```typescript
// tailwind.config.ts
import type { Config } from 'tailwindcss';

const config: Config = {
  theme: {
    extend: {
      colors: {
        // 여기서 색상 변경!
        primary: {
          50: '#f0fdf4',   // 가장 밝은
          100: '#dcfce7',
          200: '#bbf7d0',
          300: '#86efac',
          400: '#4ade80',
          500: '#22c55e',  // 메인 색상
          600: '#16a34a',
          700: '#15803d',
          800: '#166534',
          900: