> ## Documentation Index
> Fetch the complete documentation index at: https://supastack.dev/llms.txt
> Use this file to discover all available pages before exploring further.
> For the full documentation corpus in one file, fetch: https://supastack.dev/llms-full.txt

# SEO와 공유

메타데이터, 사이트맵, robots, 소셜 이미지.

## 시작하기 전에

파일 → 폴더 열기를 사용하여 Visual Studio Code에서 다운로드한 supastack 프로젝트를 연 다음 터미널 → 새 터미널을 선택합니다. 저장소 루트는 package.json, 앱 및 패키지가 포함된 폴더입니다. 아래 명령을 실행하고 터미널을 열어 두십시오. 명령이 인식되지 않으면 계속하기 전에 도구 설치 가이드를 완료하세요.

먼저 플랫폼 튜토리얼을 읽어보세요. 서버는 브라우저 또는 전화 요청에 응답하는 앱 프로세스입니다. 웹은 apps/web-tanstack/.env.local를 읽고, Expo는 apps/mobile/.env.local를 읽고, 데이터베이스 마이그레이션 명령은 루트 .env를 읽습니다. 데이터베이스 없는 /dashboard 데모는 Postgres를 마이그레이션해야 하는 실제 /auth 계정과 별개입니다. 전화 또는 데스크톱 전용 결제에는 별도로 실행되는 웹 백엔드가 필요합니다.

[도구 설치 및 코드 받기](https://supastack.dev/ko/docs/tanstack/before-you-start.md)

[명령, 파일 및 구성 알아보기](https://supastack.dev/ko/docs/tanstack/terminal-basics.md)

[웹 첫 실행 튜토리얼 완료](https://supastack.dev/ko/docs/tanstack/ship-in-5-minutes.md)

```
corepack pnpm --filter @supastack/web-tanstack dev
```


## 설치 및 설정

라우트 수준 메타데이터는 공유 페이지 모듈에서 옵니다 — 각 packages/web-core/src/pages/<route>/page.load.ts가 메타데이터를 내보내고 파일 라우트가 metadataToHead를 통해 head()로 노출해 로케일 사전에서 제목과 설명을 해석하므로 검색 결과도 로컬라이즈됩니다.

src/routes/sitemap[.]xml.ts와 src/routes/robots[.]txt.ts 라우트가 크롤 가능한 표면을 생성하고, 래스터화된 OG 이미지(src/framework/og.ts)와 아이콘 에셋이 소셜 미리보기를 담당합니다. settings, billing, admin, API 같은 비공개 라우트는 사이트맵에서 빼고 robots에서 disallow하세요.

```
src/routes/sitemap[.]xml.ts   public routes only
src/routes/robots[.]txt.ts    disallow private surfaces

// per page — packages/web-core/src/pages/<route>/page.load.ts,
// surfaced through the route's head() via metadataToHead
export const metadata = { title, description };
```


## 구현 워크플로

모든 공개 페이지에 고유한 제목과 설명을 주고, 검색 결과, 필터된 뷰, 인증된 표면은 절대 인덱싱하지 마세요. 정규 URL은 접두사 없이 유지됩니다 — 로케일 레이어가 이미 기본 로케일을 정규 경로로 리다이렉트합니다.

공개 라우트를 추가할 때 같은 변경에서 사이트맵에도 추가하세요. OG 이미지는 구운 스크린샷 대신 브랜드 토큰으로 유지해 리스타일이 일관되게 하세요.


## 검증 및 문제 해결

프리뷰 배포에서 /robots.txt와 /sitemap.xml을 가져오고, 사이트맵이 파싱되는지 검증하고, 한 페이지를 공유 체크하세요 — 제목, 설명, 이미지. 검색 결과 페이지에 noindex 헤더 또는 meta가 있는지 확인하세요.


## 다음

[제품 테마](https://supastack.dev/ko/docs/tanstack/theming.md)