욕심도 참 많아

한국어처럼 조합형 문자를 웹에서 입력할 때, 의도치 않게 중복 요청이 발생하는 경우가 자주 있다. 특히 React 환경에선 이 문제가 더 자주 보이는데, 원인과 해결 방법을 클라이언트, 훅, 서버 단에서 정리해봤다. 🧩 왜 한글 입력 시 중복 요청이 발생할까?1. 조합형 언어의 특성한글은 자음과 모음을 조합해 글자를 만든다. 예: ㄱ + ㅏ = 가IME(Input Method Editor)가 입력 중간 상태를 관리하면서 하나의 글자 입력에 여러 이벤트가 발생함영어는 키보드를 누르면 바로 글자가 입력되지만, 한글은 조합 과정이 있어 조합 시작 → 변경 → 완료 등의 중간 단계를 거침2. React의 이벤트 처리 방식React는 입력 이벤트를 상태 변화로 감지하고 리렌더링함한글 입력 중간 상태에서도 이벤트..

프로젝트를 진행하던 중, Github Action으로 테스트 빌드를 하는 과정에서 에러가 났다. pnpm build를 하는 과정에서 에러가 났고,에러 로그는 이렇게 떴었다.관련 로그를 찾아보니 Github Action 에서 러너로 VM을 제공하는데, 이때 VM에서 node.js와 패키지 매니저를 받아올때 생기는 에러로 추측됐다.그래서 우선 node.js버전을 최신화 해보려다가, 바로 전에 node20 , node22 두 버전 모두 잘 돌아갔던걸 확인했기에 pnpm의존성 문제가 있나 확인해보았다.pnpm package들의 버전과 현재 프로젝트의 node간의 문제는 없었고, 로컬에서는 멀쩡하게 빌드가 잘 되고 있었기에 대체 어디가 문제인가 해서 ci.yml파일에 # 캐시 삭제- name: Clear PNPM..

프로젝트를 진행 하던 중 멀쩡하게 로컬에선 잘 돌아가던 프로젝트가 build가 안되는 문제가 발생했다. 처음에는 모든 paths에서 다 에러가 난다고 해서, 의존성 패키지 혹은 옛날 브랜치부터 하나하나 다 까보면서 의존성 삭제 -> 설치 -> 빌드 를 반복했다.CI / CD의 중요성을 너무나도 절실히 느꼈다. 빌드가 정상적으로 되는 브랜치와 그 다음 작업된 브랜치를 확인해 보니, App Router의 기본적인 Loading, Error 같은 페이지들을 추가한 뒤로 안되고 있는 것을 확인했다. 이때 처음 생각했던 문제는 해당 페이지들을 작업하면서 사용한 twin.macro 혹은 "use client"의 부재 문제라고 생각했다. 하지만 해당 문제를 모두 해결했음에도 빌드 에러는 계속해서 났고, error, ..