학습 목표npm · package.json 기본 구조 이해ES Module을 사용한 정적 사이트 구동 경험React 패키지를 직접 불러오려다 생기는 오류 → 번들러 필요성 체감새 폴더 생성mkdir week1-vanilla && cd week1-vanillapackag

학습 목표컴포넌트 간 데이터 전달의 기본 개념인 props를 이해한다.부모 컴포넌트에서 자식 컴포넌트로 props를 전달하는 방법을 배운다.props를 활용해 컴포넌트를 재사용 가능하게 만드는 실습을 한다.props의 불변성(immutability)과 기본 사용 팁을

Lesson 03 학습 목표: 컴포넌트 내부 상태를 관리하는 useState 훅의 기본 개념을 이해한다. useState를 사용해 동적 UI를 만드는 방법을 배운다. props와 state의 차이를 비교하며, 상태 업데이트를 실습한다. 사용자 입력(폼)과
JavaScript에서는 세 가지 방식으로 변수를 선언할 수 있습니다.기존 함수 표현식을 더 간결하게 작성할 수 있습니다.모듈을 불러오고 내보내는 방법입니다.조건에 따라 다른 값을 반환하는 간단한 조건문입니다.조건이 참일 때만 렌더링합니다.기본값을 제공할 때 사용합니다
useEffect는 컴포넌트가 React 바깥의 시스템(DOM 이벤트, 네트워크, 타이머, 외부 라이브러리 등)과 동기화할 때 쓰는 훅입니다. 본 글에서는 전체 API를 모두 다루지 않고, 실무에서 가장 자주 마주치는 네 가지 축—언제 실행되는가, 의존성 배열을 어떻게
리액트를 처음 접하는 분들께 “폴더/파일을 어떻게 나눌지”를 설명할 때, 용어보다 왜 그렇게 나누는가를 먼저 잡아주면 이해가 빠릅니다. 본 글은 아주 단순한 출발점에서 시작해, 프로젝트가 커질 때 흔들리지 않도록 점진 확장 전략까지 한 번에 정리합니다.처음에는 src를
리액트 라우터 가장 기본기 — 리스트에서 **상품 디테일**까지