React를 사용하는 이유

시작하기 앞서

여러 회사에 인턴쉽을 준비하면서 부족한 점을 여럿 느꼈다. 그중에서 가장 큰 것이 개인적으로 진행해본 제대로 된 토이 프로젝트가 한 개도 없다는 것이었다. 나름 관련 전공으로 대학교도 3학년까지 마쳤고, 국내 스타트업에서 인턴을 진행해본 경험도 있지만 내 스스로 흥미를 가지고 무엇인가를 개발해본 적은 없었던 것 같다. 그저 막연히 풀스택 엔지니어가 되고 싶다는 생각만 가지고 있었고, 관련 지식은 가지고 있지도 가질 생각도 하지 않은 상태라 많은 반성을 했다.

그래도 이번 계기를 귀감으로 삼아 혼자서 스스로 웹 서비스를 하나 만들어 보려고 한다. 목표는 요즘 많은 관심을 가지고 있는 "동기부여" 관련 커뮤니티 사이트를 만드는 것이다. 개발을 진행하면서 github 관리도 조금씩 하고, 고민하는 점들을 블로그에 조금씩 포스팅하면 도움이 되지 않을까 싶어 이렇게 글을 적게 되었다.

현재 가지고 있는 생각으로는 Front-end는 React.js, Back-end는 Node.js, DB는 MongoDB를 사용해보려고 한다. 최종적으로 배포는 AWS를 활용하는 것이 목표다.

하지만, 나는 React를 사용해본 경험이 전무했기 때문에 React를 새로 습득해야만 했다. 그렇지만 이전까지 HTML, CSS, Vanilla JS만으로도 충분히 UI를 잘 만들어왔던 내게 사람들이 왜 그렇게 React를 많이 사용하는지 이해가 되지 않았다. 그래서 이번 포스팅을 통해 왜 사람들이 React를 사용하고, React를 사용하면 어떤 점에서 이득을 얻을 수 있는지 정리해보려고 한다.

React란?

React 공식 웹사이트에 따르면 "React는 사용자 인터페이스(UI)를 만들기 위한 Javascript 라이브러리"라고 나와있다. 라이브러리이기 때문에 내가 컨트롤을 가지고 React를 활용하는 것이라고 볼 수 있는데, 관점에 따라 React를 Framework라고 보기도 한다고 한다. 여기서 든 의문점은 왜 HTML이나 CSS 그리고 Vanilla JS를 활용해서도 원하는 디자인과 기능을 구현할 수 있는데 도대체 왜 Front-end Framework를 사용해야 하는 가? 였다.

Front-end Framework를 사용하는 이유

내가 처음 NodeJS를 공부했을 때 책에 나와있던 실습 예제의 UI는 모두 간단한 HTML, CSS, JS로 구현되어 있었고 이것들 만으로도 사용자 로그인이나 인증과도 같은 복잡한 기능을 구현할 수 있었다. 그리고 처음으로 React를 할 줄 아는 친구와 같이 간단한 웹 서비스를 개발하고자 했을 때도(물론 중간에 포기했다.) React와 Express 간의 서로 다른 port 번호 때문에 proxy를 활용하는 등 이런 복잡성 때문에 Front-end Framework에 대한 의구심은 더욱 커져만 갔다.

내가 참고한 Do We Really Need a Front-end Framework? 의 작성자는 나와 비슷한 의구심을 품었고 그에 대한 해답으로 다음과 같은 결론을 지었다.

The choice of a front-end technology doesn’t depend on the features you want to provide to your user, but on the user experience you want him/her to have

결과적으로 기능적인 측면에서는 굳이 Framework를 사용하지 않아도 되지만, Framework를 사용하는 것이 User Experience(UX)를 향상하기 때문에 Framework를 사용한다는 것이었다. 물론 Framework를 사용할 때 개발을 더욱 편리하게 해주는 기능이 많은 것도 사실이다. 이런 UX적인 효율성은 React 공식 홈페이지에도 나와있다.

React는 상호작용이 많은 UI를 만들 때 생기는 어려움을 줄여줍니다. 애플리케이션의 각 상태에 대한 간단한 뷰만 설계하세요. 그럼 React는 데이터가 변경됨에 따라 적절한 컴포넌트만 효율적으로 갱신하고 렌더링 합니다.

선언형 뷰는 코드를 예측 가능하고 디버그하기 쉽게 만들어 줍니다.

즉 React를 사용할 경우 사용자 입장에서 데이터가 변할 때 페이지 리로딩이 일어나지 않기 때문에 UX가 더욱 향상되고 그 때문에 많은 사이트들이 React를 사용하는 것이었다.

또한, 개발자 입장에서도 컴포넌트 기반의 React를 사용할 경우 코드의 가독성과 재사용성 그리고 유지보수가 편해지기 때문에 React를 사용하는 점도 있다.