[React] 컴포넌트(Component)란?

2024. 7. 21. 15:13・기초학습

컴포넌트(Component)

  • UI를 구성하는 독립적이고 재사용 가능한 코드 단위
  • 버튼, 입력 필드, 네비게이션 바

컴포넌트 특징

  • 재사용성: 동일한 컴포넌트를 여러 곳에서 재사용할 수 있어 코드의 중복을 줄임(DRY) 
  • 독립성: 각 컴포넌트를 독립적으로 개발하고 테스트할 수 있음
  • 컴포넌트는 내부 상태와 외부에서 전달받은 데이터를 통해 동작을 제어하고 UI를 렌더링 함
  • 컴포넌트는 생명주기를 가지며, 생성, 업데이트, 제거의 과정을 거친다

 

리액트 컴포넌트

  • 함수형: React Hooks를 사용하여 생명주기 메서드를 구현
  • 클래스형(ES6 클래스): `componentDidMount`, `componentDidUpdate` 같은 메서드를 사용




저작자표시 비영리 (새창열림)

'기초학습' 카테고리의 다른 글

[React] React Hook: useEffect()  (0) 2024.07.21
[React] JSX의 이스케이프 백(escape back)  (0) 2024.07.20
[React] 리액트 컴포넌트의 이벤트 핸들러  (0) 2024.07.20
[Network] URL  (0) 2024.07.18
[React] React Hook: useState()  (2) 2024.07.18
'기초학습' 카테고리의 다른 글
  • [React] React Hook: useEffect()
  • [React] JSX의 이스케이프 백(escape back)
  • [React] 리액트 컴포넌트의 이벤트 핸들러
  • [Network] URL
dev.hyejin
dev.hyejin
  • dev.hyejin
    혜진의 개발자 성장블로그
    dev.hyejin
  • 전체
    오늘
    어제
    • 분류 전체보기 (89)
      • 2024 데브캠프 (2)
      • 회고 (1)
      • 이슈해결 (3)
      • 기초학습 (13)
      • Frontend (20)
        • JavaScript (3)
        • Git, GitHub (3)
        • HTML, CSS (14)
      • Backend (8)
        • Database (4)
        • Java (4)
      • CS (16)
        • Network (10)
        • Algorithm (6)
      • Eng (16)
      • Tips (5)
  • 인기 글

  • 태그

    절대경로
    GitHub
    ER모델
    border-box
    런타임
    box-sizing
    상대경로
    객체
    점근성능
    시간복잡도
  • hELLO· Designed By정상우.v4.10.3
dev.hyejin
[React] 컴포넌트(Component)란?
상단으로

티스토리툴바