클래스 & 함수 타입 컴포넌트 새로운 폴더를 만들고 새 프로젝트를 만든 후 터미널에서 create-react-app을 설치한다. npx create-react-app . npm start 클래스 & 함수 방식 컴포넌트의 props 클래스 방식의 컴포넌트에서는 외부에서 전달된 props 값을 받을 때 this를 사용하지만 함수 방식의 컴포넌트에서는 파라미터를 이용하여 props 값을 받는다. 함수 방식의 인자는 아무 이름으로 정해도 된다. // App.js import React from 'react'; import './App.css'; function App() { return ( Hello World ); } // 함수 방식으로 작성한 컴포넌트 function FuncComp(props) { retu..

크롬 브라우저에서 React Developer Tools 확장 프로그램 설치하기 https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi React Developer Tools Adds React debugging tools to the Chrome Developer Tools. Created from revision 7f673317f on 5/31/2022. chrome.google.com 확장 프로그램으로 설치된 Components 탭을 클릭하면 페이지의 실제 컴포넌트를 보여준다. 클릭하면 각 컴포넌트의 props와 값을 볼 수 있다. 직접 값을 변경할 수도 있다. 컴포넌트를 파일로 분..

개발환경 만들기 1. Node 설치 https://nodejs.org/en/ Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org Create React App 링크 https://github.com/facebook/create-react-app GitHub - facebook/create-react-app: Set up a modern web app by running one command. Set up a modern web app by running one command. Contribute to facebook/create-react-app development by creating an..