리액트에서는 CSS-in-JS을 통해 스타일을 작업을 진행한다.그중에서는 styled-components, emotion이 가장 유명하고 많이 사용된다.그래서 우리 모던 애자일 4기 프론트에서는 어떤 라이브러리를 사용할지 선택하기 위해 각각 어떠한 특징과 장점, 단점이
사전적으로 불변성이란 값이나 상태를 변경할 수 없는 것을 의미한다.Boolen, Number, String, null, undefined, Symbol 과 같은 타입들은 불변성을 유지하는 타입들이고 Object 타입들은 변경 가능한 값들이다.부모 컴포넌트가 re-ren
컴포넌트를 통해 UI를 재사용 가능한 개별적인 여러 조각으로 나눈다컴포넌트는 개념적으로 JavaScript 함수와 유사하다. ‘props’라는 입력을 받은 후, 화면에 어떻게 표시되는지 기술하는 React 엘리먼트를 반환한다.엘리먼트는 일반 객체로 React 앱의 가장
초기 렌더링 되고 난 후 useEffect가 무조건 한 번 실행된다useEffect에 배열로 지정한 useState의 값이 변경되면 실행하게 된다즉, useEffect는 렌더링, 혹은 변수의 값, 오브젝트가 달라지면 그것을 인지하고 업데이트 해주는 함수이다. useEf
React는 클래스형, Hooks는 함수형이라고 생각하면 된다.같은 라이브러리이며 단지 클래스형으로 코드를 작성하느냐, 함수형으로 작성하는냐의 차이이다.클래스형처음 리액트는 클래스형으로 등장하였다. 근데 로직이 복잡하여 컵컴포넌트 재사용에 용이하지 않고, 코드가 불필요
useMemo 함수에 대해서 알려면 메모이제이션 개념을 알아야 한다.메모이제이션이란 기존에 수행한 연산의 결과값을 어딘가에 저장해두고 동일한 입력이 들어오면 재활용하는 프로그래밍 기법이다.메모이제이션된 ‘값’을 반환한다.용법 useMemo는 deps가 변한다면, ()
동기 : 코드를 위부터 아래로 차례차례 읽어 처리해주는 것비동기 : 비동기 부분은 일단 건너뛰고 작업을 처리하는 것비동기 함수를 쓰는 이유는 fetch함수와 같이 그 안에서 데이터 처리를 진행 해야 하는데 그때 처리가 완료가 될 때까지 기다렸다가 다음 코드로 넘어가면
UI의 일부분에 존재하는 자바스크립트 에러가 전체 애플리케이션을 중단시키면 안된다.그래서 React 16에서는 에러 경계라는 새로운 개념이 도입되었다.에러 경계는 하위 컴포넌트 트리의 어디에서든 자바스크립트 에러를 기록하며 깨진 컴포넌트 트리 대신 폴백 UI를 보여주는