본문 바로가기

전체 글

React Zustand 사용법: 전역 상태관리 시작하기 한 줄 요약: React Zustand는 Provider 없이 create 함수 하나로 전역 상태 스토어를 만들고, 컴포넌트에서는 selector로 필요한 값만 구독해 불필요한 리렌더링을 줄여 주는 가벼운 상태관리 라이브러리입니다. 설치 후 스토어 파일 하나와 훅 호출만으로 시작할 수 있어 Context API보다 보일러플레이트가 적습니다.Zustand란 무엇인가요?Zustand는 React용 소형 전역 상태관리 라이브러리입니다. 상태와 상태를 바꾸는 함수를 하나의 스토어에 모아 두고, create가 반환하는 훅으로 어디서든 꺼내 쓰는 방식입니다. React 18 이상에서 동작하는 v5 기준으로 설명합니다.React 상태관리를 처음 고민할 때는 props drilling 문제가 가장 먼저 나옵니다. Co.. 더보기
C# Lock 클래스 사용법: .NET 9 새 lock 객체 정리 한 줄 요약: C# Lock 클래스(System.Threading.Lock)는 .NET 9에서 추가된 전용 잠금 객체로, 기존 lock (object)와 같은 상호 배제를 더 명확하고 가볍게 제공합니다. 필드를 private readonly Lock _lock = new();로 선언하고, C# 13에서는 lock (_lock) 문법을 그대로 쓰면 컴파일러가 Lock.EnterScope() 호출로 바꿔 줍니다.이 글에서는 .NET 9 Lock 클래스의 정의, 기존 lock 문과의 차이, EnterScope와 TryEnter 사용법, 그리고 await와 함께 쓸 때 주의할 점을 예제로 정리합니다.C# Lock 클래스란 무엇인가요?Lock 클래스는 System.Threading 네임스페이스에 있는 .NET 9.. 더보기
React useEffectEvent 사용법: Effect 재실행 줄이기 한 줄 요약: React useEffectEvent는 Effect 안에서 호출되지만 의존성에는 넣지 않아도 되는 함수를 만드는 Hook입니다. Effect를 다시 실행하지 않고도 props와 state의 최신 값을 읽을 수 있으며, React 19.2부터 stable로 사용할 수 있습니다. 단, 의존성을 숨기는 용도로 쓰면 버그가 생기므로 "Effect 안에서 발생하는 이벤트" 로직에만 사용해야 합니다.React useEffectEvent란 무엇인가요?useEffectEvent는 Effect에서 분리된 이벤트 로직을 담는 React Hook으로, Effect 안에서 호출할 수 있는 Effect Event 함수를 반환합니다. Effect Event는 호출되는 시점에 렌더링된 최신 props와 state를 .. 더보기
C# SearchValues 사용법: IndexOfAny 빠르게 검색하기 한 줄 요약: C# SearchValues는 .NET 8에서 추가된 "미리 최적화해 둔 값 집합"으로, IndexOfAny·ContainsAny 같은 다중 문자 검색을 반복 호출할 때 사용합니다. 집합을 static readonly 필드로 한 번만 만들어 두고 재사용하면, 문자를 하나씩 비교하는 루프나 매번 새 배열을 넘기는 방식보다 단순하면서도 빠른 검색 코드를 만들 수 있습니다.SearchValues란 무엇인가요?SearchValues는 불변(immutable)이고 읽기 전용인 값 집합을 검색에 최적화된 형태로 미리 가공해 둔 .NET 8의 타입입니다. 공식 문서도 "한 번 만들고 여러 번 사용"하는 용도를 전제로 설명하며, System.Buffers 네임스페이스에 있습니다. 문자(char)와 바이트.. 더보기
React Testing Library 사용법: 컴포넌트 테스트 기초 한 줄 요약: React Testing Library(RTL)는 컴포넌트를 사용자가 보는 방식 그대로 렌더링하고 검증하는 테스트 라이브러리입니다. render로 그리고, getByRole 같은 쿼리로 요소를 찾고, userEvent로 클릭과 입력을 흉내 낸 뒤, 화면에 보이는 결과를 expect로 확인하면 됩니다. 이 글에서는 Vitest 기준으로 설치부터 쿼리 선택, 비동기 테스트까지 한 번에 정리합니다.React Testing Library란 무엇인가요?React Testing Library는 컴포넌트의 내부 state나 메서드가 아니라 사용자에게 보이는 DOM을 기준으로 테스트하도록 설계된 라이브러리입니다. 공식 문서도 "테스트가 소프트웨어 사용 방식과 비슷할수록 더 큰 신뢰를 준다"는 원칙을 강조.. 더보기
C# FrozenDictionary 사용법: 읽기 전용 조회 최적화 한 줄 요약: C# FrozenDictionary는 .NET 8에서 추가된 읽기 전용 컬렉션으로, 만들 때 시간을 더 쓰는 대신 조회(읽기) 속도를 높여 줍니다. 앱 시작 시 한 번 채우고 이후에는 읽기만 하는 설정값, 코드 테이블, 허용 목록에 쓰면 효과가 큽니다. 값을 자주 바꾸는 용도라면 Dictionary나 ConcurrentDictionary를 쓰세요.FrozenDictionary란 무엇인가요?FrozenDictionary는 생성 이후 키와 값을 바꿀 수 없는 불변 딕셔너리입니다. System.Collections.Frozen 네임스페이스에 있고 .NET 8부터 사용할 수 있습니다. 생성 시점에 키의 분포를 분석해 조회에 유리한 내부 구조를 고르기 때문에, 읽기 중심 시나리오에서 일반 Dicti.. 더보기
React Compiler 사용법: useMemo 없이 자동 최적화하기 한 줄 요약: React Compiler는 빌드 시점에 컴포넌트를 분석해 useMemo, useCallback, React.memo와 같은 메모이제이션을 자동으로 넣어 주는 도구입니다. babel-plugin-react-compiler를 설치하고 빌드 도구에 한 줄만 추가하면 적용할 수 있으며, React 규칙을 지키는 코드라면 기존 코드를 고치지 않아도 됩니다.React Compiler란 무엇인가요?React Compiler는 React 앱을 빌드 시점에 자동으로 최적화하는 도구입니다. 공식 문서 기준으로 일반 JavaScript에서 동작하며 React의 규칙(Rules of React)을 이해하고 있어서, 코드를 다시 작성하지 않아도 리렌더링에 필요한 값만 다시 계산하도록 변환해 줍니다. 수동 메모이.. 더보기
C# ConcurrentDictionary 사용법: GetOrAdd 중복 실행 주의 한 줄 요약: C# ConcurrentDictionary는 여러 스레드가 동시에 읽고 써도 안전한 딕셔너리입니다. 다만 GetOrAdd와 AddOrUpdate에 넘기는 델리게이트는 경합 상황에서 여러 번 실행될 수 있으므로, 비용이 큰 초기화는 Lazy로 감싸 한 번만 실행되게 만드는 것이 안전합니다.ConcurrentDictionary란 무엇인가요?ConcurrentDictionary는 System.Collections.Concurrent 네임스페이스에 있는 스레드 안전(thread-safe) 키-값 컬렉션입니다. 일반 Dictionary는 여러 스레드에서 동시에 쓰면 내부 상태가 깨질 수 있지만, ConcurrentDictionary는 내부적으로 세분화된 잠금(fine-grained locking)을.. 더보기

티스토리툴바