[React] 웹 게임

1. 첫 리액트 컴포넌트 create-react-app없이 html로 컴포넌트 만들기 lecture 디렉터리 만들고 그 안에 index.html 생성 index.html 2. HTML 속성과 상태(state) 상태(state)는 바뀌는 부분, 혹은 바뀔 수 있는 부분

1. 웹팩 설치하기 create-react-app으로 자동 설치 가능 터미널 실행 후 npm init: package.json 파일 생성 npm i react react-dom: npm이 react, react-dom 설치 npm i -D webpack webpack-

1. import와 require 비교 1) require: node의 모듈 시스템 NumberBaseball class가 module.exports 담겨서 다른파일에서 require로 불러오기 2) import: ES2015(ES6) 모듈 시스템 exports

1. React 조건문 jsx에서는 for, if문 사용 x -> 삼항연산자 또는 AND(&&) 연산자 사용 ResponseCheck.jsx > 코드가 지저분할 때 이렇게 함수로 랜더링 부분을 분리해도 되지만 새로운 컴포넌트로 만들어 주는 게 더 좋음! 2. set

1. 리액트 라이프사이클 componentDidMount(): 처음 render가 성공적으로 됐다면 실행, 리랜더링이 되면 실행x (비동기 요청) componentDidUpdate(): 리랜더링 후 실행 componentWillUnmount(): 컴포넌트가 제거되기 직

1. 로또 추첨기 컴포넌트 Lotto.jsx Ball.jsx 2. setTimeout 여러 번 사용하기 for문에 let 사용 시 클로저 문제 발생 x setTimemout() 사용 시 끝나고 항상 clear 해줘야 함 (메모리 누수 문제 발생) 3. compon

1. useReducer 소개 state가 많아지면 관리가 힘들어지기 때문에 useReducer를 사용하여 하나의 state, setState 로 통일할 수 있음 2. reducer, action, dispatch의 관계 reducer: state와 action객체를

1. Context API 전역적으로 데이터가 사용되야 할 때 (TicTacToe-> Table-> Tr-> Td) 사용 2. createContext와 Provider createContext() 함수를 사용하여 Context 만들기 Context API의 데이터에