hook은 리엑틍서 재공하는 Commpoment class의 내용을 함수형에서 사용하기 위해 함소형 컴포넌트에서 일부가 구현된 것을 말한다.Hook은 React 버전 16.8부터 React 요소로 새로 추가되었습니다. Hook을 이용하여 기존 Class 바탕의 코드를
class의 생명 주기이다 상위 컴포넌트에서 더이상 하위 컴포는트를 사용하지 않을 때 없어진다.
컴포는트는 element를 생성하는 함수이다. 이는 붕어빵에서 틀 하 현타오네props는 컴포넌트 객체에 주입되는 정보이다. 쉽게 생각하면 그냥 자바 클래스랑 매우 비슷한거임 근데 그 클래스 만들어질때 전해지는 파라미터 같은거지props는 Read only이다.prop
위는 react의 가상 돔과 실제 dom을 보여주고 있는데 react에서는 가상돔이 실제 돔으로 레더링 되는 과정이 존재한다. 브라우저 DOM 엘리먼트와 달리 React 엘리먼트는 일반 객체이며(plain object) 쉽게 생성할 수 있습니다. React DOM은
jsx는 react에서 자바 스크립트와 html을 동시에 사용할 수 있도록 확장한 문법이다.위 코드에서 명확하게들어나는 차이점은 react create element함수를 통해서 위의 코드를 javascript 객체로 전환하는데 JSX코드를 사용하면 이를 자동으로 ja
사용자 인터페이스에서 새로운nav를 추가하는 create를 학습함 여기서 포인트는 setState()에서 들어가는게 기본 타입이 아니고 사용자가 정의하거나 obj라면 ... 을 사용해서 복제후에 다시 복제본을 수정해서 다시 상태를 정의 해주어야 새롭게 랜더링 된다.
props는 단방향 데이터 흐름의 리액트에서 상위에서 하위로의 데이터 전달을 위해 사용한다 그 말은 부모 component에서 자식 component로 데이터를 전달할 때 사용함.음 컴포넌트를 정의하고 그걸 사용한 App() component에서 내부에서 사용한 다른
component 내부에서 정보를 전달해서 return 값을 바꿘다.
사용자 정의 태그를 react - component 라고 사용하는데 정의하는 방법은 위와 같다정의하려는 컴포넌트의 시작은 무조건 대문자로 선언하고 나머지는 자바스크립트 문법으로 함수를 만들어서 사용한다 그리고 만들어진 컴포넌트를 아래와 같이 app.js 에 넣어서 다
위가 HTML에서 event 를 처리하는 방법이다.위의 코드가 react에서 이벤트를 처리하는 방법이다.가장크 차이점은 발생하는 이벤트의 기본 동작을 막기 위해서는 prevent Default르르 명시적으로 호출해야 막이진다는 점이다.위에서 볼수 있든 return fa
memoization 비용이 많이 드는 함수의 결과값을 저장했다가 다시 연산할 필요없이 저장된 값을 반환하는 것을 말한다. 자원 사용량이 줄어든다.반복 작업을 하지 않아 랜더링 속도가 증가한다.주의사항 \- 랜더린 시에 동시에 실행되기 때문에 렌더링 중에 값을 변경되
사용자에게 정보를 받기 위해서 사용하는 것$react 에서는 state 형태로 받는다import React, { useState } from "react";
shared state 공유된 상태로 여러개의 하위 컴포넌트에서 사용가능하게하는 것아래의 코드에서는 다른 이전의 코드와는 다르게 같은 상태르르 공유하는 것을 볼수 있는데 최상위 컴포넌트에서 입력 받은 props에서 입력받은 것을 자식에서 사용할 수 있게 구현했다.
리엑트에서 컴포지션이란 다른 컴포넌트들을 사용해서 새로운 컴포넌트를 구성하는 개념을 말한다. JSX 태그 안에 있는 것들이 FancyBorder 컴포넌트의 children prop으로 전달됩니다. FancyBorder는 {props.children}을 안에 렌더링하므
리액트에는 다음과 같은 이상한 개념이 있는데 사실 막 크게 이상한 개념은 아니다 파이선이다 자바 같은 언어에서도 종종 조건문에 null or None값이 들어가면 false로 반단하고는 하니까 근데 여기서 추가된것이 많다.맞다 보고 배낀거다제일 쉽게 생각해서 다른 컴포
javascript의 리스트에서는 map()함수를 가지고 있는데 이 안에서 원하는 처리를하고 배열을 만드는 것을 할 수 있다 이는 마치 java stream()을 사용하는 것같다 그리고 리스트 내부에 들어있는 컴포넌트들은 반드시 key를 가져야한다리액트에서는 반드시