AI가 만든 숫자 입력의 inputmode: 키보드 힌트와 값 검증을 나누세요
inputmode="numeric" 은 숫자 입력에 맞는 가상 키보드를 보여주기 위한 힌트입니다. 이 속성 하나가 문자 입력을 금지하거나 제출값을 검사해 주지는 않습니다. AI에 ‘숫자만 받는 입력칸’을 부탁한 뒤 휴대폰에서 숫자 키패드가 보였다고 검토를 끝내기 쉽습니다. 무엇을 편하게 입력하도록 할지와 어떤 값을 허용할지는 따로 적어두세요. 목차 1. inputmode가 맡는 역할 2. 짧은 코드에서 빠진 조건 찾기 3. 검수 메모를 두 칸으로 나누기 4. 자주 묻는 질문 1. inputmode가 맡는 역할 MDN은 inputmode를 사용자가 입력할 데이터의 종류를 브라우저에 알려주는 힌트로 설명하고, 이 속성이 유효성 요구사항을 강제하지는 않는다고 명시합니다. numeric은 숫자 키보드, decimal은 사용자의 지역에 맞는 소수 구분자가 포함된 키보드를 위한 값입니다. 마이너스 키 제공 여부는 기기에 따라 달라질 수 있습니다. 따라서 코드 검토 메모에 ‘숫자 입력 완료’라고 한 줄만 쓰면 키보드가 편해졌다는 뜻인지, 값의 허용 조건을 확인했다는 뜻인지 알기 어렵습니다. 입력 화면에서 관찰한 것과 데이터 규칙에 대해 확인한 것을 분리하세요. 2. 짧은 코드에서 빠진 조건 찾기 <label for="sample-code">연습용 코드</label> <input id="sample-code" type="text" inputmode="numeric"> 위 코드는 학습용 예시입니다. 요구사항이 ‘숫자 네 자리’라면 코드를 보는 사람은 네 자리라는 조건을 어디에서 처리하는지 추가로 찾아야 합니다. 숫자 키보드를 기대하는 속성이 있다는 사실만으로 자릿수·빈 값·붙여넣기 처리까지 구현됐다고 표시하지 않습니다. AI에 수정 요청을 할 때도 ‘숫자만 되게’ 대신 실제 필요한 값의 형태를 적어보세요. 예를 들어 ‘이 연습용 칸은 네 자리 문자열을 받으...