[TIL] 24_0117 React? 아키텍처?

TIL

잇츄미 2024. 1. 16. 21:13

- 리액트는 javascript 라이브러리야. UI(User Interface)를 구축하기 위해 만들어졌어.

- UI를 Building한다는 건 웹 또는 앱어플리케이션의 보여지는 부분을 구축한다는 거야.

React자체적으로는 라이브러리로 분류되어있어. 하지만 일부 사람들은 React는 단순한 라이브러리가 아닌 프레임워크라고 간주하기도 해. 그 이유로는 세 가지의 프레임워크적인 특징을 가지고 있다고 볼 수 있어서야.

1. 컴포넌트 기반 아키텍처를 가지고 있어.(컴포넌트 기반)

- 이를 통해서 애플리케이션을 작은 다위롤 분할하고 재사용할 수 있게 해.

*아키텍처

- 크게 빌딩을 짓는 시공과 비슷한 개념이야.

- 여러 조각이 합쳐져서 하나의 건물을 만들어 내는 과정이라고 생각하면 돼. 소프트웨어도 마찬가지로 여러 조각(컴포넌트)이 합쳐져서 하나의 애플리케이션을 만들어 내는 거야.

2. React는 상태를 효율적으로 관리할 수 있는 기능을 제공해. (상태 관리)

- React의 상태 관리 라이브러리인 Redux나 MobX와 함께 사용하면 애플리케이션의 상태 관리를 더욱 용이하게 할 수 있어.

3. React의 공식 라우팅 라이브러리인 React Router를 사용하면 싱글 페이지 애플리케이션(SPA)에서의 라우팅을 쉽게 구현할 수 있어. (라우팅 기능)

4. React는 많은 생태계와 커뮤니티를 가지고 있어.(생태계)

- 다양한 도구, 라이브러리, 프레임워크 등이 React와 함께 사용돼. 이런 것들과 같이 작동하면 개발 생산성이 높아져.

- React.js 란 용어는 React를 Javascript로 사용할 때 일반적으로 사용되는 표현이야.

- React와 React.js는 동일한 기술인데 Javascript환경에서 사용한 다는 걸 나타내.

리액트의 가상 돔(Virtual DOM)과 컴포넌트 기반 아키텍처는 개발자들에게 많은 영향을 주고 있고, 리액트 생태계에서는 이런 아키텍처를 지원하는 다양한 패키지들이 개발되고 있어. 리액트를 사용하는 개발자들은 리액트를 기반으로 한 프레임워크처럼 사용할 수 있어.

예를 들면, Redux(상태 관리 라이브러리), MobX(간편한 상태 관리), React Router(라우팅 패키지), Next.js(서버 사이드 렌더링), GraphQL(데이터 쿼리 언어) 등이 리액트 생태계에서의 다양한 패키지들이양.

*참고 : AI, 강의