집중 타이머 만들기: 시작·멈춤·초기화

집중 타이머에서 시작·일시정지·재개·초기화를 확인했습니다.

1. Codex에서 새 작업을 열고 아래 제작 프롬프트를 그대로 붙여 넣습니다. 2. 완성된 demo.html을 브라우저에서 엽니다. 3. 시작하고 수가 줄면 일시정지를 누릅니다. 잠시 기다려도 값이 같은지 보고 이어서 시작한 뒤 초기화해 00:10으로 돌아오는지 확인합니다.

짧은 집중 시간을 재는 연습용 타이머를 만들어줘. 시작하면 숫자가 줄어들고, 일시정지하면 멈추며, 다시 시작하면 남은 시간부터 이어지게 해줘. 초기화하면 처음 시간으로 돌아가야 해. 작동을 빨리 확인할 수 있도록 시험할 때는 짧은 시간을 사용하고 알림이나 저장은 넣지 말아줘. 나는 코딩을 처음 해. 어려운 말은 짧게 풀어 설명하고, 먼저 현재 상황을 확인한 뒤 요청한 범위만 진행해줘. 확인할 수 없는 내용은 추측하지 말고 알려줘. 내 실제 데이터나 비밀값을 사용하지 말고, 새 유료 서비스나 외부 API를 추가하지 마. 작업을 마치면 내가 직접 확인할 순서와 실행하지 못한 부분을 나누어 알려줘.

처음 00:10에서 시작한 뒤 남은 시간이 00:09로 줄었다. 일시정지 후 1.2초를 기다려도 00:09가 유지됐다. 이어서 시작하면 00:08까지 줄었고 초기화하면 00:10과 시작 대기로 돌아갔다. 같은 동작을 390×844에서도 다시 확인했고, 가로 넘침 없이 모든 조작 요소가 화면에 들어왔다.

정지 중에도 시간이 줄거나 초기화가 안 된다면 각 버튼을 다시 확인하고 고쳐줘.

요청 조건을 읽고 제작·검사한 예제입니다. 문장만 넣은 독립적인 1회 생성 실험은 아닙니다. VibeAZ 자체 제작 · 확인한 예제 파일과 환경에서의 결과입니다. Chrome 한 버전과 1280×900·390×844 화면에서 확인했습니다. 별도 기기, 다른 브라우저나 코딩 도구에서의 동작은 확인하지 않았습니다.