[ React ] [Chapter 1] React 란

React의 탄생 배경

지속해서 데이터가 변화하는 대규모 애플리케이션을 구축하기 위해 리액트를 만들었다.

2006년 John Resig가 Jquery를 발표한 이후, 순신간에 웹을 사로잡았다. Jquery가 Dom을 다루는 방식은 지금까지도 가장 효율적인 방식으로 인정받고 있고, 오랜 세월동안 사실상의 표준이기도 하다. 그러다가 Backbone와 AngulerJS를 위시한 SPA(Single Page Application)이 보다 구조화된 프론트엔드 환경을 제시하기 시작했다. 그런데도 Jquery는 많이들 사용 했다 이들 또 한 Jquery를 사용하기도 했기 때문

이 때 등장한게 React이다 React는 페이스북에서 만든 Javascript 라이브러리 이다.

React의 Virtual Dom

대부분의 웹들이 그러하든 MVC, MVVM, MVW등 이러한 패턴들을 사용 했다. 이러한 패턴들의 공통점이 있다.공통점은 Model이며, 이 모델에 변화가 이루워 지면 View에 보여줘야 하는 한다. 변화가 이루워 지면 모델은 변경이 될거고 그 변경된 모델을 뷰에 보여줘야한다.그런데 React에는 이 발상을 파괴 했다 변화를 하지말고 그 대신에 데이터가 바뀌면 그냥 뷰를 날려버리고 새로 만드는 방식으로 개발을 시작했다.그런데 이러한 방법론으로 접근을 하니 브라우져가 못버티는 상황이 오게된것이다.그래서 존재하는게 바로 Virtual DOM 이다. Vritual DOM은 즉 가상의 DOM이다.Virtual DOM은 변화가 이루어지면 브라우져의 DOM에 새로운것을 넣는것이 아니라 javascript 으로 이루어진 가상의 돔에 한번 랜더링을 하고 변화가 이루어진 DOM에 기존과 비교를 하고 정말 변화가 필요한 DOM을 업데이트 하는것이다.

---

예)

예를 들어 회원정보를 보여주는 페이지가 있다고 하자. 회원정보는 이름 나이 주소가 있다. 해당 정보를 보여주는 뷰가 있다. 해당 정보중 주소가 변경 되었다고 하자. 그럼 기존의 뷰일 경우에는 새로운 랜더링을 했을 것이다.

하지만 Virtual DOM은 처음 가상의 돔에 랜더링을 하고 주소가 변경 되면 기존의 DOM과 주소가 변경된 DOM를 비교해 주소의 DOM을 업데이트 시키는 방식이다.

---

React를 왜써?

그럼 왜 리액트를 왜 쓰나?

Virtual DOM때문에 높은 성능을 낼 수 있다. 그렇다면 리액트에서만 VirtualDOM을 쓸까? 그건 아니다 하지만 리액트가 선두주자이다.

일단 리액트를 사용하는 곳이 많기도 하고(BBC,Yahoo,Twitch,Cloudflare등등), 아주 유명한 페이스북을 만든 라이브러리이기도 하다. 그렇다보니 배워두면 좋다. 핫한 라이브러리를 알면 당연 좋은거 아니겠는가? 핫하지 않는 라이브러리를 아는것 보다 많이들 쓰는 라이브러리를 아는게 좋다고 나는 생각한다.

그리고 엄청나게 큰 생태계가 장점이 된다. 이게 왜 장점이냐고?

일단 리액트는 페이스북에서 만든 라이브러리이기 때문에 유지보수를 소홀히 될리가 없다. 그에 따라 많은 개발자들이 리액트를 활용한 다양한 라이브러리를 개발해 많은 배포를 했다. 또한 신기능들도 많이 업데이트 되고 있기도 하고, 해서 이게 장점이 된다

관련 글

저의 글을 읽어 주셔서 감사합니다. 오늘도 즐거운 하루 보내세요.

저의 글이 조금이나마 도움이 되셨다면 로그인이 필요 없는 공감♥ 한번 꾸욱 눌러주세요 하하~