🤖 바이브 코딩

빙고 게임 웹 앱 빌더

색상 번호 보드, 속도 제어, 오디오, 라인/빙고 확인, CSV를 통한 카드 가져오기, 게임 관리를 갖춘 완전 기능의 대화형 빙고 게임 웹 앱을 구축합니다.

내 정보 입력

정보를 입력하시면 자동으로 반영돼요!

다음 사양에 따라 완전한 대화형 빙고 게임 웹 앱을 구축합니다: **게임 규칙:** - 1부터 90까지의 숫자 - 각 세션은 무작위로 숫자를 뽑습니다 — 게임당 반복 없음. **번호 보드:** - 9×10 그리드에 호출된 숫자 표시 - 각 열은 범위를 포함합니다: 열 1 = 1–10, 열 2 = 11–20, ..., 열 9 = 80–90 - 각 행은 읽기 쉬운 고유한 색상을 가집니다. - 숫자는 호출될 때 강조 표시됩니다. **컨트롤:** - **속도 선택기: ** 호출 속도 조정 (느림 / 보통 / 빠름) - **볼륨 선택기: ** 오디오 레벨 제어 - **현재 숫자 반복 버튼: ** 마지막 숫자를 다시 발표합니다. - **이전 숫자 반복 버튼: ** 직전 숫자를 다시 발표합니다. - **일시 중지 / 재개 버튼** - **새 게임 버튼: ** 새로운 무작위 추첨으로 새 게임을 시작합니다. - **재설정 버튼: ** 현재 세션을 재설정합니다. **빙고 카드:** - 카드는 3행 × 9열로 구성됩니다 (스페인어 빙고 형식). - 각 행에는 적절한 열 범위에 배치된 5개의 숫자가 있습니다. - 열 1: 1–9, 열 2: 10–19, 열 3: 20–29, ... 열 9: 80–90 - 각 카드에는 고유한 코드가 있습니다. - CSV 파일 업로드를 통해 카드 가져오기 (코드 + 숫자 형식). - 개별 카드 코드 및 숫자 수동 입력도 허용합니다. - 가져온 카드를 localStorage에 유지 — 각 세션마다 다시 가져올 필요가 없습니다. **확인:** - **라인 버튼: ** 게임을 일시 중지하고 플레이어 카드 코드를 요청하며, 한 행의 5개 숫자가 모두 호출되었는지 확인합니다 (게임당 최대 한 줄 승리). - **빙고 버튼: ** 플레이어 카드 코드를 요청하고, 카드에 있는 15개 숫자가 모두 호출되었는지 확인합니다. **기술 스택:** HTML, CSS, JavaScript (바닐라 또는 React), 숫자 발표를 위한 Web Speech API, 카드 지속을 위한 localStorage.
🔒 잠금 해제 후 전체 보기

AI에서 열기

공유하기