프론트엔드 프레임워크 VueJS 시작하기

요즘 인기가 많은 프론트엔드 프레임워크 'VueJS'를 시작하는 방법을 정리해 보려고 한다. 이어서 현재 개발하고 있는 프레임워크에 어떻게 적용하고 있는지 정리해 보려고 한다.

나의 배경지식에 대해서 요약하자면 C언어로 문제를 푸는 것으로 컴퓨터 공부를 시작했고 시커먼 화면이 싫어서 프론트엔드 개발을 시작하기로 마음먹었다.

HTML/CSS/Javascript는 기본 책을 2권씩 정도 읽었고 그 뒤로 개인 블로그를 만들 정도로 공부했다. 그 뒤로는 리엑트를 잠시 공부하려고 하다가 ES6, redux를 조금 공부하다가 때려치우고(...) 현재 스타트업에서 VueJS를 처음 공부하고 개발한지 4달정도 되었다. 이 글은 기본적인 HTML/CSS/Javascript를 이해하고 커맨드 라인과는 그리 친하지 않은 분께 알맞다.

VueJS를 처음 본 느낌은 '이쁘다!' 였다.

리엑트와는 다르게 공식 홈페이지가 굉장히 이쁘고 잘 정리되어 있었다. 처음 공부할 때 딱히 책을 사거나 그러진 않았고 (사실 책도 나온 게 몇권 없기도 했다) 우선 예제를 따라하는 것부터 시작했다. 재미있었던 것은 공식 홈페이지에 아예 뷰와 리엑트, 앵귤러와의 비교해서 좋은 점을 설명해준다는 것이다.

모두가 알다시피 새로운 걸 배우는 것의 거의 80%는 개발환경을 설치하는 일이다.

설치하는 방법은 https://nodejs.org/ko/download/package-manager/에 있다.

내 도커파일은 이랬다.

RUN curl -sL https://deb.nodesource.com/setup_7.x | bash -
RUN apt-get install -y nodejs

쓰고자 하는 노드 버젼을 잘 마음을 먹자. 대충 6,7,8 있다구 생각하고 눈을 딱 감고 고르자. 물론 높을수록 최신버전이다 처음 개발을 할 때는 대단한 차이는 없을 것 같다.