본문 바로가기

React

React를 해야 하는 이유, 특징 및 장단점

React란?

React는 전 세계적으로 가장 많이 사용되고 있는 프론트엔드 프레임워크 중의 하나로 Facebook에서 개발한 JavaScript 라이브러리로서, 웹 개발에서 UI(User Interface)를 만들기 위한 도구이다. React는 다른 프레임워크와는 다르게, Virtual DOM 기술을 이용해 UI를 구성하고, 이벤트 처리 및 상태 관리를 위한 강력한 도구들을 제공한다. 

 

React의 특징

1. Virtual DOM : DOM은 문서 객체 모델(Document Oject Model)의 약자로 쉽게 설명하자면  XML이나 HTML 문서에 접근하기 위한 일종의 인터페이스이다. React는 UI를 가상의 DOM으로 만들어 놓고 변경된 부분만 실제 DOM에 반영한다. 이는 React를 설명하는데 가장 중요한 특징이며 이는 React에게 가장 중요한 장점과 단점을 가지게 만들었다.

 

2. Component-Based : 컴포넌트란 UI를 구성하는 최소 단위를 나타내는데, 이러한 컴포넌트 기반은 React 뿐만 아니라 많은 프론트엔드 프레임워크의 특징이기도 하다. 자주사용되는 요소들을 미리 컴포넌트로 만들어 놓고 사용함으로써 코드의 재사용성을 높이고 유지보수성을 높일 수 있다.

 

3. Unidirectional Data Flow : React는 단방향 데이터 흐름을 채택하고 있어서 상태 관리를 보다 효과적으로 하고 있다.

 

4. JSX : JSX는 javascript 문법의 확장판 같은 성격으로 React는 이 JSX를 사용하여 HTML과 비슷한 구문으로 UI를 작성 할 수 있다. 이로인해 보다 가독성이 높은 코드를 작성 할 수 있게 한다.

 

 

React의 장점

1. 높은 점유율에서 오는 커뮤니티와 문서의 다양성

react는 현재 가장 높은 수의 점유율을 자랑하고 있고 이로인해 파생되는 문서의 수가 가장 많고 다양한 개발자도구나 참고할 수 있는 테스트 라이브러리 등 다양한 생태계를 갖추고있다. 이는 다양한 프로젝트를 진행해 나가야 하는 개발자에게 가장 큰 이점이 아닐까 한다.

 

2. 빠른 랜더링 속도

React는 Virtual DOM을 활용하여 실제로 업데이트된 부분만 리렌더링을 할 수 있게 됬다. 이로인해 불필요한 렌더링을 최소화 하고 사이트의 성능을 향상시키므로 인해 사용자에게 보다 쾌적한 사용자 경험을 제공 할 수 있게 한다.

 

3. 높은 생산성

이는 컴포넌트 기반의 프레임워크의 가장 큰 장점으로 자주 사용하는 컴포넌트를 미리 만들고 제공함으로써 코드의 재사용성과 유지모수성을 높일 수 있기 때문에 개발자의 생산성을 극대화 할 수 있다.

 

4. react native 의 존재

react native는 react 기반으로 된 모바일 환경의 개발을 할 수 있게 해주는 라이브러리다. 별도의 코틀린이나 IOS의 스위프트의 코딩없이 기본적인 앱의 경우 react의 구문과 javascript를 통해 안드로이드와 IOS를 동시에 개발 할 수 있는데 이는 처음 앱개발을 하려는 사람에게는 진입장벽을 낮출 수 있는 훌륭한 도구가 된다

 

 

 

React의 단점

1. 러닝 커브

리엑트는 개발을 하기 위해서는 JSX를 익혀야 하기 때문에 처음 시작 할 때 부터 난이도가 높은 편이며 react 특유의 상태관리 라이브러리(redux나 recoil 같은)가 필수이기 때문에 처음 진입하는 개발자에게는 배우기 위해 소요되는 시간이 높은 편이다.

 

2. SEO(검색엔진 최적화) 문제

react는 기본적으로 SPA(single page Application)로 웹을 만드는 라이브러리이다. SPA는 랜더링 이전에 빈 HTML파일을 가지고 있으므로 검색엔진에 최적화 되기에는 많은 어려움이 따른다. 이에대한 해결방법(SSR, meta-tag 등)이 없는것은 아니나 이러한 문제는 결국 러닝커브를 증가시키는 악순화으로 이어지기도 한다.

 

3. 최초 페이지 로딩 속도 문제

SPA에서 보여지는 또다른 치명적인 문제 하나는 처음 페이지가 시작할 때 정적인 리소스를 한번에 다운로드 하기 때문데 초기 구동 속도가 느려 질 수 밖에없다. 이는 페이지 사용자에게 매우 안좋은 경험을 재공하고 페이지에 들어오기도 전에 이탈하게 되는 포인트를 제공 하게 된다.

 

 

React를 해야만 하는 이유

비록 react가 장단점이 분명한 프레임워크 임에도 불구하고 현재 react는 가지고 있는 생태계를 기반으로 단점들을 극복해 나가고 있다. SEO문제는 Next.js등을 통해 해결하고 있고 상태관리 어려움의 경우도 Recoil등의 라이브러리 등을 통해 점점 해결 해 나가고 있다. 이러한 발전을 통해 React는 점점 단점을 극복해 나가고 있으며 시장 점유율을 높여가고 있다. 앞으로 다양한 프로젝트를 진행해 나가야하는 개발자에게 있어서 이러한 React 개발 스택은 중요한 무기중 하나가 되지 않을까 한다.