# 제로보드 설치 가이드 ## 📁 파일 구조 ``` zeroboard/ ├── public/ │ └── index.html ← 메인 앱 (이게 전부!) ├── _redirects ← Cloudflare SPA 라우팅 ├── firestore.rules ← Firebase 보안 규칙 └── SETUP.md ← 이 파일 ``` --- ## 1단계 — Firebase 프로젝트 생성 1. https://console.firebase.google.com 접속 2. **새 프로젝트 추가** 클릭 3. 프로젝트 이름 입력 (예: `my-zeroboard`) 4. Google Analytics는 선택 사항 (스킵 가능) --- ## 2단계 — Firebase 서비스 활성화 ### Authentication - Firebase Console → **Authentication** → **시작하기** - **이메일/비밀번호** 사용 설정 → 저장 - **Google** 사용 설정 → 지원 이메일 입력 → 저장 ### Firestore Database - Firebase Console → **Firestore Database** → **데이터베이스 만들기** - **프로덕션 모드** 선택 (규칙은 다음 단계에서 설정) - 위치: `asia-northeast3` (서울) 권장 --- ## 3단계 — Firestore 보안 규칙 설정 1. Firestore → **규칙** 탭 클릭 2. `firestore.rules` 파일 내용을 전부 복사해서 붙여넣기 3. **게시** 클릭 --- ## 4단계 — Firebase 웹 앱 등록 1. Firebase Console → 프로젝트 설정 (톱니바퀴) → **일반** 탭 2. 하단 **앱 추가** → 웹 (``) 3. 앱 닉네임 입력 후 **앱 등록** 4. `firebaseConfig` 객체를 복사해 둡니다 --- ## 5단계 — index.html에 설정 입력 `public/index.html` 파일을 열고 아래 부분을 찾아 실제 값으로 교체: ```javascript const firebaseConfig = { apiKey: "YOUR_API_KEY", // ← 실제 값으로 교체 authDomain: "YOUR_AUTH_DOMAIN", projectId: "YOUR_PROJECT_ID", storageBucket: "YOUR_STORAGE_BUCKET", messagingSenderId: "YOUR_MESSAGING_SENDER_ID", appId: "YOUR_APP_ID" }; ``` 또한 SEO 메타 태그도 실제 도메인으로 교체: ```html ``` --- ## 6단계 — Cloudflare Pages 배포 ### 방법 A: GitHub 연동 (권장) 1. GitHub에 새 저장소 생성 2. `public/index.html`과 `_redirects` 파일 업로드 3. Cloudflare Dashboard → **Pages** → **새 프로젝트** 4. GitHub 연동 → 저장소 선택 5. 빌드 설정: - 프레임워크: **없음 (None)** - 빌드 명령: *(비워두기)* - 빌드 출력 디렉터리: `public` 6. **저장 및 배포** 클릭 ### 방법 B: 직접 업로드 1. Cloudflare Dashboard → Pages → **직접 업로드** 2. `public` 폴더를 통째로 드래그 --- ## 7단계 — Firebase 승인 도메인 추가 1. Firebase Console → Authentication → **설정** 탭 2. **승인된 도메인** → `YOUR_DOMAIN.pages.dev` 추가 3. 커스텀 도메인도 사용한다면 그것도 추가 --- ## GSC (Google Search Console) 연동 1. https://search.google.com/search-console 접속 2. 속성 추가 → URL 접두어 → 사이트 URL 입력 3. HTML 태그 인증 방법 선택 → meta 태그 복사 4. `index.html` `` 내에 붙여넣기 후 재배포 5. 인증 완료 후 **사이트맵 제출**: `https://YOUR_DOMAIN/sitemap.xml` --- ## 📊 Firebase 무료 한도 (Spark 플랜) | 항목 | 무료 한도 | |------|----------| | 문서 읽기 | 50,000회/일 | | 문서 쓰기 | 20,000회/일 | | 문서 삭제 | 20,000회/일 | | 저장 용량 | 1 GiB | | Authentication | 10,000 MAU | 소규모 커뮤니티에서는 무료로 충분히 운영 가능합니다. --- ## 🎨 커스터마이징 ### 게시판 이름 변경 `index.html`에서 `boards` 객체 수정: ```javascript boards: { free: '자유게시판', info: '정보공유', qna: '질문답변', humor: '유머' } ``` ### 색상 변경 CSS `:root` 변수에서 `--accent`, `--bg` 등 수정 ### 사이트 이름 변경 - `` 태그 - `.logo` 텍스트 ("제로보드") - Open Graph 메타 태그