React 핵심 개념: 컴포넌트, JSX, Hook!
by DD
6년 전
조회수 12
React는 사용자 인터페이스를 위한 JavaScript 라이브러리이며, 컴포넌트 기반 구조를 가짐
JSX 문법을 통해 HTML과 로직을 통합하고, 선언형 프로그래밍 방식을 지원함
Hook을 활용하여 함수형 컴포넌트에서 상태 관리 및 로직 재사용성을 향상시킴
React의 핵심: 컴포넌트와 JSX
React는 컴포넌트 기반 아키텍처를 통해 UI를 구성한다. 구체적으로 JSX를 사용하여 HTML과 JavaScript 코드를 결합하여 개발 효율성을 높인다. 따라서 컴포넌트 재사용성을 높이고, UI 유지보수를 용이하게 한다.
선언형 프로그래밍과 State 관리
React는 선언형 프로그래밍 방식을 채택하여 UI를 구성한다. 따라서 State 변화에 따라 UI가 자동으로 업데이트된다. 반면 setState는 비동기적으로 동작하며, Reconciliation 과정을 통해 효율적인 렌더링을 수행한다.
Hook을 활용한 함수형 컴포넌트
React Hook은 함수형 컴포넌트에서 State 관리 및 부수 효과(side effect)를 처리한다. 구체적으로 useState와 useEffect를 사용하여 컴포넌트 로직을 간결하게 만든다. 결과적으로 코드 재사용성과 유지보수성을 향상시킨다.
