# Forms

정적 사이트에 문의·신청 폼을 붙입니다. 폼 처리 코드를 새로 짤 필요 없이, HTML `<form>` 에 `data-saeroon-form` 속성 하나만 선언하면 됩니다.

## 폼 선언

폼 요소에 `data-saeroon-form="<slug>"` 을 붙이고, 받을 값마다 `name` 을 지정합니다. slug 는 이 사이트 안에서 폼을 구분하는 이름입니다.

```html
<form data-saeroon-form="inquiry">
  <input name="name" required />
  <input name="email" type="email" required />
  <textarea name="message" required></textarea>
  <button type="submit">보내기</button>
</form>
```

제출 상태와 실패 사유는 배포 시 주입되는 스크립트가 폼 안에 상태 줄을 자동으로 만들어 표시합니다 — 별도 마크업이 필요 없습니다. 제출에 성공하면 폼 자리에 완료 안내가 나타납니다.

## 배포 시 자동 처리

`deploy` 는 `data-saeroon-form` 이 있는 HTML을 감지해 다음을 자동으로 처리합니다.

- 사이트에 해당 폼 정의(레코드)를 생성
- 스팸 차단용 Turnstile 위젯 삽입
- 제출을 백엔드로 보내는 submit 스크립트 연결

```bash
npx @saeroon/cli deploy ./my-site
```

> 봇 차단(Cloudflare Turnstile)은 새로온이 대신 처리합니다. **Cloudflare 계정도, 키 발급도 필요 없습니다** — 위젯은 기본으로 주입되고, 배포가 이것 때문에 중단되지 않습니다. 위젯 없이 내보내야 하는 경우에만 `--allow-no-turnstile` 을 붙입니다. `SAEROON_TURNSTILE_SITE_KEY` 환경변수는 셀프호스팅·스테이징에서 프레임을 갈아끼울 때만 쓰는 덮어쓰기 값입니다.

## 제출 내역 보기

들어온 제출은 [hosting 대시보드](https://hosting.saeroon.com)의 사이트 상세에서 확인합니다. 제작 도메인(developers.saeroon.com)은 키·문서·연결을 담당하고, 사이트 운영·데이터 열람은 hosting 대시보드가 담당합니다.

## 프로그래밍 방식 연결 (선택)

폼 백엔드를 명시적으로 붙이거나 스키마·알림 설정을 지정하려면 `feature attach` 를 씁니다. 인증은 `login` 으로 저장한 계정 단위 비밀 키를 그대로 쓰며, 이 명령이 사이트별 키를 따로 발급하지는 않습니다.

```bash
npx @saeroon/cli feature attach form --site <site-id>
```

`<site-id>` 는 `deploy` 응답에 담기며 `saeroon.config.json` 에도 저장됩니다.

## 속성 요약

| 속성 | 위치 | 뜻 |
|---|---|---|
| `data-saeroon-form="<slug>"` | `<form>` | 폼으로 표시(필수). slug 로 사이트 안에서 구분 |
| `name="<필드>"` | 입력 요소 | 제출에 담길 값의 키 |

전체 속성 표는 [Attributes](/docs/attributes)를 참고하세요.

## 로드맵

- 예약(booking)·컬렉션(collection) 백엔드 부착은 준비 중입니다. 현재 `feature attach` 가 지원하는 대상은 폼입니다.