JavaScript 썸네일형 리스트형 한글 입력 시 발생하는 IME 이슈 및 타이핑 로직 오류 해결 서비스 개발을 하다가 한글 입력 시 올바른 글자를 입력했음에도 불구하고 시스템이 오타로 판정하는 버그를 발견했다. 로직 자체의 결함보다는 브라우저의 한글 처리 방식인 IME(Input Method Editor)에 대한 이해 부족이 원인이었다. 1. 문제 상황"무리"라는 단어를 입력할 때, 시스템은 다음과 같은 흐름으로 입력을 감지한다.'ㅁ' 입력 -> 원문 '무'와 불일치 (오타 판정)'ㅜ' 입력 ('무' 완성) -> 일치'ㄹ' 입력 -> 원문 '리'와 불일치 (오타 판정)단순하게 onChange 이벤트에서 입력값과 원문을 1:1로 비교할 경우, 한글처럼 초성·중성·종성이 결합되는 조합형 문자는 완성 전 단계에서 반드시 오류가 발생하게 된다. 2. 원인 분석: IME와 브라우저 이벤트한글, 일본어, 중국.. 더보기 Node 설치 가이드 (zsh + Homebrew 기준) 서론이번에 노트북을 새로 바꾸게 되어서, 개발 환경 세팅을 해야 했습니다. node 기반의 프로젝트를 많이 진행해왔기에, node 설치는 필수였는데요? 설치해야 한느 것을 모른 채, npm install을 한 줄 실행했는데, 시작부터 node: command not found가 나오게 되어서 설치의 필요성을 다시금 알게 되었습니다.특히 macOS에서 Homebrew가 이미 설치되어 있어도, 앞으로 편하게 Node를 설치하는 방법이 헷갈리실 수 있습니다. 이번 글에서는 zsh 환경 기준으로 다음을 정리했습니다.왜 nvm 방식이 실무에서 유리한지실제 설치 순서설치 후 바로 확인할 체크포인트처음 설치하시는 분, 예전에 설치했는데 꼬였던 분은 제가 경험하고 공유드리는 이 글 하나로 깔끔하게 정리하실 수 있습니다.. 더보기 [Node.js] 자바스크립트 기초 문법과 모듈 노드는 자바스크립트 문법을 사용해 실행함 또한, 모듈을 사용하여 생산성을 높임 템플릿 리터럴 템플릿 리터럴은 문자열과 변수, 식을 섞어서 하나의 문자열을 만드는 표현 형식이다. (₩) 벡틱 기호를 사용해 문자열을 만든다. let num1= 10; let num2= 20; // 연결 연산자인 + 을 사용할 경우 console.log(num1 + "과 " + num2 + "을/를 더하면 "+ (num1+num2) + "입니다."); // 템플릿 리터럴을 사용할 경우 console.log(`${num1}과 ${num2}을/를 더하면 ${num1+num2} 입니다.`); 둘 다 출력하는 값은 같지만, 방식에 있어서 차이점이 있다. 그동안 배운 언어에서는 항상 연결 연산자인 전자를 사용해서 출력했으나, 새로운 방.. 더보기 이전 1 다음
