자바스크립트 this와 클래스 동작을 이해하는 법
Photo by TeeFarm via Pixabay 자바스크립트의 this는 함수가 정의된 위치보다 어떻게 호출됐는지에 따라 결정되는 경우가 많습니다. 객체 메서드를 변수에 담아 전달했더니 this가 사라지거나, 콜백을 화살표 함수로 바꾸자 동작이 달라지는 이유도 …
Vue 3 폼 검증을 재사용 가능하게 설계하는 법
Photo by Alltechbuzz_net via Pixabay 회원가입이나 주문 화면의 폼은 값을 입력받는 것보다 검증과 오류 표시, 서버 전송, 중복 제출 방지가 더 어렵습니다. 필드마다 watch와 오류 문구를 복사하면 규칙 변경 시 …
오라클과 MS SQL 계층형 쿼리 작성 가이드
Photo by JohnsonMartin via Pixabay 조직도, 카테고리, 댓글 답글, 부품 구성표처럼 하나의 테이블에서 부모와 자식 관계를 표현하는 데이터가 많습니다. 단순 조인만 반복하면 깊이가 바뀔 때마다 SQL을 수정해야 하고 순환 데이터가 …
파이썬 컨텍스트 관리자로 자원을 안전하게 다루기
Photo by This_is_Engineering via Pixabay 파일, 데이터베이스 연결, 네트워크 세션, 잠금 객체는 사용이 끝나면 반드시 정리해야 합니다. 정상 실행만 생각해 close를 마지막 줄에 호출하면 중간 예외나 조기 return 때문에 정리 …
자바스크립트 오류 처리와 안전한 복구 전략
Photo by Pexels via Pixabay 서비스에서 오류는 피해야 할 예외적인 사건만이 아닙니다. 사용자가 잘못된 값을 입력하거나 네트워크가 끊기고 외부 API가 제한 시간을 넘는 상황은 일상적으로 발생합니다. 모든 오류를 하나의 catch에서 …
Vue Router 권한과 화면 이동을 설계하는 법
Photo by markusspiske via Pixabay Vue 애플리케이션에서 Vue Router는 URL과 화면을 연결하는 기능을 넘어 로그인 확인, 권한 제어, 데이터 준비, 뒤로 가기 경험을 결정합니다. 라우터 가드에 모든 업무 로직을 몰아넣으면 …
오라클과 MS SQL 인덱스 설계 핵심 원칙
Photo by tookapic via Pixabay 쿼리가 느려지면 가장 먼저 인덱스를 추가하려는 경우가 많습니다. 인덱스는 원하는 행을 빠르게 찾도록 돕지만 저장 공간을 사용하고 INSERT, UPDATE, DELETE마다 함께 관리돼야 합니다. 잘못 만든 …
자바스크립트 모듈 설계와 순환 의존성 해결법
Photo by Elchinator via Pixabay 자바스크립트 프로젝트가 커지면 하나의 파일에 모든 기능을 담을 수 없어 코드를 모듈로 나눕니다. ES 모듈의 import와 export는 파일 사이의 공개 계약을 표현하고 번들러가 사용하지 않는 …
Vue 3 렌더링 성능을 개선하는 실무 점검법
Photo by MianShahzadRaza via Pixabay Vue 애플리케이션이 느려졌을 때 반응형 프레임워크 자체를 원인으로 지목하기 쉽습니다. 실제로는 너무 많은 컴포넌트 생성, 불안정한 목록 키, 큰 객체에 대한 깊은 감시, 중복 API …
DB 트랜잭션 격리와 교착 상태 대응 실무
Photo by yatsusimnetcojp via Pixabay 주문 수량을 차감하거나 계좌 잔액을 변경하는 작업은 여러 SQL이 모두 성공하거나 모두 취소돼야 합니다. 트랜잭션은 이 원자성을 제공하지만, 트랜잭션을 사용했다는 사실만으로 동시성 문제가 모두 해결되지는 …