SEARCH : 전체 글(47)

CATEGORY : 전체 글(47)

TAGS : 전체 글(47)

ARCHIVE : 전체 글(47)

Claude Code로 코딩하다 파일 꼬였을 때 직전 상태로 되돌리는 법 (git restore와 세션 리셋)

2026. 11. 3.

터미널에서 Claude Code 켜두고 바이브코딩하다 보면 누구나 한 번쯤 겪는 상황이 있습니다."이 함수 버그 좀 잡아줘"라고 가볍게 시켰는데, AI가 신나서 함수 하나 고치겠다고 주변 파일 서너 개를 연쇄 수정하고, 패키지 버전까지 건드려서 멀쩡하던 빌드가 와장창 깨지는 순간입니다.당황해서 터미널에 "방금 수정한 거 다 취소하고 원래대로 돌려놔"라고 치면, Claude가 "죄송합니다, 원래대로 복구하겠습니다"라며 사과를 늘어놓더니 코드를 더 이상하게 덮어써서 돌이킬 수 없는 강을 건너곤 합니다.AI에게 말로 복구를 부탁하지 마세요. 파일이 꼬였을 때 가장 빠르고 깔끔하게 직전 상태로 원복하는 현실적인 대처법 3가지를 정리했습니다. 1. 꼬인 파일만 핀포인트로 되돌리기 (git restore)가장 흔한..
빈칸이 0이 되는 순간: JavaScript Number 변환 전 구분할 것

빈칸이 0이 되는 순간: JavaScript Number 변환 전 구분할 것

2026. 11. 2.

Number("")와 Number(" ")는 둘 다 0이 됩니다. 입력하지 않은 문자열과 정상 값 "0"을 구분해야 한다면, 숫자로 바꾸기 전에 공백을 걷어낸 문자열이 비어 있는지 먼저 확인하세요.AI가 만든 JavaScript 코드에서 ‘수량을 입력하지 않았는데 0으로 처리된다’면, 기본값을 고르기 전의 변환 과정을 보세요. Number가 반환한 0만으로는 원래 입력이 빈 문자열이었는지 "0"이었는지 알 수 없습니다.서로 다른 세 문자열이 모두 0이 됩니다다음은 실제 폼이 아니라 짧은 합성 문자열 세 개입니다.console.log(Number("")); // 0console.log(Number(" ")); // 0console.log(Number("0")); // 0첫 줄은 길이가 0인 빈..
JSON.stringify() 필드 누락 오류 해결법 (undefined와 null 차이)

JSON.stringify() 필드 누락 오류 해결법 (undefined와 null 차이)

2026. 11. 2.

JSON.stringify()는 객체 속성의 값이 undefined이면 그 속성을 결과 JSON에서 뺍니다. null은 그대로 남습니다. 데이터를 JSON으로 바꾼 뒤 필드가 빠졌다면, 변환 전 값과 변환 후 키의 존재를 따로 확인하세요.AI가 만든 JavaScript 코드에서도 원본 객체에 보이던 필드가 JSON 문자열에서는 없어질 수 있습니다. 값이 undefined로 읽힌다는 사실만으로 두 객체의 구조가 같다고 볼 수는 없습니다.값은 둘 다 undefined인데, 키는 한쪽에만 있습니다실제 서비스 데이터가 아닌 작은 합성 객체를 JSON으로 바꾼 뒤 다시 읽었습니다.const before = { name: "sample", note: undefined };const text = JSON.string..
API temperature=0 설정해도 응답이 다른 이유 (LLM 재현성 해결법)

API temperature=0 설정해도 응답이 다른 이유 (LLM 재현성 해결법)

2026. 11. 1.

temperature를 지원하는 API라도, 0으로 설정했다는 사실만으로 답변이 글자까지 항상 같다고 보장할 수는 없습니다. 다음 표현을 고를 때의 무작위성을 낮추는 것과, 서비스 전체가 매번 같은 결과를 내는 것은 다른 문제입니다.모델 설명에서 ‘재현 가능하다’는 말을 읽을 때는 먼저 문장이 같은지, 답이 같은지, 그 답이 맞는지를 나눠 보세요. 이 글은 API 설정법이 아니라 공식 문서와 공개 연구에서 말하는 보장 범위를 읽는 기준입니다.표현은 달라도 답은 같을 수 있습니다아래는 실제 모델 출력이 아닌 설명용 가상 응답입니다. 질문은 ‘2+2는?’입니다.응답 A: “4입니다.”응답 B: “계산 결과는 4입니다.”두 문장은 글자 단위로는 다릅니다. 하지만 숫자 답만 읽으면 둘 다 4입니다. 문장 전체가..
JavaScript forEach에 await 안 먹히는 이유와 비동기 해결법 (for...of)

JavaScript forEach에 await 안 먹히는 이유와 비동기 해결법 (for...of)

2026. 11. 1.

forEach는 async 콜백이 돌려준 Promise를 모아 기다리지 않습니다. forEach 앞에 await를 붙여도 각 작업의 완료를 기다리는 연결은 생기지 않습니다. 앞 항목이 끝난 뒤 다음 항목을 시작해야 한다면, for...of 안에서 작업의 Promise를 await하는 형태로 바꿀 수 있습니다.AI가 만든 JavaScript 코드에서 ‘전체 완료’가 너무 일찍 찍힌다면, await가 어디에 붙었는지보다 어떤 값을 기다리는지부터 보세요.전체 완료가 찍힌 순간, A·B는 아직 대기 중이었습니다A·B의 작업을 같은 Promise에서 멈춰 두고 실행 순서를 기록했습니다. forEach 앞에 await를 쓴 경우, 대기를 풀기 전 첫 출력은 ["전체 완료?"]였습니다. A·B가 끝나지 않았는데도 바..
JavaScript sort() 숫자 정렬 오류 해결법 (10이 2보다 앞에 올 때)

