React Vue Svelte 비교: 2025 프론트엔드 프레임워크 선택 기준
React Vue Svelte 선택 비교 핵심 요약 이 글은 2025년에 React, Vue, Svelte 중 어떤 프론트엔드 기술을 고를지 비교하는 대표 글입니다. 생태계 규모, 채용 시장, 학습 난이도, 메타 프레임워크 흐름을 기준으로 “프로젝트의 큰 축”을 선택하…
더 읽기프론트엔드
프론트엔드 카테고리에서는 사용자 화면을 구현하는 데 필요한 핵심 기술과 실무 지식을 정리합니다. HTML, CSS, JavaScript를 비롯해 React, Next.js, UI 컴포넌트 설계, 상태 관리, API 연동, 성능 최적화, 반응형 웹까지 프론트엔드 개발 전반을 다룹니다.
React Compiler 기준: useMemo useCallback 언제 줄일까
이 글에서 정리하는 내용 React Compiler 1.0을 적용한 뒤 와 을 어디까지 줄일 수 있는지, 새 코드와 기존 코드에서 판단 기준이 어떻게 달라지는지 실무 흐름에 맞춰 정리합니다. React Compiler 1.0이 바꾸는 기준 useMemo는 어디까지…
더 읽기
React Tailwind 조건부 클래스 정리: className이 길어질 때 나누는 기준
이 글에서 정리하는 내용 React에서 Tailwind CSS를 사용할 때 조건부 이 길어지는 이유와 정리 기준을 다룹니다. 짧은 조건은 JSX 안에서 처리하고, 반복되는 조합은 객체로 분리하며, 버튼 컴포넌트가 커졌을 때는 props 구조, 유틸 함수, variant…
더 읽기
React Tailwind 동적 클래스 해결: 조건부 스타일이 적용되지 않는 이유
이 글에서 정리하는 내용 React에서 Tailwind CSS를 사용할 때 처럼 조립한 클래스명이 왜 적용되지 않는지 정리합니다. Tailwind CSS v4 기준으로 Tailwind는 JavaScript 실행 결과가 아니라 소스 파일 안의 완성된 클래스 문자열을 기준…
더 읽기
React Tailwind className 정리 기준: 클래스가 길어질 때 가독성 높이기
이 글에서 정리하는 내용 React에서 Tailwind CSS를 사용할 때 className이 길어지는 문제를 JSX 가독성 관점에서 정리합니다. 긴 클래스 자체를 없애는 것보다, 반복되는 조합을 어디까지 상수로 빼고 언제 컴포넌트로 분리할지 판단하는 기준에 초점을 맞…
더 읽기
React useEffect 두 번 실행 문제 해결: Strict Mode에서 중복 호출 확인하기
두 번 실행, 먼저 버그로 단정하지 않기 React 개발 환경에서 useEffect가 두 번 실행되면 API 요청도 두 번 나가고 콘솔 로그도 두 번 찍혀서 당황스럽습니다. 다만 이 현상은 React가 고장났다는 뜻이 아닐 때가 많습니다. 특히 StrictMode가 켜…
더 읽기
React state vs Zustand: 언제 전역 상태가 필요할까
state가 많아졌다고 바로 Zustand를 쓰거나, 여러 컴포넌트가 공유하는 값을 계속 props로 넘기면서 구조가 복잡해지는 경우가 생깁니다. state가 많다는 이유만으로 전역 상태가 필요한 것은 아닙니다 React 컴포넌트 안에 가 몇 개 늘어나면 상태관리…
더 읽기
React useState 사용법: state와 객체 배열 업데이트 기준
이 글에서 정리하는 내용 React에서 state가 왜 필요한지부터 일반 변수와의 차이, 기본 문법, 객체와 배열 업데이트 방식이전 값 기반 업데이트가 필요한 이유까지 한 흐름으로 정리합니다. 화면이 바뀌어야 하는 값은 왜 state로 관리해야 하는지 기준을 잡는 데 …
더 읽기
React props 사용법: 부모에서 자식으로 데이터 전달하는 구조
이 글에서 정리하는 내용 props가 왜 필요한지부터 부모에서 자식으로 데이터를 전달하는 방식, 문자열·숫자·배열·객체·함수 props 전달, children, props drilling까지 한 흐름으로 정리합니다. 읽고 나면 React 컴포넌트를 어떻게 연결해야 하는…
더 읽기
React JSX 문법 사용법: 조건부 렌더링과 리스트 처리
이 글에서 정리하는 내용 JSX를 HTML처럼 외우는 대신 JavaScript 안에서 UI를 표현하는 문법으로 이해합니다. 기본 문법, 중괄호 표현식, 조건부 렌더링, 리스트 렌더링과 style 같은 속성 바인딩, Fragment까지 한 흐름으로 정리합니다. JSX…
더 읽기