본문 바로가기

React11

리액트의 Props 소개 리액트(React)에서 Prop는 컴포넌트 간에 데이터를 전달하는데 중요한 역할을 합니다. 이 글에서는 리액트의 Props에 대한 기초적인 이해를 다루어 보겠습니다. Props란? Props는 부모 컴포넌트에서 자식 컴포넌트로 데이터를 전달하는 방법입니다.(단방향) Props를 통해 컴포넌트 간에 정보를 공유하고 동적인 데이터 전송이 가능해집니다. Props의 전달 Props는 부모 컴포넌트에서 자식 컴포넌트로 전달됩니다. 예를 들어, // 부모 컴포넌트 const ParentComponent = () => { return ; } // 자식 컴포넌트 const ChildComponent = (props) => { return ( Name: {props.name} Age: {props.age} ); .. 2023. 12. 13.
리액트의 상태(State) 관리 소개 이 글에서는 리액트의 상태(state)에 대한 기본적인 이해를 다룰 것이다. 상태(State)란? 리액트의 상태는 간단히 말해 컴포넌트 내에서 관리되는 데이터이다. 이 데이터는 컴포넌트의 생명주기 동안 변할 수 있으며, 변화에 따라 UI가 업데이트된다. 상태의 생성과 초기화 리액트에서 상태를 사용하기 위해선 useState 훅을 이용한다. 예를 들어, import React, { useState } from 'react'; const MyComponent = () => { const [count, setCount] = useState(0); // 나머지 코드 } 위의 코드에서 count는 상태 변수이고, setCount는 상태를 변경하는 함수이다. useState(0)은 초기 상태를 0으로 설정한다.. 2023. 12. 13.
npm, npx 차이 react 공부를 시작하면서 react 프로젝트를 생성할 때 npx create-react-app 명령을 사용했다. 그래서 npm과 npx의 차이점에 대해서 간단하게 정리를 해보자. npm npm은 node package manager의 약자로 노드 패키지 관리자이다. npm은 주로 Node.js 애플리케이션의 필요한 패키지를 설치하고 의존성을 관리하는데 사용된다. npn install 명령어를 통해 패키지를 설치할 수 있다. npm을 사용하여 package.json 파일에 정의된 스크립트를 실행할 수 있다. ex) npm start npm을 사용하여 패키지를 글로벌하게 설치할 수 있다. ex) npm install -g 글로벌 설치된 패키지는 시스템 전역에서 사용할 수 있다. npx npm 5.2버전부.. 2023. 12. 13.
반응형