JavaScript sort() 숫자 정렬 오류 해결법 (10이 2보다 앞에 올 때)

2026. 10. 31.

JavaScript에서 숫자 배열에 sort()만 호출하면 숫자 크기가 아니라 문자열 기준으로 순서를 정합니다. 유한한 Number 값만 있는 배열을 숫자 오름차순으로 정렬하려면 sort((a, b) => a - b)를 씁니다. 원본을 남겨야 한다면 복사한 배열에 적용하세요.같은 입력을 두 기준으로 정렬하면AI가 만든 정렬 코드의 결과가 낯설다면, 비교 함수를 빼고 넣은 결과부터 나란히 보세요. 아래는 실제 주문이나 고객 자료가 아닌 짧은 합성 배열입니다.const numbers = [10, 2, 1, 20];const byDefault = [...numbers].sort();const ascending = [...numbers].sort((a, b) => a - b);console.log(JSON.st..
HTML button 클릭 시 form 자동 제출 방지 (type="button" 기본값 차이)

HTML button 클릭 시 form 자동 제출 방지 (type="button" 기본값 차이)

2026. 10. 26.

일반 폼 안에서 미리보기처럼 제출이 목적이 아닌 버튼은 type="button"으로 구분하세요. 폼 제출을 계기로 입력값을 처리하고 기본 페이지 이동은 막으려면, type="submit"을 두고 폼의 submit 이벤트에서 event.preventDefault()를 호출합니다.AI가 만든 폼도 버튼 역할부터 나눠 보세요. 미리보기를 고치려고 제출용 버튼까지 모두 type="button"으로 바꿀 필요는 없습니다.먼저 버튼의 목적을 나눠 보세요미리보기·패널 열기 같은 화면 조작: type="button". 클릭 처리는 연결하되 버튼 자체의 폼 제출 동작은 쓰지 않습니다.폼 입력을 받아 처리하기: type="submit". 기본 이동을 원하지 않는다면 폼의 submit 이벤트를 처리합니다.click만 연결했..
Flex 카드 말줄임이 안 되면, 제목을 감싼 요소부터 보세요

Flex 카드 말줄임이 안 되면, 제목을 감싼 요소부터 보세요

2026. 10. 26.

가로 Flex 카드에서 제목에 말줄임 속성을 넣었는데도 옆으로 넘친다면, 제목을 감싼 flex 아이템의 최소 너비를 보세요. 아래 구조에서는 .body에 min-width: 0을 넣으면 제목이 차지할 너비가 줄어듭니다.AI와 함께 카드 목록을 만들다가 이런 화면을 만났다면, 이 구조에서는 글자 크기보다 요소의 너비를 먼저 확인할 수 있습니다. 먼저 제목 요소와 그 바깥 flex 아이템을 구분해 보세요.고칠 곳은 제목이 아니라, 제목을 감싼 flex 아이템입니다.body { flex: 1; min-width: 0; }이 예제에서 .card는 가로 flex 컨테이너이고, 그 직계 자식 .body가 제목을 담습니다. 위 코드는 뒤에 나오는 .body { flex: 1; } 규칙을 교체하는 한 줄입니다. 아무 ..
replaceAll을 썼는데 그대로라면, 반환값부터 보세요

replaceAll을 썼는데 그대로라면, 반환값부터 보세요

2026. 10. 25.

JavaScript의 replaceAll()은 바뀐 문자열을 반환하며 원본 문자열은 그대로 둡니다. 호출만 하고 반환값을 저장하지 않았다면, 다음 줄에서 원래 변수를 읽었을 때 바뀌지 않은 값이 나옵니다.AI가 만든 치환 코드 뒤에서 원문이 그대로 나온다면, 먼저 결과를 어디에 담았는지 보세요. “전혀 안 바뀜”과 “첫 번째만 바뀜”은 확인할 지점이 다릅니다.호출한 결과를 버린 경우부터 구분합니다실제 서비스가 아닌 짧은 합성 문자열로 확인할 수 있습니다. 첫 호출은 반환값을 받지 않았고, 두 번째 호출은 result에 받았습니다.const text = "draft draft";text.replaceAll("draft", "done");console.log(text); // "draft draft"cons..
객체를 복사했는데 원본도 바뀌나요? JavaScript 전개 구문의 경계

객체를 복사했는데 원본도 바뀌나요? JavaScript 전개 구문의 경계

2026. 10. 25.

객체 전개 구문 { ...original }은 바깥 객체를 새로 만들지만, 안에 든 객체까지 새로 만들지는 않습니다. 복사본 안의 객체를 수정했다면 원본에서도 같은 변경이 보일 수 있습니다.AI와 함께 웹앱을 만들다가 복사 전 데이터까지 바뀌었다면, 복사한 줄보다 실제로 값을 바꾼 경로를 보세요. copy.status를 바꾸는 일과 copy.shipping.city를 바꾸는 일은 다릅니다.바깥 객체와 배송지 객체를 따로 비교해 보세요다음은 실제 주문이 아닌 합성 데이터입니다. 바깥 객체와 배송지 객체가 각각 같은지 먼저 비교한 뒤, 두 위치의 값을 바꿉니다.const original = { status: "draft", shipping: { city: "Seoul" }};const copy = { ...