늘 겸손하게

React - 컴포넌트 기반 아키텍처 본문

Programming/React

React - 컴포넌트 기반 아키텍처

besforyou999 2023. 9. 13. 12:51

 

컴포넌트 기반 아키텍처

 

컴포넌트 기반 아키텍처는 큰 애플리케이션을 작은 재사용 가능한 조각으로 나누어 개발 및 유지 보수를 용이하게 만든다.

 

React는 JavaScript UI 라이브러리로 UI를 구축하기 위해 컴포넌트 기반 아키텍처를 제공한다. 

 

여기서 이야기 하는 컴포넌트 기반 아키텍처를 더 자세히 알아보자.

 

컴포넌트 기반 아키텍처를 알려면 먼저 컴포넌트가 무엇인지 알아야 한다.

 

 

React Component

 

React의 기본 구성 요소로 UI의 일부분을 정의하며, JavaScript 함수 또는 클래스로 작성된다. 컴포넌트는 props(속성) 및 state(상태)를 사용하여 동작을 정의하고 데이터를 표시한다.

 

각 컴포넌트는 독립적으로 작동할 수 있어 재사용성과 유지보수성이 뛰어난 장점이 있다.

 

이러한 컴포넌트를 기반으로 한 아키텍처를 컴포넌트 기반 아키텍처라고 이야기한다.

 

컴포넌트 기반 아키텍처를 통해 코드를 모듈화 할 수 있다. 여기서 모듈화의 의미를 알아보자.

 

 

모듈화

 

모듈화는 코드를 모듈이라고 불리는 작은 독립적인 부분으로 나누고, 각 모듈이 특정 기능이나 역할을 수행하도록 설계하는 프로그래밍 개념을 나타낸다. 이 개념은 소프트웨어의 가독성, 유지 보수성, 확장성을 향상시키고 모드를 더 쉽게 관리할 수 있도록 도와준다.

 

모듈화의 핵심 아이디어는

 

1. 독립성 

  • 각 모듈은 다른 모듈과 독립적으로 작동
  • 모듈 간 의존성 최소화하여 유지 보수성을 높임

 

2. 재사용성

  • 비슷한 기능이 필요한 곳에 재사용

 

3. 유지 보수성

  • 특정 모듈의 수정이 다른 모듈에 영향을 주지 않아 유지 보수가 더 쉽다.

 

4. 가독성

  • 코드 가독성이 높아져 프로젝트 구조를 이해하기 쉬워진다.

 

 

마무리

 

 

React의 컴포넌트 기반 아키텍처를 통해 가독성이 좋고 유지 보수성과 재사용성이 뛰어난 코드를 작성할 수 있다.