리액트는 페이스북에서 개발하고 관리하는 UI 라이브러리다.
React?
React는 javascript를 이용하여 만들어진 프론트엔드 라이브러리이며, 페이스북에서 유지보수하여 계속해서 새로운 기능들이 업데이트 되어지고 있다.
또한 현재 많은 기업에서 사용되는 만큼 거대한 생태계를 자랑하며, 그만큼 커뮤니티 또한 잘 형성되어 있다.
React의 특징
Virtual DOM
React는 가상 돔(Virtual DOM)을 사용한다.
리액트에서 어떠한 상호작용이 발생하여 상태값의 변화가 일어난다면, 가상 돔에서 렌더링을 한 후, 기존의 돔과 비교하여 바뀐 부분만을 찾아 바꿔, 기존 브라우저에서의 DOM에 대한 불필요한 처리를 줄여 빠르게 UI를 변경해주는 장점을 가지고 있다.
컴포넌트 기반 라이브러리
리액트는 작은 컴포넌트들을 하나의 컴포넌트로 묶어 관리할 수 있다.
라액트를 기반으로 개발을 할 때, 하나의 컴포넌트에서 문제가 생기면 그 컴포넌트만 수정하면 된다.
이러한 특징은 각각의 컴포넌트의 재사용과 유지보수에 있어서 큰 장점으로 다가온다.
One Way Data Flow
리액트는 데이터가 하향으로만 움직이기 때문에, 일반적으로는 부모 컴포넌트의 상태를 바꾸지 못한다.
자식 컴포넌트가 부모 컴포넌트의 상태를 바꾸기 위해선 Props와State에 대한 이해가 필요하다.
Props: 부모 컴포넌트에서 자식 컴포넌트로 내려오는 데이터
State: 사용자와의 상호작용을 통해 바뀌는 동적인 데이터의 상태값컴포넌트들의 각 State값은 독립적인 데이터로 다른 컴포넌트에서 직접 접근할 수 없다.
하지만 상위 컴포넌트의 상태값을 바꾸는 함수를 Props로 받으면 그 컴포넌트의 상태값을 변경할 수 있게된다.
'라이브러리'
리액트는 Angular.js처럼 하나의 큰 프레임워크가 아닌 UI라이브러리일 뿐이다.
실제로 앵귤러는 웹을 만드는데 필요한 도구들이 기본적으로 제공이 되는 반면 리액트는 view에 대한 기능을 제외한 다른 프레임워크에선 기본적인 기능들을 기본적으로 제공하지 않는다.
무거운 프레임워크들과 달리 한없이 가볍게 시작하는 것으로 인해 최적의 개발환경을 위해 필요한 것들을 개발자 마음가는 데로 맞출 수 있게 된다.
이걸 반대로 말하면 view외 모든 기능을 개발자가 구현해야 하기 때문에 자바스크립트에 충분히 숙달되어야 개발환경 구축에 있어서 이점을 얻을 수 있을 것이다.
