1. 컴포넌트를 효율적으로 출력하기 일단 이 사진은 컴포넌트를 많이 만들어야 한다면 이 방법은 효율적이지 않다. 새 음식을 추가할때마다 를 복사해야 한다. 또한 서버에서 음식 데이터를 받아 출력하는 경우, 음식 데이터의 개수를 알 수 없다면 더 문제가 된다. 그래서 이와 같이 배열을 만들고 안에 속성값을 넣음으로써 많은 양(?)의 컴포넌트도 대비한다. 2. map() 함수 map() 함수의 인자로 전달한 함수는 배열 friends의 원소를 대상으로 실행 friends에는 4개의 원소가 있으니 함수는 4번 실행된다. 두번째는 그 함수가 반환한 값이 모여 배열이 되고 > 그 배열이 map() 함수의 반환값이 된다. console.log에서 current가 출력되고 return 0;에서 0을 반환한다. 이름 ..

1. React에서 Node.js를 사용하는 이유? Node.js를 설치하게 되면 npm(Node Package Manger)이 설치된다. Node.js와 React가 직접적인 관련은 없지만, React 프로젝트 개발 시 필요한 주요 도구들(바벨,웹팩 등)을 Node.js의 npm이 설치해주는 것이다. 2. 리액트 프로젝트를 VSCode에서 쉽게 생성하는 방법 Terminal에 npx create-react-app 프로젝트 이름 npx는 npm의 아들이며 npm@5.2.0 버전부터 새로 추가되었다고 한다. npx가 없을 당시에는 npm을 통해 React app을 생성했는데 npm install -g create-react-app ~ 을 했었는데 문제점이 있었다. CRA(Create React App:리액..