React

React JS, ReactDOM 코드를 import React JS : element 생성, event listener 더하는 것을 도와줌React DOM : React element들을 가져다가 HTML로 변환const h3 = React.createElement

state 기본적으로 데이터가 저장되는 곳 React.js 에서 바뀐 내용을 출력하는 방법 render 함수를 다시 호출해주면 새 Container 컴포넌트를 생성하는 것이 아니라 다시 호출하더라도 숫자부분의 html만 바뀜 React.js 자체에서 리렌더링까지

Props props란 같은 함수에서 text만 바꾸고 싶을 때 color를 바꾸고 싶을 때 등 특정한 부분만 바꾸려고 할 때 사용. Props를 사용하는 이유 위 코드에서 Btn이라는 함수에서 text만 각각 Save Changes, Continue로 바꾸고 싶을

state가 변화할때 모든 component는 다시 실행되고, 모든 code들도 다시 실행된다. component 내부중에서 일부는 처음 한 번만 실행되게끔 만들고 싶을 때 사용.

useState로 toDo와 setTodo 설정input의 value를 toDo로 설정해서 input의 값을 받아옴.input의 값이 onChange로 바뀌면 setTodo(event.target.value( => 이벤트가 발생된 대상의 값을 받아옴)) 가 변경한 값을

loading useState로 Loading...이 뜨고 안뜨는 상황 설정. 기본값은 true로 설정.if문으로 loading이 true면 Loading... 뜨고 falce면 null이 뜨게 설정.useEffect 안에서 fetch함수로 코인들의 정보를 받아오고 t

loading useState 사용해서 loading이면 Loading... 띄우고 아니면 영화를 return하는 로직을 짬. json으로 8.8 이상의 영화만 보여주는 함수를 짜준다. map 함수 사용해서 필요한 정보만 가져옴. 다른 페이지로 이동하는 로직을 짜

이 함수를 사용하면 React Router는 바로 변수의 값을 넘겨준다.

useRef 저장공간으로 State와 비슷하다. State와 다른점은 State는 State가 변화할때마다 렌더링되고 컴포넌트의 내부 변수들이 초기화 되는 반명 Ref는 렌더링이 일어나지 않고 변수들의 값이 유지된다. 렌더링이 일어나면 안될 요소에 사용하면 된다. Ja

useContext, Redux, Redux Toolkit 비교하기

불변성이란 무질서한 수정과 삭제로 인한 데이터의 원본 훼손을 막는 것. 가변성이 나쁜것이 아님.React는 이전 데이터와 바뀐 데이터를 비교해 변화가 있다면 렌더링하는 원리로 동작하기 때문에 불변성이 중요.

왜 알아야 하는지? React 컴포넌트 선언하는 두 가지 방식. 클래스형 컴포넌트는 현재 자주 사용하지 않지만, 사용하는 기업들이 있다. 그 프로젝트의 유지보수를 위해서 개념은 알고 있어야 한다. 차이점 1. 특징 함수형 state, lifeCycle 관련 기능

React 16.8 버전 (2019년도) 에 추가된 공식 라이브러리Class형 컴포넌트에서만 쓸 수 있었던 state와 life cycle을 Function형 컴포넌트에서도 사용 가능현재 공식문서에서는, Class형 컴포넌트보다는 Function형 컴포넌트로 새로운 R

React-Query란? React Application에서 서버의 상태를 불러오고, 캐싱하며, 지속적으로 동기화하고 업데이트 하는 작업을 도와주는 라이브러리. React Query는 우리에게 친숙한 Hook을 사용하여 React Component 내부에서 자연스럽게 서버(또는 비동기적인 요청이 필요한 Source)의 데이터를 사용할 수 있는 방법을 제안함...