개념

객체는 변수명.name으로 속성에 접근할 수 있으며 이 속성을 프로퍼티(property)라고 한다. 그리고 그 프로퍼티의 값은 'egoing'이다.객체의 프로퍼티에는 함수가 들어갈 수 있다. 이것을 메소드라고 한다.함수안에 담겨잇는 변수는 프로퍼티(property)이다

일급시민이라 함은 생성된 변수에 값을 집어넣을 수 있을때를 말한다. 생성된 변수에 함수를 넣을 수 있으므로 함수는 일급시민이다. 함수 fn()은 함수 val을 return 해주고 있다. 함수가 다른 함수를 리턴해줄 수 있다면 그것은 일급시민이다.

이 함수를 실행해보자. 그러면 결과값은 124..(5초후)..3 이 나오게 된다. setTimeout에 있는 5000이 5초를 의미하고 5초 뒤에 콜백함수인 function() {console.log(3)} 을 실행하기 때문이다. 이렇게 3을 기다리고 4를 출력하는 것

state - 내부에서 변화하는 값 props - 변하지 않는 외부로부터 전달받은 값, 함부로 변경될 수 없는 읽기 전용(read-only) 객체

출처: 인프런 한입 크기로 잘라 먹는 리액트리액트에서 Lifecycle이란 3가지로 분류할 수 있다.탄생 - 컴포넌트가 화면에 나타나는 순간이다. 리액트에서 Mount라고 부른다변화 - State가 바뀌거나, 부모가 리렌더 되거나, Prob이 바뀌어 컴포넌트 자신이 리

컴포넌트 3과 컴포넌트 6에서만 사용하는 props가 있다. 이러면 어떻게 해야할까?기존 우리가 배웠던 방법을 이용하면 최상위 컴포넌트에서 컴포넌트를 계속 내려줘야 했다. 하지만 이러면 코드가 너무 복잡해지고 가독성이 안좋아진다. 그래서 이 Rudux를 사용하면 그림처

useEffect 안에 있는 코드는 html 렌더링 후에 동작합니다.for을 10000번 돌리면 시간이 오래 걸린다. 그러므로 이 동작을 useEffect 안에 넣어 놓으면 html파일이 전부 실행된 후에 for문이 돌아가기 때문에 훨신 효율적인 코드를 짤 수 있다.어

반응형웹을 만들기 위해서는 미디어쿼리를 사용한다.1.CSS 파일을 HTML 파일에 적용하던 것처럼 < head >태그 안에 < link >태그를 위치 시킵니다. 다른 css 파일을 적용할 때와 다른 점은 미디어 속성을 사용하여 조건을 지정한다는 점입니다. 미

차후작성

특정 값(value)를 재사용하고자 할 때 사용하는 Hook이다.이미 계산해 본 연산 결과를 기억해두었다가 동일한 계산을 시키면 다시 연산하지 않고 기억해두었던 데이터를 반환 시키게 하는 방법이다마치 시험을 볼 때 이미 풀어본 문제는 다시 풀어보지 않아도 답을 알고 있

리액트 메모란 변하지않는 props에 의한 리렌더링을 막는 것 이다.예를들어 text 컴포넌트와 count 컴포넌트가 있다. 둘은 props로 text값과 num값을 갖을 것 이다. 이때 text가 바뀌면 text컴포넌트가 리렌더링되는 것은 당연하지만 count 컴포넌

useMemo는 (()=>{},\[])처럼 사용하며 \[]안의 값이 변할때에만 {}안의 함수를 실행하는 것 이였다. 하지만 결과값으로 함수가 아닌 값을 반환한다. 그렇기 때문에 함수를 사용하고 싶은 경우에는 못썼는데 이럴 때 사용할 수 있는 것이 useCallback

먼저 브라우저의 url과 리액트앱을 연결하는 기능을 하는 < BrowserRouter > 컴포넌트로 App 컴포넌트가 return하는 부분을 감싸준다.페이지의 주소가 변하면 변할 부분을 < Routes > 로 감싸준다변할 페이지 컴포넌트를 < Route

Path Variable - 경로 변수, url에 있는 숫자 번호들ex) /diary/1 , /diary/2useParams로 관리QueryString - ? 키워드 뒤에있는것 가져옴ex) /edit?id=10&mode=darkuseSearchParams로 관리링크 뒤

< Provider > : state를 옮겨준다. state를 옮겨줄 컴포넌트를 감싸서 사용한다.const store = createStore() : store라는 커다란 작동기계를 만들어준다. createStore()의 괄호 안쪽에는 기능을 담당하는 reduc

display: flex 는 부모 박스 요소에 적용해, 자식 박스의 방향과 크기를 결정하는 레이아웃 구성 방법입니다flex-direction 속성은 부모 요소에 설정해주는 속성으로, 자식 요소들을 정렬할 정렬 축을 정합니다. 아무 설정도 해주지 않으면 기본적으로 가로