웹프로그래밍/React3 [React] 실전 리액트 프로그래밍(1) render 함수는 순수 함수로 작성해야 한다. 순수 함수란, 입력값이 같으면 출력값이 같은 함수를 의미한다. 언제나 동일한 값이 만들어져야 하며 이 안에 랜덤값 같은 게 들어가서는 안 된다. state는 불변 변수로 관리해야 한다. React.createElement에 대해 자세히 공부했다. React.createElement( 'div', //태그 이름 null, //속성값 "hello world" //자식 ); 첫 번째는 만들고 싶은 태그 이름, 두 번째는 태그 속성값 이며 그 뒤에는 자식 element들이다. 태그 속성값에는 onClick 과 같은 함수도 가능하며 자식에는 중첩으로 React.createElement를 넣을 수 있다. function LikeButton() { const [like.. 2020. 10. 10. [React] React 로 To-Do List 만들기 (2) - yarn 설치 및 CRA로 react 환경 만들기 NVM으로 node와 npm을 설치해주었으니, yarn을 설치해보자. yarn이나 npm이나 똑같이 패키지 관리 툴인데, 듣기로는 yarn이 좀 더 안정적이라고 하는 것 같다. (나는 npm이 더 익숙하고 차이가 잘 느껴지진 않는다..) vs code에서 git bash를 열어 yarn을 설치한다. $ npm install -g yarn 그리고 CRA를 설치해주자 (create-react-app) $ yarn global add create-react-app 설치가 잘 된 것을 확인할 수 있다. 이제 react 환경을 만들어보자. git bash에 아래와 같이 치면 알아서 만들어진다. $ npx create-react-app todo-list create-react-app은 리액트 환경을 만들어주는 거고.. 2020. 10. 3. [React] React 로 To-Do List 만들기 (1) - window NVM 설치 velopert 님의 블로그 포스팅을 보고 따라서 만들었다. 먼저, 기존에 있던 node의 버전이 12.~으로 최신 버전이었는데, 포스팅에선 LTS 버전을 깔라고 하셔서 컴퓨터에 있는 node.js를 삭제했다. 버전 관리를 위해 nvm을 설치해주도록 하자. nvm은 원래 리눅스나 os에서만 사용이 가능하지만 window를 위해 만들어진 것이 있다. github.com/coreybutler/nvm-windows coreybutler/nvm-windows A node.js version management utility for Windows. Ironically written in Go. - coreybutler/nvm-windows github.com 설치하기 이전에 기존 컴퓨터에 있는 node랑 npm을.. 2020. 10. 3. 이전 1 다음