React

1. 기존 DOM의 렌더링 과정 > 우선 리액트의 Virtual DOM(가상 돔)을 이해하기 위해서는 기존의 DOM Rendering 과정을 알아야 할 필요가 있는데요. > DOM(Document Object Model)은 간단히 얘기해서 '웹페이지에 보여질 콘텐츠 정

1. JSX란? > JSX(Javascript XML)는 HTML의 연장 언어인 XML처럼 자바스크립트의 XML 버전이라고 할 수 있으며, 기존의 hmtl문서와 JavaScript 파일을 분리하여 사용하던 방식을 탈피하여 동일한 파일에 마크업 언어와 자바스크립트 코드를

리액트에서는 렌더링의 시기를 크게 사용자가 처음 어플리케이션에 진입할 때의 최초 렌더링과 이후의 상태 변화에 의해 발생되는 리렌더링으로 나뉘는데요. 이러한 리액트에서의 렌더링이 일어나는 순서는 다음과 같습니다.최초 렌더링 :리액트 돔 모듈을 이용해 html 파일 내 I

useState는 React 라이브러리에서 제공하는 훅(Hook) 중 하나로, 함수 컴포넌트에서 상태(state)를 사용할 수 있게 해주는 메서드 인데요. 여기서 Hook이란 리액트 16.8v 부터 등장한 기능으로서, 리액트 라이브러리에서 제공하는 특별한 함수이며, 이

1. useState란? > `useState는 리액트에서 특정 값의 상태를 접근하고 제어할 수 있게 해주는 Hook입니다. 일반적으로 값을 가감하거나 초기화 하기 위한 비동기적 업데이트를 위해 사용되며 가장 보편적으로 사용되는 Hook`인데요. > 해당 Hook을 사

props 는 리액트 컴포넌트에 전달되는 데이터를 총칭합니다. 주로 부모 컴포넌트에서 자식 컴포넌트로 데이터를 전달할 때 사용(스페이스 리프팅)되는데요. 전달 된 props는 자식 쪽에서 수정을 할 수 없다는 특징을 가지고 있으며, 보통 전달 받는 쪽에서의 속성 이름은

우선 useEffect를 살펴보기 전에 우리는 생명 주기(Life Cycle)에 대해 알 필요가 있는데요.생명 주기란 컴포넌트가 활성화 되는 기간, 즉 컴포넌트의 생성(create) - 수정(update) - 종료(delete)를 포괄한 개념인데요.(자료 출처 : ht

useState와 useRef는 리액트에서 컴포넌트 내부의 상태값을 저장하는 변수로 사용된다는대에 동일점을 가지고 있습니다. 하지만 이러한 동일점을 가지고 있어도 그 쓰임새가 다른 만큼 useState를 두고 굳이 useRef가 만들어지지 않았겠죠?useRef가 use

일단 개념은 검색을 해보면 알 다음과 같습니다. 복잡한 상태 전이를 단순화하고, 여러 상태값을 일관성 있게 관리할 때 유용합니다. useReducer는 리듀서 패턴을 사용하여 상태 전이 로직을 관리합니다.여기서 주요 특징을 살펴보자면 다음과 같이 설명할 수 있는데요.복

1. useMemo란?

리액트에서는 기본적으로 페이지의 특정 요소에 변화가 일어날 때 해당 부분만 렌더링이 되어 사용자에게 보여지는데요. 이때 특정 상태나 상황에 따라 렌더링을 시켜 사용자에게 보여지게 하거나, 그 반대로 보여지지 않게 할 수 있습니다. 이는 조건문과 같은 조건부 연산자를 활

우선 버블링부터 설명해 보자면, 버블링은 DOM 트리에서 이벤트가 발생했을 때, 그 이벤트가 발생한 특정 요소에서부터 상위 부모 요소로 전파되는 방식입니다. 즉, 가장 구체적인 요소(이벤트가 발생한 요소)에서부터 시작하여 점점 더 넓은 범위(부모, 조상 요소 등)로 이