---
type: tutorial
title: 계정과 첫 사이트 키 만들기
summary: 로그인하고, 개인 팀을 열고, 다른 모든 곳에서 사용할 공개 키와 시크릿을 발급하세요.
---

세 개의 짧은 레슨 중 첫 번째입니다. 셋을 함께 따라가면 빈 계정에서 시작해 라이브 폼을 지키는 진짜 게임 챌린지에 이르게 됩니다.

당신은 **BananaSeed**에서 일하고 있는데, 사이트의 문의 폼이 스팸에 잠겨 있습니다. 봇과 스크립트로 움직이는 AI 에이전트가 하루 종일 쓰레기 제출을 쏟아붓습니다. 당신은 그 폼 앞에 Caputchin을 세워, 진짜 사람만 통과시키고 싶습니다.

Caputchin이 그 일을 하는 방식은 이렇습니다. 누군가 당신의 문의 폼을 열면, Caputchin은 브라우저 안에서 짧은 챌린지(간단한 체크박스 또는 짧은 게임)를 건넵니다. 그것을 풀면 일회용 토큰을 얻고, 페이지는 그 토큰을 제출과 함께 보냅니다. 그러면 당신의 서버는 요청을 신뢰하기 전에 그 토큰을 Caputchin으로 확인합니다. 당신의 엔드포인트로 곧장 POST하는 봇은 챌린지를 푼 적이 없으니 유효한 토큰이 없고, 당신의 서버는 그것을 돌려보냅니다.

BananaSeed의 사이트는 **Express**로 돌아가는 **Node.js** 백엔드를 둔 **React** 프런트엔드라, 다음 두 레슨은 바로 그 스택에 맞는 동작하는 코드를 건넵니다. 같은 단계가 어떤 프레임워크나 언어로도 옮겨지며, 문법만 달라집니다.

먼저 BananaSeed에는 계정과 사이트 키가 필요합니다. 약 2분, 신용카드 불필요, 아직 설치할 것도 없습니다.

## 끝나면 갖게 되는 것

- Caputchin 계정 하나.
- 사이트 키 하나, 사실은 한 쌍의 값입니다:
  - 페이지에 들어가는 **공개 키**(`cpt_pub_...`),
  - 서버에만 머무는 **시크릿**(`cpt_sec_...`).

## 1. 로그인하기 (이것이 계정도 만듭니다)

[caputchin.com/login](https://caputchin.com/login)으로 가세요. 별도의 가입 단계는 없습니다. 이메일로 처음 로그인하는 것이 곧 계정을 만드는 일입니다. 편한 방식을 고르세요:

- **이메일로 로그인 링크 받기**, 그다음 이메일의 링크를 클릭, 또는
- **GitHub로 계속하기**, 또는
- **Google로 계속하기**.

우리는 언제나 당신의 확인된 이메일 주소만 읽습니다.

들어오고 나면, 주소 표시줄이 `/app/troops`를 가리키는 것을 보세요. Caputchin은 당신을 곧바로 팀 안으로 데려다 놓습니다.

## 2. 개인 팀 열기

사이트 키를 만들기 전에, 그것이 어디에 사는지 알아 두면 도움이 됩니다. Caputchin의 거의 모든 것은 **팀** 안에 자리합니다. 팀은 작업 공간이며, 당신의 사이트 키, 그 키들이 공유하는 게임 맞춤화, 그리고 (유료 요금제에서는) 함께 관리하도록 초대하는 팀원을 소유하는 바로 그것입니다. Caputchin은 일부러 팀을 중심으로 지어졌습니다. 사이트 키는 늘 팀에 속하지 계정에 직접 속하지 않으며, 바로 그것이 나중에 로그인을 공유하지 않고도 팀 전체가 같은 키를 관리하도록 해 줍니다. 결제와 좌석은 팀들 위, 계정 수준에 자리하지 그중 한 팀 안에 있지 않습니다.

모든 계정은 당신만으로 이루어진 **Personal**이라는 팀 하나로 시작합니다. 이 가이드에는 그것이면 충분합니다. 그걸 넘어설 만큼 커지면 공유 팀을 만들고 멤버를 초대하지만, 아래의 어떤 것도 달라지지 않습니다.

**Personal**을 클릭해 여세요. 팀은 곧바로 **사이트 키**로 열리므로, 거기에 도착합니다. 주소 표시줄을 보세요: `/app/troops/<id>/site-keys`. 당신이 곧 만들 키는 팀 아래에 중첩되며, 방금 설명한 바로 그 소유 관계입니다.

## 3. 첫 사이트 키 만들기

**사이트 키 만들기**를 클릭하고, `My site` 같은 이름을 주고, **만들기**를 클릭하세요. 이름 말고는 요구하지 않습니다.

Caputchin이 두 값을 보여 줍니다:

| 값 | 생김새 | 들어가는 곳 |
|---|---|---|
| 공개 키 | `cpt_pub_...` | 페이지의 위젯 요소에. 브라우저로 보내도 안전합니다. |
| 시크릿 | `cpt_sec_...` | 서버에만. 절대 클라이언트 측 코드에 넣지 마세요. |

배너를 보세요: **"지금 시크릿을 복사하세요. 다시는 보여 드리지 않습니다."** 시크릿을 복사해 서버가 읽을 수 있는 곳(환경 변수, 시크릿 매니저)에 보관하세요. 공개 키는 키의 **Integration** 페이지에서 언제든 다시 볼 수 있지만, 시크릿은 딱 한 번 표시됩니다. 잃어버리면 복구가 아니라 교체합니다.

갓 만든 키에는 아직 오리진 제한이 없으며, 바로 그것이 다음 레슨에서 당신의 테스트 페이지가 로컬에서 동작하게 해 줍니다. 키의 설정에 대해서는 [사이트 키](/docs/site-keys/overview)에서 더 보세요.

## 방금 일어난 일

| 단계 | 어디서 | 결과 |
|---|---|---|
| 첫 로그인 | 브라우저 | 계정이 만들어지고 개인 팀이 준비됩니다. |
| 사이트 키 만들기 | 대시보드 | 페이지용 공개 키와 서버용 시크릿. |

<Callout type="success">계정과 첫 사이트 키를 갖췄습니다. 나머지 모든 것이 그 위에 쌓이는 토대입니다. 잘하셨어요. 🎉</Callout>

## 다음

키를 손에 넣었습니다. 이제 위젯을 페이지에 올리고 진짜 검증이 일어나는 것을 지켜볼 차례입니다.

[당신의 사이트에 위젯 추가하기](/docs/getting-started/add-the-widget)로 계속하세요.
