이벤트 핸들러 같은 상호 작용을 다시 수행할 때만 다시 실행됩니다. 이벤트 핸들러와 달리, Effects는 prop 또는 state 변수와 같은 일부 값을 마지막 렌더링 때와 다른 값으로 읽게 되면 다시 동기화됩니다. 때로는 일부 값에 대한 응답으로 다시 실행되는 Ef

이펙트는 컴포넌트와 다른 라이프사이클을 가집니다. 컴포넌트는 마운트, 업데이트 또는 마운트 해제할 수 있습니다. 이펙트는 동기화를 시작하고 나중에 동기화를 중지하는 두 가지 작업만 할 수 있습니다. 이 사이클은 시간이 지남에 따라 변하는 프로퍼티와 상태에 의존하는 Ef

상태 관리를 위해 Redux와 Recoil, ContextAPI를 비교할 때,가장 많이 나오는 차이점이 보일러플레이트, 미들웨어유무, 간편성 정도일 것입니다.간혹 보안에 대해서 Redux가 다른 상태 관리 방법 보다 뛰어나다는 것을 볼 수 있었는데,여기서 말하는 보안이

Reducer를 사용하면 컴포넌트의 state 업데이트 로직을 통합할 수 있습니다. Context를 사용하면 다른 컴포넌트들에 정보를 전달할 수 있습니다. Reducer와 context를 함께 사용하여 복잡한 화면의 state를 관리할 수 있습니다.학습 내용reduce

일반적으로 부모 컴포넌트에서 자식 컴포넌트로 props를 통해 정보를 전달합니다. 하지만 중간에 여러 컴포넌트를 거쳐야 하거나 앱의 여러 컴포넌트가 동일한 정보를 필요로 하는 경우 props를 전달하면 장황하고 불편해질 수 있습니다. 컨텍스트를 사용하면 부모 컴포넌트가

리액트는 선언적인 방식으로 UI를 조작합니다. 개별적인 UI를 직접 조작하는 것 대신에 컴포넌트 내부에 여러 state를 묘사하고 사용자의 입력에 따라 state를 변경합니다. 이는 디자이너가 UI를 바라보는 방식과 비슷합니다.학습 내용선언형 UI 프로그래밍과 명령형

Ref로 값 참조하기

노드의 모듈 시스템 외부 모듈을 가져올 수 있습니다.변수나 함수, 클래스를 선언할 때 맨 앞에 export를 붙이면 내보내기가 가능합니다.무언갈 가져오고 싶다면 아래와 같이 이에 대한 목록을 만들어 import {...}안에 적어주면 됩니다.둘은 호환됩니다.requir

브라우저에 저장되는 작은 크기의 문자열 (최대 4KB)웹 서버에서 웹 브라우저에게 정보(데이터)를 전송하며, 정보의 유효기간을 지정할 수 있습니다.유효기간동안 웹 브라우저의 쿠키 저장소에 쿠키가 저장되고, 유효기간을 지정하지 않으면 웹 브라우저가 닫힐 때 삭제됩니다.유

seRef는 .current 프로퍼티로 전달된 인자(initialValue)로 초기화된 변경 가능한 ref 객체를 반환합니다. 반환된 객체는 컴포넌트의 전 생애주기를 통해 유지됩니다. 이 말은 컴퍼넌트가 계속 렌더링 되어도 언마운트 되기 전까지는 값을 유지한다는 뜻입니

컴포넌트는 상호 작용의 결과로 화면의 내용을 변경해야 하는 경우가 많습니다. 폼에 입력하면 입력 필드가 업데이트되어야 하고, 이미지 캐러셀에서 '다음'을 클릭하면 표시되는 이미지가 변경되어야 하며, '구매'를 클릭하면 제품이 장바구니에 담겨야 합니다. 컴포넌트는 현재

React를 사용하면 JSX에 이벤트 핸들러를 추가할 수 있습니다. 이벤트 핸들러는 click, hover, form input focus 등과 같은 상호작용에 반응하여 발생하는 자체 함수입니다.학습 내용이벤트 핸들러를 작성하는 다양한 방법부모 컴포넌트로부터 이벤트 핸

JSX를 사용하면 JavaScript 파일 내에 HTML과 유사한 마크업을 작성하여 렌더링 로직과 콘텐츠를 같은 위치에 유지할 수 있습니다. 때로는 마크업 안에 약간의 자바스크립트 로직을 추가하거나 동적 프로퍼티를 참조하고 싶을 때가 있습니다. 이 경우 JSX에서 중괄

JSX는 JavaScript를 확장한 문법으로, JavaScript 파일 안에 HTML과 유사한 마크업을 작성할 수 있도록 해줍니다. 컴포넌트를 작성하는 다른 방법도 있지만, 대부분의 React개발자는 JSX의 간결함을 선호하며 대부분의 코드베이스에서 JSX를 사용합니

제작 코드는 원격에서 스크립트를 불러오는 것 같은 시간이 걸리는 일을 합니다.소비 코드는 제작 코드의 결과를 기다렸다가 이를 소비합니다. 소비 주체(함수)는 여럿이 될 수 있습니다.프로미스는 제작 코드와 소비 코드를 연결해 주는 자바스크립트 객체입니다.시간이 얼마나 걸

this

호출 스케줄링 **함수를 명시적으로 호출하지 않고, 일정 시간이 지난 후에 원하는 함수를 예약 실행(호출)할 수 있게 하는 것** 타이머 함수 타이머 함수는 ECMAScript 사양에 정의된 빌트인 함수가 아닙니다. 하지만 자바스크립트 실행 환경에서 추가로 재공하는

static - 요소를 문서 흐름에 맞추어 배치합니다. 브라우저에서 자연스럽게 요소들의 위치를 결정하게 됩니다.(명시적으로 position 속성을 나타내지 않아도 기본값으로 적용된다고 보면 됩니다.)relative - 이전 요소(주로 부모 요소)에 자연스럽게 연결하여

월드 와이드 웹의 토대이며 하이퍼텍스트 링크를 사용하여 웹 페이지를 로드하는 데 사용됩니다.HTTP는 네트워크 장치 간에 정보를 전송하도록 설계된 애플리케이션 계층 프로토콜이며 네트워크 프로토콜 스택의 다른 계층 위에서 실행됩니다.HTTP를 통한 일반적인 흐름에는 클라

객체 - 키가 있는 컬렉션을 저장함배열 - 순서가 있는 컬렉션을 저장함이 두 자료구조 만으론 표현의 한계가 있기 때문에 Set과 Map이 등장합니다.Set 객체는 중복되지 않는 유일한 값들의 집합입니다.동일한 값을 중복하여 포함할 수 없습니다.요소 순서에 의미가 없습니