React - props를 이용하여 데이터 전달하기

리액트 props를 이용하여 데이터를 전달하여서 엘리먼트에 사용하는 방법입니다. 먼저 Hello라는 컴포넌트를 간단하게 만듭니다. function Hello() { return Hello } export default Hello 위와 같이 Hello 컴포넌트를 만들고 Hello 컴포넌트를 렌더링 하게 되면 const root = ReactDOM.createRoot(document.getElementById('root')); root.render( ); Hello 글자가 나옵니다. 이제 Hello 컴포넌트 네임 props를 전달하여서 Hello 컴포넌트에 이름을 넣어보겠습니다. function Hello(props) { return Hello {props.name} } export default Hello..

• format_list_bulleted Develop/React
• · 2023. 1. 10.
• textsms

React 프로젝트 설정하기

간단하게 React 프로젝트를 설정해 보겠습니다. 1. Node 설치하기 먼저 컴퓨터에 Node.js가 설치되어 있어야 합니다. 아래 사이트에서 설치할 수 있습니다. https://nodejs.org/en/ 2. 터미널 열기 터미널을 열고 본인이 React 프로젝트를 설정하고 싶은 폴더로 이동합니다. 3. React 설정하기 터미널 창에 아래와 같이 입력합니다. npx create-react-app hello-react hello-react는 프로젝트 이름이며, hello-react 폴더가 생기며 자동으로 react 설치됩니다. 짜잔 설치 완료되었습니다. 이제 아래와 같이 입력하여서 react 프로젝트를 실행해보겠습니다. cd hello-react npm start 자동으로 localhost:3000이 ..

• format_list_bulleted Develop/React
• · 2023. 1. 9.
• textsms