내가 React가 아닌 Vue.js를 선택한 이유

https://www.youtube.com/watch?v=cSH97mtk7MU

 

Vue.js는 사용자 인터페이스 개발을 위한 Progressive Framework라고 부른다. 여기서 사용자 인터페이스는 User Interface 즉, UI Framework라고 이해하는 편이 나을 것 같다.

내가 글을 쓰고 있는 현시점 프런트엔드 개발 자바스크립트 라이브러리 및 프레임워크 3 대장이라 불리는 Angluar, React, Vue 이 3개 언어 중 Vue.js를 선택한 이유는 단연 러닝 커브(Learning curve)가 낮기 때문이다. 당장 국비지원 학원을 수료하고 취업 전선에 뛰어들어야 했던 나였기에 시장에서 가장 많이 요구되는 React가 아닌 Vue를 선택한 이유도 지금 당장 내가 이해하고 받아들일 수 있는 언어가 무엇인지 파악해보았을 때, 순수 자바스크립트로 코딩을 해야 하는 React 보단 HTML, CSS, JavaScript 역할이 명확히 나뉘어 있는 Vue.js가 좀 더 내겐 맞았다.


그리고 난 초록색을 좋아한다.

아무튼, 내가 Vue.js를 선택한 이유는 이렇게 정리하는 걸로 하고 간단히 왜 JavaScript Framework를 사용해야 하는지 정리해보고자 한다.

---

SPA(Single Page Application)

https://sungjaecloud.tistory.com/288

React 01 - 리액트란 무엇인가?

SPA의 경우는 'React 01 - React란 무엇인가?'라는 나의 React 스터디 포스팅에 작성해놓았으나, 여기서도 다시 한번 설명을 해보고자 한다. SPA는 말 그대로 단일 페이지 애플리케이션이라는 뜻이다. 쉽게 풀어 설명하자면, 하나의 페이지에 다양한 내용이 동적으로 동작하는 애플리케이션이라고 이해하면 될 것 같다. 즉, 이미 만들어진 페이지를 내 입맛에 맞게 불러올 수 있다고 생각하면 된다. SPA의 장점은 페이지를 이동하면 웹 페이지 전체가 바뀌는 게 아니라, 로딩된 페이지 중에서 변경이 필요한 부분만 바꿔치기할 수 있다는 것이다. 그래서 이미 로딩된 자원을 다시 서버로부터 받아 올 필요가 없기 때문에 웹 자원을 굉장히 효율적으로 관리할 수 있다.

---

Vue.js의 장점

1. Vue.js의 장점은 위에서도 설명했듯이 러닝 커브(Learing curve)가 낮다는 것이다. 사실 React도 아주 조금 맛보기로 공부해 본 사람으로서 초보자 입장에서는 Angluar나 React나 Vue나 똑같이 어렵지만, 굳이 고르자면 아무래도 눈에 익은 코드를 많이 사용하는 Vue.js가 초보자들이 접근하기에 꽤 괜찮은 선택지라 생각한다.

2. Vue.js는 재사용을 통한 애플리케이션 개발 단축 및 양질의 코드를 생산할 수 있다. Component(컴포넌트)가 이에 해당된다. 코드를 재사용하여 내 입맛에 맞게 그때그때 불러와 생산성을 높일 수 있다.

3. Vue.js는 Angluar의 장점(데이터 바인딩)과 React의 장점(가상 DOM)을 모두 가지고 있다. 앞으로 Vue를 더 공부하면서 직접 코드를 작성하며 데이터 바인딩과 가성 DOM을 깊게 다뤄보겠지만, 간단히 훑어보자면 데이터 바인딩을 적용함으로써 그리고 양방향 데이터 바인딩까지 활용할 수 있게 되면서 어떤 데이터에 대해 변경이 일어났을 때 그 결과를 반영하기 위한 수많은 코드의 작성을 최소화시켜줄 수 있게 되었다.

이 밖에도 많은 장점이 있지만, 주니어 개발자인 내 역량에서 좀 더 자세하고 디테일하게 설명하자면 조금 더 시간이 필요한 것 같다. 나는 앞으로 다양한 Vue.js 서적과 인터넷 강의를 들으며 보고 배운 것들을 되도록 모두 정리하고자 한다. 그래서 모든 내용이 내가 스스로 익히고 알아낸 내용이 아닐 수 있지만, 그래도 조금이나마 정보를 찾아감에 있어 시간을 단축시킬 수 있는 올바른 블로그 주인장의 횡보를 걸어가고 싶다.