Next.js App Router 학습 순서: 라우팅, 렌더링, SEO, 배포까지
라우팅, metadata, redirects, 성능 글은 각각 있지만 전체 순서가 보이지 않으면 필요한 글을 찾기 어렵습니다. App Router는 폴더부터 외우면 오래 걸립니다 Next.js 를 처음 보면 app 폴더, layout, page, route han…
더 읽기개발
프로그래밍 카테고리에서는 HTML, CSS, JavaScript, React, Next.js를 비롯한 다양한 개발 지식과 실무 구현 방법을 정리합니다. 기초 문법부터 UI 구현, API 연동, 상태 관리, 성능 최적화, 트러블슈팅까지 실제 작업에 바로 적용할 수 있는 내용을 쉽고 체계적으로 다룹니다.
React Vue Svelte 비교: 2025 프론트엔드 프레임워크 선택 기준
React Vue Svelte 선택 비교 핵심 요약 이 글은 2025년에 React, Vue, Svelte 중 어떤 프론트엔드 기술을 고를지 비교하는 대표 글입니다. 생태계 규모, 채용 시장, 학습 난이도, 메타 프레임워크 흐름을 기준으로 “프로젝트의 큰 축”을 선택하…
더 읽기
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 컴포넌트를 어떻게 연결해야 하는…
더 읽기