본문 바로가기

전체 글882

CSS scrollbar-gutter: stable로 스크롤바 때문에 화면 밀리는 현상 막는 순서 항목내용해결할 질문스크롤바가 생기고 사라질 때 화면이 흔들림핵심 답html에 scrollbar-gutter: stable전제기본(classic) 스크롤바 환경바로가기MDN scrollbar-gutter 모달을 열었더니 배경 페이지가 오른쪽으로 덜컥 움직인다면, 원인은 스크롤바일 수 있습니다.모달을 띄우며 body에 overflow: hidden을 주면 세로 스크롤바가 사라지고, 그 폭만큼 콘텐츠 영역이 넓어지면서 레이아웃이 밀립니다.가장 짧은 해결은 아래 한 줄입니다. 스크롤이 생기든 말든 스크롤바 자리를 미리 비워 두는 속성이 scrollbar-gutter입니다.html { scrollbar-gutter: stable;}스크롤바 때문에 화면이 밀린다면 먼저 html에 scrollbar-gutter: .. 2026. 10. 23.
CSS aspect-ratio 이미지 비율 유지하는 법|object-fit 조합 단계별 가이드 항목내용해결할 질문이미지가 찌그러지지 않게 비율 고정핵심 답aspect-ratio + object-fit: cover필요한 환경2021년 9월 이후 브라우저바로가기MDN aspect-ratio 문서 이미지 비율을 고정하는 가장 짧은 답은 너비만 정하고 aspect-ratio로 높이를 계산시키는 것입니다.그런데 이미지 파일의 원래 비율이 다르면 height가 고정된 경우처럼 사진이 늘어나 보이므로, object-fit: cover를 함께 써야 합니다.이 글은 이 두 속성을 순서대로 적용하는 방법과 속성이 안 먹을 때의 원인을 정리합니다.아래 코드는 MDN 문서의 설명을 바탕으로 쓴 설명용 예시이며, 이 글을 쓰면서 직접 실행해 결과를 캡처한 것은 아닙니다. 값의 동작은 MDN 공식 문서 기준입니다.aspe.. 2026. 10. 23.
npm overrides 하위 의존성 버전 고정 방법|package.json 문법·npm ls 판별·EOVERRIDE 해결 항목내용해결할 질문하위 패키지 버전을 고정하는 법핵심 답루트 package.json의 overrides필요한 환경npm 8.3 이상, 루트 프로젝트바로가기npm 공식 문서 overrides 내가 직접 설치하지 않은 패키지(하위 의존성)의 버전을 바꾸고 싶다면 루트 package.json에 overrides 필드를 추가하면 됩니다.가장 안전한 첫 단계는 지금 어떤 버전이 깔려 있는지 보는 것입니다.npm ls 패키지이름이 글은 이 명령으로 현재 상태를 보고, overrides를 쓰고, 적용 여부를 판별하는 순서로 정리했습니다.문법은 npm 공식 문서(CLI v11 문서 기준)를 따랐고, 코드 예시는 모두 설명용입니다.실제 프로젝트에서는 패키지 이름과 버전을 자기 상황에 맞게 바꿔 쓰세요.npm overri.. 2026. 10. 23.
Python argparse store_true 사용법|boolean 플래그 만드는 단계별 가이드 항목내용해결할 질문값 없는 on/off 옵션 만들기핵심 답action='store_true' 한 줄전제 환경Python 3.9 이상 권장바로가기argparse 공식 문서 argparse에서 --verbose처럼 값 없이 켜고 끄는 옵션은 add_argument('--verbose', action='store_true') 한 줄이면 만들어진다.옵션을 쓰면 True, 쓰지 않으면 False가 args.verbose에 들어간다.이 글은 그 한 줄에서 시작해, 반대 방향인 store_false, 흔히 빠지는 type=bool 함정, --no- 옵션까지 만드는 BooleanOptionalAction을 순서대로 다룬다.예제 출력은 Python 공식 문서에 실린 결과를 기준으로 했다. argparse store_t.. 2026. 10. 23.
TypeScript exactOptionalPropertyTypes 설정법과 ?: · | undefined 차이 단계별 정리 독자 질문?: 와 | undefined는 뭐가 다른가핵심 답속성이 없음과 undefined 값을 분리필요 환경TS 4.4 이상, strictNullChecks 켬바로가기TSConfig 공식 레퍼런스 선택적 속성(age?: number)에 undefined를 직접 넣을 수 있느냐가 이 옵션의 전부입니다.기본값에서는 넣을 수 있고, exactOptionalPropertyTypes를 켜면 TS2375(객체 리터럴 대입) 또는 TS2412(속성 대입) 오류로 막힙니다.아래에서 켜는 순서, 오류 문구, 고치는 방법을 차례로 정리합니다.코드 예시는 공식 문서의 예제를 바탕으로 한 설명용입니다. 이 글에서 직접 컴파일해 본 결과가 아니라 공식 문서에 적힌 동작과 오류 문구를 옮긴 것입니다.exactOptionalPr.. 2026. 10. 23.
Git stash untracked 파일 보관과 복구|-u 옵션 단계별 사용법 항목내용해결할 질문새로 만든 파일이 stash에서 빠진다핵심 답git stash push -u 로 보관필요한 환경Git 설치, 작업 중인 저장소바로가기git-stash 공식 문서 git stash 를 했는데 새로 만든 파일이 작업 폴더에 그대로 남아 있다면 정상 동작이다.기본 stash 는 추적 중인 파일의 변경만 담는다.새 파일까지 치우려면 git stash push -u 를 쓴다.이 글은 untracked 파일을 보관하고, 내용을 열어 보고, 되돌리는 과정을 순서대로 정리한다.명령의 동작은 Git 공식 문서(git-stash) 기준이며, 글에 나온 출력 예시는 설명용이다.git stash에서 untracked 파일이 빠지는 이유는?Git 은 git add 를 한 적 없고 커밋 이력에도 없는 파일을 u.. 2026. 10. 23.