
React 라이브러리 조합 가이드: Zustand·TanStack Query·shadcn/ui 선택 기준
React 라이브러리 조합 선택 핵심 요약 이 글은 React, Vue, Svelte 중 무엇을 고르는 비교 글이 아닙니다. React를 이미 선택한 프로젝트에서 Zustand, TanStack Query, shadcn/ui, Radix UI, React Hook Fo…
더 읽기컴포넌트 기반으로 UI를 구성하는 JavaScript 라이브러리 React 전반을 다룹니다.

React 라이브러리 조합 선택 핵심 요약 이 글은 React, Vue, Svelte 중 무엇을 고르는 비교 글이 아닙니다. React를 이미 선택한 프로젝트에서 Zustand, TanStack Query, shadcn/ui, Radix UI, React Hook Fo…
더 읽기
주요 포인트 한눈에 보기 React의 렌더링 성능은 사용자 경험(UX)과 검색 엔진 최적화(SEO)에 결정적인 영향을 미칩니다. Next.js는 서버 사이드 렌더링(), 정적 사이트 생성() 등 강력한 기능을 통해 React의 성능을 극대화하는 프레임워크입니다. 이 글…
더 읽기
주요 포인트 한눈에 보기 Axios는 단순히 HTTP 요청을 보내는 도구가 아니라, 프론트엔드 개발자가 복잡한 비동기 통신을 체계적으로 관리할 수 있게 돕는 강력한 라이브러리입니다. 자동 JSON 변환, 요청/응답 인터셉터, 공통 설정 관리에러 처리, 요청 취소 기능…
더 읽기
React Vue Svelte 선택 비교 핵심 요약 이 글은 2025년에 React, Vue, Svelte 중 어떤 프론트엔드 기술을 고를지 비교하는 대표 글입니다. 생태계 규모, 채용 시장, 학습 난이도, 메타 프레임워크 흐름을 기준으로 “프로젝트의 큰 축”을 선택하…
더 읽기
이 글에서 정리하는 내용 React Compiler 1.0을 적용한 뒤 와 을 어디까지 줄일 수 있는지, 새 코드와 기존 코드에서 판단 기준이 어떻게 달라지는지 실무 흐름에 맞춰 정리합니다. React Compiler 1.0이 바꾸는 기준 useMemo는 어디까지…
더 읽기
이 글에서 정리하는 내용 React에서 Tailwind CSS를 사용할 때 조건부 이 길어지는 이유와 정리 기준을 다룹니다. 짧은 조건은 JSX 안에서 처리하고, 반복되는 조합은 객체로 분리하며, 버튼 컴포넌트가 커졌을 때는 props 구조, 유틸 함수, variant…
더 읽기
이 글에서 정리하는 내용 React에서 Tailwind CSS를 사용할 때 처럼 조립한 클래스명이 왜 적용되지 않는지 정리합니다. Tailwind CSS v4 기준으로 Tailwind는 JavaScript 실행 결과가 아니라 소스 파일 안의 완성된 클래스 문자열을 기준…
더 읽기
이 글에서 정리하는 내용 React에서 Tailwind CSS를 사용할 때 className이 길어지는 문제를 JSX 가독성 관점에서 정리합니다. 긴 클래스 자체를 없애는 것보다, 반복되는 조합을 어디까지 상수로 빼고 언제 컴포넌트로 분리할지 판단하는 기준에 초점을 맞…
더 읽기
두 번 실행, 먼저 버그로 단정하지 않기 React 개발 환경에서 useEffect가 두 번 실행되면 API 요청도 두 번 나가고 콘솔 로그도 두 번 찍혀서 당황스럽습니다. 다만 이 현상은 React가 고장났다는 뜻이 아닐 때가 많습니다. 특히 StrictMode가 켜…
더 읽기
state가 많아졌다고 바로 Zustand를 쓰거나, 여러 컴포넌트가 공유하는 값을 계속 props로 넘기면서 구조가 복잡해지는 경우가 생깁니다. state가 많다는 이유만으로 전역 상태가 필요한 것은 아닙니다 React 컴포넌트 안에 가 몇 개 늘어나면 상태관리…
더 읽기