사이트 연결하기

대상: 사이트 운영자 · 소요 시간: 약 5분

이 가이드를 마치면 GitHub 저장소가 깃지기에 연결되고, 수정 결과를 미리 볼 수 있는 미리보기 주소까지 설정됩니다.

💡 사전 조건: 사이트가 아래 두 가지를 갖추고 있어야 합니다. GitHub 저장소로 관리되는 Next.js·React 사이트라면 연결할 수 있습니다. 실시간 미리보기는 현재 Vercel 배포에서 지원됩니다. 콘텐츠가 아직 분리되지 않은 사이트도 걱정할 것 없습니다 — 연결하면 깃지기가 자동으로 확인하고, 필요한 준비(변환 프롬프트)를 화면에서 안내합니다.

GitHub에 깃지기 설치하기

1. 대시보드 왼쪽 메뉴에서 사이트로 이동해 GitHub에서 사이트 연결을 누릅니다.

2. GitHub 설치 화면이 열리면 계정을 선택하고, Only select repositories에서 연결할 저장소만 선택합니다.

3. Install을 누르면 깃지기로 자동으로 돌아옵니다.

[스크린샷: GitHub App 설치 화면 — 저장소 선택]

💡 깃지기가 요청하는 권한은 콘텐츠 파일 읽기·쓰기(Contents)와 기본 정보(Metadata) 딱 두 가지입니다. 선택한 저장소 외에는 아무것도 볼 수 없습니다.

저장소와 브랜치 선택하기

돌아온 연결 화면에서:

1. 방금 허용한 저장소를 선택합니다.

2. 실제 사이트가 배포되는 브랜치를 선택합니다. 대부분 main입니다.

3. 사이트 이름을 입력합니다 — 고객에게 보이는 이름이니 알아보기 쉽게 적어 주세요. (예: 로스터리 모모 홈페이지)

4. 저장을 누르면 깃지기가 자동으로 사이트를 확인합니다.

[스크린샷: 저장소·브랜치 선택 화면]

사이트 확인 — 깃지기가 알아서 합니다

연결 직후 깃지기가 저장소를 읽어 편집 가능한 항목을 찾습니다. 코드는 변경하지 않습니다.

• 준비가 끝난 사이트 — "편집 가능한 항목 N개를 찾았어요"가 표시되고 바로 다음 단계(수정할 값 지정)로 넘어갑니다.

• 준비가 필요한 사이트 — "한 단계만 더 하면 편집을 시작할 수 있어요" 화면이 나타납니다. 프롬프트 복사 버튼을 눌러 평소 쓰시는 AI(Cursor·Claude Code 등)에 붙여넣고 실행하면, 콘텐츠가 편집 가능한 형태로 분리됩니다. 디자인·기능은 그대로입니다. AI가 끝내고 저장소에 반영되면 깃지기가 자동으로 감지해 다음 단계로 넘어갑니다.

[스크린샷: 사이트 확인 화면 — 준비 필요 상태와 프롬프트 복사 버튼]

💡 변환은 보통 몇 분에서 십수 분 걸립니다(사이트 규모에 따라 다름). 그동안 화면을 닫아도 되고, 다시 들어오면 이어서 진행됩니다.

미리보기 주소 설정하기

수정 결과를 실제 화면으로 미리 보려면 Vercel의 미리보기 주소 형식을 한 번만 등록하면 됩니다.

1. Vercel 대시보드 → 해당 프로젝트 → Deployments에서 아무 Preview 배포를 엽니다.

2. Domains에서 -git-이 들어간 주소를 찾습니다. 예: my-site-git-BRANCH-myteam.vercel.app

3. 브랜치 부분을 {branch}로 바꾼 주소를 깃지기 사이트 상세의 프리뷰 URL 패턴에 입력합니다. 예: https://my-site-git-{branch}-myteam.vercel.app

[스크린샷: 프리뷰 URL 패턴 입력 폼]

💡 Vercel의 Deployment Protection(로그인 보호)을 켠 사이트라면 미리보기 열쇠를 등록해 주세요. 보안을 유지한 채 깃지기 미리보기만 통과시키는 전용 열쇠입니다 — Vercel 프로젝트 → Settings → Deployment Protection → Protection Bypass for Automation에서 Add Bypass(첫 칸은 비워 자동 생성)로 만든 시크릿을 복사해, 깃지기 사이트 설정의 미리보기 열쇠에 붙여넣으면 됩니다. 열쇠 발급은 모든 Vercel 플랜에서 무료입니다. 보호를 끌 필요는 없습니다.

잘 안 될 때

• 저장소가 목록에 없어요 — GitHub 설치 때 해당 저장소를 선택하지 않은 경우입니다. GitHub → Settings → Applications → gitjigy → Configure에서 저장소를 추가해 주세요.

• 연결 버튼을 눌러도 GitHub으로 안 가요 — 브라우저 팝업 차단을 확인해 주세요.

• 미리보기가 화면 안에서 안 보여요 — 위의 미리보기 열쇠 안내를 확인해 주세요. 열쇠를 등록했는데도 안 보이면 발급한 값을 다시 확인해 주세요.

• "content/ 폴더에 JSON 파일이 없습니다"류 안내가 떠요 — 사이트 확인 화면의 안내대로 변환 프롬프트를 실행하면 해결됩니다.

다음 단계

→ 수정할 값 지정하기 — 어떤 텍스트·이미지를 수정할 수 있게 할지 고릅니다.