React란?

React

: Facebook(현재 Meta)에서 개발한 JavaScript 라이브러리로, 사용자 인터페이스(UI)를 구축하는 데 사용됩니다. React는 컴포넌트 기반 아키텍처를 채택하고 있으며, 동적인 사용자 인터페이스를 효율적으로 생성하고 관리할 수 있도록 설계되었습니다.

 

---

주요 특징

1. 컴포넌트 기반(Component-Based):
   • React 애플리케이션은 작은 독립적인 컴포넌트들로 구성됩니다.
   • 각각의 컴포넌트는 재사용 가능하며, 애플리케이션의 UI를 캡슐화합니다.
   • 예: 버튼, 폼, 리스트 등.
2. 단방향 데이터 흐름(Unidirectional Data Flow):
   • React의 데이터는 부모 컴포넌트에서 자식 컴포넌트로 전달됩니다.
   • 데이터 흐름이 명확하여 애플리케이션 상태 관리가 쉬워집니다.
3. 가상 DOM(Virtual DOM):
   • React는 실제 DOM 대신 가상 DOM을 사용하여 변경 사항을 먼저 시뮬레이션하고, 필요한 부분만 업데이트합니다.
   • 이를 통해 성능이 향상됩니다.
4. JSX (JavaScript XML):
   • HTML과 유사한 문법을 사용하여 UI를 정의할 수 있습니다.
   • JavaScript와 HTML을 결합한 형태로, 직관적이고 생산성이 높습니다.
5. React 상태 및 생명주기(State and Lifecycle):
   • 컴포넌트의 동적인 데이터를 상태(state)로 관리합니다.
   • 컴포넌트가 생성되고, 업데이트되며, 제거되는 과정에서 특정 동작을 수행할 수 있습니다.
6. 확장 가능성 및 생태계:
   • React는 상태 관리를 위한 Redux, MobX, Zustand와 같은 라이브러리와 잘 통합됩니다.
   • React Router를 사용하면 SPA(Single Page Application) 내에서 라우팅을 쉽게 설정할 수 있습니다.

---

React의 장점

1. 재사용 가능한 컴포넌트:
   • 컴포넌트를 작성하고 재사용함으로써 코드의 중복을 줄이고 유지보수성을 높입니다.
2. 빠른 성능:
   • 가상 DOM을 사용하여 최소한의 DOM 조작만 수행하므로 성능이 우수합니다.
3. 대규모 생태계:
   • 다양한 라이브러리 및 도구와의 통합이 쉽고, 방대한 커뮤니티가 지원합니다.
4. SEO 친화적:
   • 서버 사이드 렌더링(SSR)을 지원하여 SEO 문제를 해결할 수 있습니다. (예: Next.js와 같은 프레임워크)

---

React의 단점

1. 학습 곡선:
   • JSX, Virtual DOM, 상태 관리 등을 배우는 데 시간이 필요합니다.
2. 빠른 변화:
   • React와 관련된 생태계가 빠르게 변화하기 때문에 최신 트렌드를 따라가야 합니다.
3. 라이브러리 의존성:
   • React는 UI 라이브러리이기 때문에 상태 관리, 라우팅 등을 별도로 설정해야 합니다.