[JavaScript] 사파리에서 파일을 업로드했을 때 파일명 자소분리 현상이 발생하는 문제
·
Error Note
사파리 브라우저에서 한글명이 포함된 파일을 업로드했을 때 자소분리 현상이 발생하는 경우가 있다. 안녕.txt → ㅇㅏㄴ ㄴㅕㅇ.txt 해당 문제는 브라우저마다 유니코드 정규화 방식이 다르기 때문에 발생하는 문제라고 한다.서버 쪽에서 파일명을 처리할 때 정규화 방식을 명시적으로 지정해주면 된다. 자바스크립트에서는 아래 메서드를 사용해서 문제를 해결할 수 있었다. const fileName = "ㅇㅏㄴㄴㅕㅇ.txt"; // 자소분리된 파일명const normalizedFileName = fileName.normalize('NFC'); // "안녕.txt"로 변환 ▶ 정규화 형태  - NFC : 모든 분리된 문자 조합을 하나의 조합된 문자로 변환함  - NFD : 모든 조합된 문자를 분리된 기본 문자로 변환함
[JavaScript] Node.js 설치하기
·
JavaScript
# scoop 설치하기https://scoop.sh/ [Windows PowerShell] 에 아래 코드를 실행해서 scoop을 설치한다.Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -Scope CurrentUserInvoke-RestMethod -Uri https://get.scoop.sh | Invoke-Expression 설치 후 'scoop'이라고 입력했을 때 아래와 같은 형식으로 출력되면 설치가 완료된 것이다.  # nvm (Node Version Manager) 설치하기scoop install nvm sudo sudo는 관리자 권한으로 실행할 수 있게 해주는 명령어이다.설치 후 'nvm version'이라고 입력했을 때 아래와 같은 형식으로 출력되면..
[IT] 신입 개발자 기술 면접 질문 정리 2 - HTML, CSS, JavaScript
·
etc.
* 취준생 시절 면접 때 직접 들었던 질문 위주로 정리했고, 예상 질문으로 제가 준비했던 것들도 있습니다. - 인성 면접 : https://young0105.tistory.com/347- 기술 면접 1 : https://young0105.tistory.com/348- 기술 면접 3 : https://young0105.tistory.com/350- 기술 면접 4 : https://young0105.tistory.com/351 ●  margin과 padding의 차이  - 요소의 테두리를 기준으로 했을 때, 테두리 바깥의 여백이 margin이고 테두리 안쪽의 여백이 padding  - https://young0105.tistory.com/26  ● 과 의 차이  - : inline 요소 (줄바꿈 X)  -..
[JavaScript] 스크롤을 움직여도 window.scrollY가 변하지 않는 문제
·
Error Note
스크롤을 움직여도 window.scrollY가 0으로 고정되어 있는 문제가 있었다. 찾아보니 body에 height: 100%이 되어 있을 때 발생하는 문제라고 한다. 기존 csshtml,body {overflow-x: hidden; height: 100%;}수정body {overflow: hidden;}html {overflow-x: hidden;}height: 100%를 제거했더니 window.scrollY는 측정되는데 스크롤바가 2개가 생기는 문제가 있어서body는 overflow: hidden로 수직, 수평 스크롤바가 둘 다 보이지 않게 처리해서 해결했다.
[Javascript] 스크롤 이벤트가 인식되지 않는 문제
·
Error Note
무한 스크롤 처리를 하려는데 스크롤 이벤트가 인식되지 않는 문제가 있었다. 기존 코드window.addEventListener('scroll', function() { console.log('test');});해결3번째 인자로 true를 추가해주니 정상적으로 작동했다.window.addEventListener('scroll', function() { console.log('test');}, true); # addEventListener의 세 번째 인자1) true   - 이벤트 리스너가 캡처링 단계에서 호출됨  - 이벤트가 하위 요소에 도달하기 전에 해당 이벤트를 가로채야 할 때2) false (기본값)  - 이벤트 리스너가 버블링 단계에서 호출됨 #  캡처링  - 이벤트가 발생한 요소의 상위 요소에서부..