React Study

리액트란 React는 Component단위로 이루어진 UI를 만들 수 있는 라이브러리다.? 각각 독립적이고, 재사용이 가능한 컴포넌트를 조합해서 만든 이다. (트리 구조로 이뤄짐) 리액트는 데이터가 변경될 때마다 어플레케이션 전체를 다시 렌더링 한다..? 가상의

리액트에서 컴퍼넌트는 함수 컴퍼넌트와 클래스 컴퍼넌트로 나눌 수 있다.말 그대로 함수와 클래스로 컴퍼넌트를 각각 나타내는 것이다.컴퍼넌트의 이름은 항상 대문자로 시작해야 한다. 이유는 아래와 같다. (출처 : 리액트 공식페이지)정적인 Component 관리 가능(16.

방법은 React 공식페이지에 나와있다.나중에 쉽게 보기 위해 정리해본다.Create React App에 대해 알아보고자 한다.이를 활용하려면 Nodejs가 설치돼있어야 한다.그리고 아래와 같이 "my-app"부분에 내가 원하는 이름을 수정하여 아래와 같이 입력하면 새

Axios는 브라우저, Node.js를 위한 Promise API를 활용하는 HTTP 비동기 통신 라이브러리다. 즉, 프론트엔드가 백엔드랑 통신을 쉽게 하기위해 사용하는 것이다.GET, POST, PUT, DELETE 등의 HTTP Methods를 이용해서, 클라이언트

직접 state 값을 수정하면 안된다. (setState 함수 사용)state 업데이트는 비동기적이다.state의 업데이트는 병합된다? (state의 변수가 여러 개라면, 따로 업데이트가 가능)만약 아래와 같이 state를 수정하면, 수정 값은 반영되나 컴퍼넌트를 다시

상위(부모) Component에서 하위(자식) Component로 state 전달해서 사용하는(읽는) 것은 쉽다.자식 컴포넌트를 불러올 때, 넘겨주고 싶은 값을 넘겨주면 된다. 예를 들면,와 같이 작성해서 Child라는 자식 컴포넌트에 'name'이라는 이름으로 넘겨주

이제 Class Component는 한 물 갔다고 한다. 앞으로는 Function Component를 활용하면 된다.Function Component가 새로 나온 것은 아니나, 기존에 Function Component로 해결할 수 없던 state 관리를 React Ho

react에서 state에 따라 <iframe> 태그를 띄우고 없애는 작업을 했다.띄울 때는 상관 없었는데, 없앨 때 아래와 같은 에러가 발생했다. 위와 같은 에러가 뜨는 이유는 스택오버플로우에서 찾았는데, 아래와 같다고 한다.간단히 말하면, <div> 태그

React 해당하는 폴더 최상단에 .env 파일을 만든다.(git 사용중이면) .gitignore파일에 ".env"를 추가해준다..env파일 안에 반드시 "REACT_APP\_원하는 이름"으로 이름을 지어주고 KEY를 작성한다.html 파일에서는 '%REACT_APP\

React 공식사이트를 참고했다.Class Component 리액트를 사용하다보면, 콜백함수를 사용할 때 겪는 에러들이 있다.예를 들면, 이런 식으로 뜨는 에러다.아래와 같이 콜백을 사용하지 말고, (drawCharacter()은 이 Component 안에 선언된 함수