🌌 React 입문 Ⅰ - 개요

📘 『소플의 처음 만난 리액트』를 읽고 정리한 글입니다.

React란?

• 대표적인 자바스크립트 UI 라이브러리로, 사용자와 서버 사이에서 상호 작용을 도와준다.
• React는 프레임워크가 아닌 라이브러리이므로 흐름의 제어 권한이 React가 아닌 사용자에게 있다.
• SPA 기반의 React는 하나의 페이지만 존재하며, 사용자가 특정 페이지를 요청할 때 페이지 내용을 새롭게 렌더링해서 보여준다.
• 위에서 언급한 SPA는 Single Page Application의 약어다.

React를 공부하게 된 이유

나는 지금까지 JSP와 JQuery를 통해 프론트엔드 영역을 구현해 왔다. 이번에 토이 프로젝트로 REST API 서버를 개발하며 프론트엔드 영역이 CSR일 경우 어떻게 요청을 주고 받는지, 어떤 데이터를 어떻게 응답해야 프론트엔드 영역에서 가공해서 렌더링 하기에 용이한지 공부하고 싶었다. Vue.js보다는 React 참고할 수 있는 정보가 많을 것 같아서 React를 도입하기로 결정했다.

React의 강점

• Virtual DOM을 사용하므로 렌더링 속도가 빠르다.
• 사용자가 페이지를 요청할 때마다 페이지의 모든 부분을 수정해서 렌더링 하지 않고 업데이트해야 할 최소한의 부분만 업데이트한다.
• 컴포넌트 기반 구조를 통해 재사용성을 꾀할 수 있다.
• Meta라는 큰 스폰서와 함께, React 개발자가 많아 커뮤니티에서 활발한 지식 공유가 가능하다.
• React를 공부한 이후에는 React Native와 Javascript를 통해 모바일 애플리케이션을 개발할 수 있다.
• 네이티브 애플리케이션보다는 성능이 조금 부족하지만 간단한 수준의 애플리케이션은 사용자가 차이를 느끼지 못할 정도로 미미하다.

React를 도입할 때 고려할 점

• 지속적인 버전 업데이트로 인해 새로운 내용들이 꾸준히 등장하므로 공부해야 할 영역이 방대하다.
• 렌더링 속도가 빠른 대신 Component의 state를 관리해야 한다.
• Component의 개수가 많아지면 상태 관리의 복잡도가 급격히 증가한다.

회고

• 상태 관리가 복잡하다는 React의 단점으로 인해 큰 규모의 프로젝트에서는 Redux 등의 외부 상태 관리 라이브러리를 사용하는 경우가 많다고 한다.
• 백엔드 개발자를 목표로 바라보고 있더라도 React를 공부하는 것은 개발자 인생을 장기적으로 보았을 때 도움이 될 것이라고 기대하고 있다.