Vue 2 첫 프로젝트 회고

지난주 완료한 내부 툴 프론트엔드. Vue 2 (아직 RC) 써서 만듦. 첫 프로젝트 회고.

회사는 React 위주였는데, 이 프로젝트는 소규모 admin 툴이라 러닝커브 낮은 Vue 써봄. 진입 난이도가 놀랄만큼 낮았다. template / script / style 세 블록 구조가 직관적임.

<template>
  <div>
    <input v-model="q" @keyup.enter="search"/>
    <ul>
      <li v-for="item in results" :key="item.id">{{ item.name }}</li>
    </ul>
  </div>
</template>

<script>
export default {
  data() { return { q: '', results: [] }; },
  methods: {
    search() {
      fetch('/api/items?q=' + this.q)
        .then(r => r.json())
        .then(data => { this.results = data; });
    }
  }
};
</script>

좋았던 점:

• single file component (.vue) 가 너무 깔끔. JSX보다 읽기 편함
• v-model로 양방향 바인딩 — 폼 처리가 진짜 짧아짐
• Vuex 도입하면 Redux보다 boilerplate 적음. mutations / actions 구조가 단순
• vue-cli 기본 webpack 템플릿이 잘 세팅되어 있음

아쉬운 점:

• TypeScript 지원 아직 약함. 타입 안 쓰는 환경이면 문제 없지만 앞으로 갈지 고민
• 커뮤니티 크기 React 대비 작음. 특정 문제 검색할때 영어 자료가 많지 않음 (그치만 중국어는 엄청 많다)
• Vue 2 RC라 라이브러리들이 1.x 위주인 경우 있음. vue-router, vuex는 이미 2.x 대응됨

admin처럼 러닝커브 낮아야 하는 팀 내부 툴에 굉장히 잘 맞는다. 본 프로젝트(고객대면 프로덕트)는 React 유지할 듯. 팀 스택 일관성도 중요하니까. 개인 프로젝트엔 계속 Vue 쓸 예정.