프론트엔드

HTML·CSS부터 JavaScript, React와 상태관리까지, 화면을 만들고 데이터를 다루는 기술을 배웁니다.

총 177개의 글

React React · 중급 설명 8분 2026.09.19

검색 input처럼 즉시 반응해야 하는 UI와, 수천 개 항목을 다시 계산하는 목록처럼 조금 늦게 처리해도 되는 UI는 우선순위가 다릅니다.

React React · 중급 설명 6분 2026.09.19

TaskFlow 기능이 늘어나면 사용자가 첫 화면에서 당장 필요하지 않은 코드까지 모두 초기 번들에 포함될 수 있습니다. React.lazy는 컴포넌트 코드를 실제로 필요할 때 불러오고, Suspense는 로딩 중 보여 줄 f…

React React · 중급 설명 7분 2026.09.19

React Hook Form은 폼 값을 등록하고 제출·검증 상태를 관리하는 데 사용하는 폼 라이브러리입니다. 이번 글은 React Hook Form이 React 과정에서 처음 등장하는 글이므로 설치부터 최소 동작 확인까지 모두…

React React · 중급 설명 8분 2026.09.19

useEffect를 “컴포넌트가 mount될 때 한 번 실행하는 함수”라고만 이해하면 dependency를 다루기 어려워집니다. Effect는 외부 시스템과 현재 React 상태를 동기화하는 과정입니다.

React React · 중급 설명 6분 2026.09.19

useEffect는 React에서 가장 많이 오해되는 Hook 중 하나입니다. “렌더링이 끝난 뒤 실행할 코드”라고만 외우면 state 계산, 이벤트 처리, 데이터 변환까지 모두 Effect에 넣게 되고 오히려 코드가 복잡해집…

React React · 초급 설명 7분 2026.09.19

React의 state는 변수 이름이 아니라 렌더 트리의 위치와 연결됩니다. 같은 위치에 같은 컴포넌트가 렌더링되면 React는 이전 state를 유지합니다.

React React · 초급 설명 7분 2026.09.19

props로 값과 이벤트를 전달할 수 있게 되면 다음 단계는 “컴포넌트를 어떻게 조합할 것인가”입니다. 모든 UI를 하나의 거대한 props 객체로 제어하면 재사용하기 어렵고 API도 복잡해집니다.

React 설명 8분 2026.09.19

React를 공부할 때 Hook 이름을 순서대로 외우는 것보다 더 중요한 것은 “이 기술을 써서 무엇을 만들게 되는가”를 먼저 아는 것입니다.

Zustand · 중급 설명 8분 2026.09.15

할 일 추가·완료·삭제를 action으로 모으고 새로고침 후 상태를 복원합니다.

Zustand · 중급 설명 9분 2026.09.15

React 렌더 구독과 외부 리스너를 구분하고 등록한 구독을 정리합니다.