올해(2016년) 초 회사에서 새로운 웹페이지를 만들어야 했다. 새로운 프로젝트의 시작은 항상 설렌다. 가장 큰 이유는 레거시 시스템에서 벗어나서 마음껏 최신 기술 스택을 적용할 수 있기 때문이 아닐까?
그렇다면 요즘 핫하다는 SPA(single page application)를 경험해볼 수 있는 좋은 기회라고 생각했다. 서버는 주로 API 역할만 하고 클라이언트에서 나머지 모든 부분을 담당한다. SPA의 장점에 대해서는 구글 신이 있으므로 굳이 여기서 언급하진 않겠다.
일 년 전에 angularjs 튜토리얼을 따라 해 봤던 경험이 있어서 angularjs가 첫 후보였다. 하지만 그 당시 2.0으로 버전 앞자리가 바뀌는 시기였고, 아직도 beta 딱지(지금 이 글을 쓰고 있는 시점에는 정식 버전이 나왔다)를 달고 있었다. 더욱이 1.x 버전의 하위 호환성을 지원하지 못할 정도의 큰 변화였다. 만약 angularjs를 도입한다면 고생길이 활짝 열리는 것이었고, 나는 자연스럽게 react로 눈길을 돌렸다.
react와 angularjs 사이에는 많은 차이가 있지만 가장 큰 차이는 react는 라이브러리이고 angularjs는 프레임워크라는 점이다. react는 MVC패턴에서 View만을 책임지지만 angularjs는 모든 것을 품고 있다. 개인적으로는 이것이 react의 단점이라고 본다. react생태계에 수많은 라이브러리가 있지만 그중에서 필요한 라이브러리를 선택하는 시간과 노력이 만만치 않다. 다행스럽게도 최근에 create-react-app이라는 공식 앱이 나왔다. Webpack, Babel, ESLint 등과 같은 react 개발 시 꼭 필요한 라이브러리를 자동으로 포함시켜준다.
구글 트렌드로 비교해보면 react(파란색)가 빠르게 angularjs를 쫒아가다가 최근에는 추월한 것을 알 수 있다.
현재 react로 개발을 시작한 지 4개월이 넘었다. 처음에는 모르는 게 많아서 프로젝트 구조를 수도 없이 많이 바꿨지만, 지금은 어느 정도 안정화가 됐다. 백엔드는 장고를 사용 중이다. SPA 개발 시 프런트엔드의 javascript와 동형 구조로 가기 위해 백엔드로 node, express를 선택하는 경우가 많다. 그런데 장고를 선택한 이유는 내가 익숙해서다.
react로 개발하면서 알게 된 내용을 조금씩 블로그로 옮겨볼 계획이다.
