🔍 오류 상황테스트 코드를 학습하기 위해 fork 받았습니다. npm ci 를 통해 모듈을 설치 후 vite.config.js 파일 확인했습니다.아래와 같은 에러 코드를 확인 할 수 있었습니다.🚩 문제의 원인Expected linebreaks to be 'LF' but found 'CRLF'. [prettier/prettier]Delete 'CR' [prettier/prettier] 이 오류의 핵심은 줄바꿈 (Line Ending) 형식의 차이에 있습니다. 운영체제마다 줄바꿈 방식이 다르기 때문에 발생합니다.이러한 줄바꿈 방식의 불일치 때문에 협업 도중 혹은 코드 포맷터가 작동할 때 CR (Carriage Return)을 삭제하라는 오류가 발생합니다.CR (Carriage Return) 이란?커서를 ..

🚩 문제의 원인 {{ item.name }}Vue에서 같은 엘리먼트에 v-if 와  v-for 를 함께 사용하기 때문에 생기는 오류입니다.이 방식은 Vue에서 권장하지 않습니다. 왜냐하면 v-for 로 반복 후, 그 내부에서 v-if로 조건을 체크하면 성능이 저하되고 예상치 못한 버그를 유발할 수 있기 때문입니다.  ✅ 해결 방법방법 1. computed 사용 (권장) {{ item.name }} computed 를 활용하여 필터링합니다. 방법 2. 로 감싸기 {{ item.name }} 반드시 함께 써야 한다면 아래와 같은 방법으로 가능합니다. 태그는 반드시 최상위에 사용해야 합니다. 방법 3. Eslint 설정에서 예외 처리하기// .eslintrc.jsmodule.expo..

📆 2025년 1분기 회고록 (KPT)✅ Keep (계속할 것)한 달 기준으로 한가지 학습에 집중하기여러 기술에 욕심내기보다, 한 가지 주제에 집중하는 방식으로 학습을 바꿨다.3월에는 React를 집중적으로 학습했고,4월부터는 JavaScript와 TypeScript를 심화 학습할 예정이다. 월간 목표 설정 & 회고 루틴월 초에 목표를 세우고, 주 단위로 쪼개서 진행했다.다 하고 싶은 마음에 리스트를 많이 적었지만,실행력은 결국 우선순위에서 결정된다는 걸 느꼈다.월간 회고는 유지했지만 주간 회고는 자주 잊어 버린다,4월부터는 다시 주간 단위 회고 루틴도 챙겨보자. 매주 기술 블로그 정리하기 3월에는 1월보다 더 많은 글을 업로드했다.공부한 걸 블로그에 정리하면서 기억에도 오래 남고,검색했던 키워드와 학..

싱글 스레드 언어라는 것은 하나의 작업만 수행할 수 있다는 것인데 그렇다면 비동기 작업을 어떻게 할 수 있다는 것인가? 의문을 시작으로 작성한 글 입니다. ✅ 결론자바스크립트는 싱글 스레드(Single-threaded) 언어지만, 비동기 작업이 가능한 건 이벤트 루프(Event Loop)와 Web APIs (또는 Node APIs) 덕분입니다. 🌱 기본 전제: 자바스크립트는 싱글 스레드자바스크립트는 한 번에 한 작업만 처리할 수 있음즉, 콜 스택(Call Stack)에 하나씩 쌓고 처리하는 구조그런데 이런 구조면, 네트워크 요청이나 타이머 같은 작업을 하면 브라우저가 멈춰야 하지 않을까?🤔 그럼 어떻게 비동기가 가능할까?👉 핵심 키워드: 이벤트 루프(Event Loop) + Web APIs 자바스크..

📌 목차Promise란?Promise 언제 사용할까?Promise 가 왜 필요할까?Promise 의 3가지 상태Promise 이행되었을 때 실행 결과마무리 ✅ Promise 란?자바스크립트 비동기 처리에 사용되는 객체 ➡️  비동기란 무엇이며 자바스크립트에서 왜 비동기가 필요할까?자바스크립트는 싱글 스레드(프로그램이 샐힝되는 최소 단위로 일을 처리하는 작업자가 한 명이라고 이해하기) 언어 한 번에 하나의 작업만 처리할 수 있는 구조 이런 구조에서 시간이 오래 걸리는 작업이 들어오면? 다른 작업들은 기다리게 되고, 서버 응답까지 기다리게 된다면 전체 프로그램이 멈추는 현상이 생길 수 있습니다.➡️ 자바스크립트는 싱글 스레드인데도 UI가 멈추지 않는 이유는?백그라운드에서 비동기 작업을 따로 처리하고 결과가..

📝개요분명 들어봤던 단어! 너는 왜 항상 내 기억에서 사라지는거니..  기술 면접의 시작으로 절대 잊을 수 없는 단어가 되어버린  "클로저", 다시 이해해보기클로저는 초반에는 쉽지 않아도, 한 번 정확하게 이해하면 각종 상황에서 상태 저장, 정보 은닉, 비동기 처리 등에 유용하게 쓰이면 강력한 무기입니다.📚 목차1. 클로저란?2. 클로저가 왜 필요할까?3. 클로저 언제 사용하나요?4. 실전 예제5. 클로저와 관련된 주의점6. 정보 정리 & 마무리7. (부모) 클로저 한눈에 보기 : Venn Diagram  ✅ 1. 클로저란?  closure 폐쇄클로저는 함수와 그 함수가 선언되었을 때의 렉시컬 환경과의 조합이다.   더보기렉시컬 환경이란? 실행 중인 코드가 사용하는 변수, 상수, 함수 정보를 저장한는..