프로그래밍 삽질 중

출처: https://www.inflearn.com/course/web-game-react/dashboard [무료] 웹 게임을 만들며 배우는 React - 인프런 | 강의 웹게임을 통해 리액트를 배워봅니다. Class, Hooks를 모두 익히며, Context API와 React Router, 웹팩, 바벨까지 추가로 배웁니다., - 강의 소개 | 인프런... www.inflearn.com * HOC (하이오더컴포넌트) = 고차 컴포넌트 ▶ 컴포넌트 로직을 재사용하기 위해 사용되고 컴포넌트를 가져와 새 컴포넌트를 반환 ▶ 컴포넌트를 인자로 받거나 반환하는 함수 ▶ 컴포넌트를 감싸는 것 (예시에서는 memo 의미)) 참고 : https://itprogramming119.tistory.com/entry/Re..

출처: https://www.inflearn.com/course/web-game-react/dashboard [무료] 웹 게임을 만들며 배우는 React - 인프런 | 강의 웹게임을 통해 리액트를 배워봅니다. Class, Hooks를 모두 익히며, Context API와 React Router, 웹팩, 바벨까지 추가로 배웁니다., - 강의 소개 | 인프런... www.inflearn.com https://ba-gotocode131.tistory.com/240 에서 이어짐 [웹 게임을 만들며 배우는 React] - 가위바위보, 라이프사이클 출처: https://www.inflearn.com/course/web-game-react/dashboard [무료] 웹 게임을 만들며 배우는 React - 인프런 | ..

출처: https://www.inflearn.com/course/web-game-react/dashboard [무료] 웹 게임을 만들며 배우는 React - 인프런 | 강의 웹게임을 통해 리액트를 배워봅니다. Class, Hooks를 모두 익히며, Context API와 React Router, 웹팩, 바벨까지 추가로 배웁니다., - 강의 소개 | 인프런... www.inflearn.com * 라이프 사이클(컴포넌트의 일생) - 컴포넌트(SPClass.jsx)가 클라이언트(client.jsx)에서 불려와서 렌더링됨 - 컴포넌트가 DOM에 붙는 순간이 있음 - 특정한 동작 가능 ▶ class에서는 아래의 3개가 담당한다면 함수 컴포넌트에서는 useEffect가 이 역할을 담당(1대1 대응은 아님) comp..

출처: https://www.inflearn.com/course/web-game-react/dashboard [무료] 웹 게임을 만들며 배우는 React - 인프런 | 강의 웹게임을 통해 리액트를 배워봅니다. Class, Hooks를 모두 익히며, Context API와 React Router, 웹팩, 바벨까지 추가로 배웁니다., - 강의 소개 | 인프런... www.inflearn.com * class 사용 [ResponseCheckClass.jsx] import React, { Component } from "react"; class ResponseCheckClass extends Component { state = { state: "waiting", message: "클릭해서 시작하세요.", res..

출처: https://www.inflearn.com/course/web-game-react/dashboard [무료] 웹 게임을 만들며 배우는 React - 인프런 | 강의 웹게임을 통해 리액트를 배워봅니다. Class, Hooks를 모두 익히며, Context API와 React Router, 웹팩, 바벨까지 추가로 배웁니다., - 강의 소개 | 인프런... www.inflearn.com * createRef - hooks의 useRef처럼 class에서도 ref 사용하기 = createRef - 굳이 함수처럼 만들어서 ref를 해야 하나? ▶ 예전 작업을 가져오거나 다른 동작이 필요할 경우 - 간단하게 ref 작업 = createRef * this.setState({}) - 사용 권장 x - 렌더 실..

출처: https://www.inflearn.com/course/web-game-react/dashboard [무료] 웹 게임을 만들며 배우는 React - 인프런 | 강의 웹게임을 통해 리액트를 배워봅니다. Class, Hooks를 모두 익히며, Context API와 React Router, 웹팩, 바벨까지 추가로 배웁니다., - 강의 소개 | 인프런... www.inflearn.com * Try.jsx를 따로 빼서 NumberBaseball.jsx에서 호출 * useState 참고 : https://react.vlpt.us/basic/07-useState.html 7. useState 를 통해 컴포넌트에서 바뀌는 값 관리하기 · GitBook 7. useState 를 통해 컴포넌트에서 바뀌는 값 관..

출처: https://www.inflearn.com/course/web-game-react/dashboard [무료] 웹 게임을 만들며 배우는 React - 인프런 | 강의 웹게임을 통해 리액트를 배워봅니다. Class, Hooks를 모두 익히며, Context API와 React Router, 웹팩, 바벨까지 추가로 배웁니다., - 강의 소개 | 인프런... www.inflearn.com * (웹팩 사용) 강의 내 "숫자야구 3-3"에서 문제 발생 ▶ import과 require 사용에서 문제 발생 ▶ 노드 내에서는 require만 되나, 바벨이 import문을 const로 바꿔주기 때문에 바벨이 설치되어 있다면 둘 다 섞어서 사용이 가능함 ▶ 계속 문제 발생할 경우 웹팩 다시 설치 후 진행 권장 ht..

출처: https://www.inflearn.com/course/web-game-react/dashboard [무료] 웹 게임을 만들며 배우는 React - 인프런 | 강의 웹게임을 통해 리액트를 배워봅니다. Class, Hooks를 모두 익히며, Context API와 React Router, 웹팩, 바벨까지 추가로 배웁니다., - 강의 소개 | 인프런... www.inflearn.com * class version ▶ Component 사용 ▶ this 사용 const React = require("react"); const { Component } = React; class WordRelay extends Component { state = { word: "제로초", value: "", result..