vue.js에서 컴포넌트를 사용해야 될때

vue.js의 핵심적인 기능중 하나가 바로 UI 컴포넌트화이다.

이를 통해 우리는 UI 협업 개발이 가능해지며, 재사용성까지 높아진다.

하지만 최근까지 vue.js를 사용해본 나는 몇몇 문제에 부딫혔다.

도대체 언제 컴포넌트를 사용해주면 되는 것과, 컴포넌트의 범위는 어디까지 정해놓고 개발해야 되는가 하는 문제이다.

아직까지 대형 앱 개발을 안 해서인지 컴포넌트를 사용할 일이 많지 않았다.

초반에는 그냥 모든 UI를 컴포넌트화 시켜서 사용하면 되지 않을까? 하고 주구장창 만들었었는데,

만들다가 이게 뭔 뻘짓인가 싶었다.

그래서 컴포넌트를 꼭 사용하는 이유에 대해서 찾기 시작했고,

두가지 결론에 이르렀다.

첫번째, 구조적인 웹페이지를 만들고 싶으면 컴포넌트를 사용해라.

페이지를 컴포넌트로 구조화 시킴으로써 사이트 협업 증진 및 재상용 그리고 업데이트까지 쉬워진다.

대형프로젝트를 할경우 컴포넌트 사용은 반드시 필요하다.

(애초에 vue cli에서 .vue라는 단일 컴포넌트 확장자를 지원해 주기에 쉽고 편하게 구조화된 페이지를 만들 수 있다.)

중요한 것은 구조에 핵심을 맞추어 컴포넌트화 시켜야 한다는 것이다.

나는 현재 bootstrap의 layout을 기준으로 컴포넌트를 구조화 하고 있다.

두번째, 반복되는 UI일 경우 컴포넌트화 시켜라.

이거는 너무 간단한 이야기이지만 많이 반복되는 동일 UI인 경우 컴포넌트 시키면 편하다.

물론 v-for등을 사용해도 된다. (난 솔직히 v-for을 추천한다.)