지난 10개월간 Claude와 함께 프로젝트를 만들었는데, 오늘 밤 Claude에게 본인이 생각하기에 가장 똑똑하고 자랑스러운 코드를 보여달라고 했습니다
I've spent the last ten months building a project with Claude, and tonight I asked it to show me a bit of the code that he thinks is very clever and he's proud of
핵심 요약
Claude가 제안한 바코드 스캐너 입력을 키보드 타이핑과 구분하는 간단하고 효율적인 코드 로직을 공유한 글입니다.
- 바코드 스캐너 — 키보드 입력으로 인식되는 스캐너의 특성을 활용함
- 입력 구분 로직 — 타이핑 속도 차이(60ms)를 이용해 스캔과 사람의 입력을 분리함
- 코드 효율성 — 별도의 타이머나 API 없이 단순한 연산만으로 구현됨
- 커뮤니티 반응 — 코드의 창의성에 감탄하는 의견과 실용성에 의문을 제기하는 의견이 공존함
바코드 스캐너 리스너인 src/hooks/useLabelScan.ts를 골라봤어. 50줄 정도 되는 코드인데, 그중 딱 한 줄이 거의 모든 일을 다 해먹어:
// A scanner's keys come well under this apart; a person's, well over.
const GAP_MS = 60;
const onKey = (event: KeyboardEvent) => {
if (typingIn(event.target) || event.ctrlKey || event.metaKey || event.altKey) return;
const now = performance.now();
if (now - last > GAP_MS) typed = ''; // ← this line
last = now;
if (event.key === 'Enter') {
const code = typed.length >= 2 ? readLabelCode(typed) : null;
typed = '';
...navigate to the ticket or device
}
if (event.key.length === 1) typed = (typed + event.key).slice(-16);
};
이게 왜 맘에 드냐면, USB 바코드 스캐너는 사실 앱이 직접 통신할 수 있는 장치가 아니거든. 컴퓨터 입장에선 그냥 키보드야. 드라이버도 없고, API도 없고, 페어링도 없어. 그냥 T7001 치고 엔터 누르는 게 다라고. 그래서 앱이 "이거 스캔한 거야?"라고 물어볼 수가 없어. 그냥 키 입력만 지켜볼 수 있는데, 스캔하는 거랑 사람이 티켓 페이지에서 타자 치는 거랑 똑같이 보이거든.
딱 하나 다른 점이 있다면 바로 속도야. 스캐너는 키 하나당 몇 밀리초 만에 코드를 다다다 쳐버리거든. 사람은 아무리 타자 빨라도 대부분 키 사이에 60ms 이상의 간격이 생기기 마련이지.
그래서 스캔인지 아닌지 구분하려고 애쓰는 대신, 리스너가 그냥 느린 건 다 까먹게 만들었어. 마지막 입력으로부터 60ms 넘어서 들어오는 키는 무조건 버퍼를 싹 날려버리는 거지. 사람이 타자 치면 코드가 완성될 틈이 없어. 세 번째 키 누를 때쯤이면 이미 앞의 두 글자는 사라져 있거든. 반면에 스캐너는 순식간에 쏟아내니까 엔터까지 딱 들어오고, 그게 라벨 코드(T 뒤에 숫자, 혹은 D 뒤에 장치 ID) 형식에 맞으면 앱이 바로 열어주는 거야.
별도의 모드도 없고, "스캔 시작" 버튼도 없고, 백그라운드에서 돌아가는 타이머도 없어. 그냥 뺄셈 한 번 하고 리셋하는 게 끝이야. 앞에 붙는 T도 중요한데, 숫자만 달랑 있는 옛날 라벨을 스캔하면 아무 일도 안 일어나. 우연히 같은 숫자를 가진 티켓이 열리는 불상사를 막는 거지.
라벨 테스트를 해보면 확실해. 똑같은 T3를 8ms 간격으로 보내면 티켓이 열리는데, 150ms 간격으로 보내면 아무 일도 안 일어나거든.
----------------------------
이거 진짜 귀엽지 않냐? 물어보길 잘했다는 생각이 들어!
