[React] 2. 속성 (Props)

Component 는 React 에서 html 태그를 가지고 있는 블록이라고 설명 했는데 여기서각각의 블록은 상태 (State) 를 가지게 됩니다.그리고 부모 컴포넌트가 가진 데이터를 속성(Props) 를 통해 자식 컴포넌트에게 전송 할 수 있습니다.하지만 위에 그린 그림처럼 화살표는 무조건 위에서 아래로만 갑니다. (리듀서 or 리덕스를 사용하게 되면 조금 다릅니다.)즉, 속성(Props)은 부모에서 자식 컴포넌트 방향으로만 가는 단방향 데이터이며,또한 자식 컴포넌트는 부모에게 받은 Props를 수정 할 수 없습니다 (readonly)또한 객체 형태로 전송하기에 여러 값을 보낼 수 있습니다.간단하게 짜보면최상위 App 컴포넌트에서 하위 컴포넌트인 Profile 이라는 컴포넌트에게 data 라는 key로..

• format_list_bulleted JavaScript/React
• · 2025. 2. 12.
• textsms

[React] 0. 세팅

우선 자바스크립트 계열들은 vscode 를 많이 쓰기 때문에 vscode 먼저 다운 받고 node.js 까지 받았다는 전제하에 (만약 없다면 .. https://nodejs.org/ko 가셔서 node.js 다운 )( https://code.visualstudio.com/Download 가셔서 vscode 다운) 1. vite  터미널에 2가지 방법으로 프로젝트를 생성 할 수 있습니다 .  첫 번쨰는 npx create-react-app 프로젝트명두 번쨰는 create vite@latest ( 만약 powershell 을 통한 터미널인 경우 npx create-vite@latest ) 둘의 차이는 npx 같은 경우엔 Webpack vite 같은 경우엔 ESBuild 를 사용해서 번들링을 진행하게 되는데 ..

• format_list_bulleted JavaScript/React
• · 2025. 2. 7.
• textsms