페이스북에서 만든 자바스크립트 라이브러리 중 하나로 페이스북 내부에서 이용되고 있을 뿐 아니라 에어비앤비, 우버, 넷플릭스, 인스타그램 등 많은 웹 어플리케이션이 리액트로 개발되어졌다.
리액트는 유저 인터페이스를 만들 수 있게 도와주는 라이브러리로써, 사용자에게 보여지는 UI를 만들고, 그 위에서 사용자가 발생시키는 이벤트를 처리할 수 있게 도와주는 라이브러리이다.
복잡한 웹 어플리케이션 서비스를 만들때는 보통 MVC(Model – View – Controller)패턴을 많이 이용하는데, React 는 이중에서 ‘View’ 레이어를 담당한다.
Framework 와의 차이
웹 어플리케이션 제자글 집 짓는 것으로 비유해보면, Frameworks 는 이미 집의 구조나 철제들이 완성된 상태의 완성품이다. 그래서 Framework 에서는 벽돌의 색깔을 바꾸거나 집안의 가구를 재배치하는 등의 제한적인 일만 가능하다.
반대로 라이브러리는 집을 짓게 도와주는 하나 하나의 부속품으로 볼 수 있다.
프레임워크의 대표적인 예는 Angular 를 꼽을 수 있다. Angular는 UI 뿐만 아니라, 라우팅, state 관리, HTTP clients 등 굉장히 다양한 기능들이 한번에 묶어져서 제공된다. 그래서 앵귤러를 이용해서 웹 어플리케이션을 만드려면, 앵귤러에서 제공하는 기능을 사용해서 만들어야한다.
한가지 더 예로, 안드로이드나 ios에서 동작하는 모바일 어플리케이션을 만드려면 각각의 운영체제에서 제공하는 프레임워크 위에서 어플리케이션을 만들어야한다.
이처럼 프레임워크는 정해진 골격 안에서 원하는 기능을 구현해야하는 반면, 라이브러리는 UI를 관리하는 라이브러리, 라우팅을 관리하는 라이브러리, 스테이트를 관리할 수 있는 라이브러리 등 프레임워크와는 다르게 따로 정해진 골격이 없기 때문에 원하는 구조의 집을 만들 수 있고, 필요한 기능에 따라 라이브러리를 골라서 사용할 수 있다.
많은 라이브러리중 React는 UI를 만드는 라이브러리이다.
Vuejs는 엄밀히 말하면 Frameworks 에 속하지만, Angular 만큼 제공하는 기능이 많지 않다. state 관리 , http client 가 포함되어 있지 않기 때문에 프레임워크와 라이브러리 그 중간 정도…에 속한다고 보면 될 것 같다.
Angular vs React
Angular 는 배우는데 시간이 굉장히 오래 걸린다. 하나의 웹 어플리케이션을 배우기 위해 배워야하는 스텝들이 굉장히 많다. 하나의 일례로, Angular2 프레임워크가 나왔을때 기존 Angular1 프레임워크로 개발된 웹 어플리케이션과 호환이 되지 않았고, 문법 / 처리 방법등이 기존 앵귤러 1과는 전혀 다른 새로운 프레임워크처럼 동작해 다시 공부하고 적용하는 과정들때문에 많은 개발자들이 등을 돌렸다.
반면에 React는 간단하기 때문에 러닝 시간이 상대적으로 짧다. 또한 버전이 업그레이드 되더라도 이전 버전과 잘 호환이 되도록 안정성있게 업데이트 되기때문에 신뢰할 수 있다. 또 강력한 커뮤니티가 형성되어있기때문에 문서화가 잘 되어있고, React를 이용하면 웹 어플리케이션 제작 / React Native 를 이용한 모바일 어플리케이션 제작 / React + Electron 을 이용한 데스크탑 어플리케이션도 만들 수 있다.
상기 그림에서 React의 인기를 알 수 있다 :))
