Vue 라이프사이클

-Creation, Mounting, Updating, Destruction 으로 나눌 수 있음.

Creation : 컴포넌트 초기화 단계
-컴포넌트 초기화단계.
-사이클 중에 가장먼저 실행됨.
-컴포넌트가 DOM에 추가되기전임, 따라서 this.$el을 사용할 수 없음.
-created 훅은 먼저 부모 created 훅이 실행되고 자식이 created 훅이 실행됨.
-beforeCreate 훅과 created 훅이 존재함.

Mounting : DOM 삽입단계
-초기 렌더링 직전에 컴포넌트에 직접 접근할 수 있음. 서버렌더링에서는 지원하지 않음.
-컴포넌트 초기에 셋팅되어야할 데이터는 created 훅 단계에서 사용하는게 좋음.
-beforeMount 훅은 템플릿과 렌더함수들이 컴파일된 후에 첫 렌더링이 일어나기 직전에 실행됨.
-mounted 훅은 컴포넌트, 템플릿, 렌더링된 돔에 접근 가능.
-mounted 훅에서 mounted 훅 순서는 자식 mounted 훅이 실행되고 부모 mounted 훅이 실행됨.
-beforeMount 훅과 mounted 훅이 존재함.

Updating : 재랜더링 단계
-컴포넌트에서 사용되는 반응형 속성들이 변경되거나 어떤 이유로 재 렌더링이되면 실행됨.
-디버깅이나 프로파일링 등을 위해 컴포넌트 재 랜더링 시점을 알고싶을 때 사용하면됨.
-서버렌더링에서는 호출되지 않음.
-beforeUpdate 훅은 컴포넌트의 데이터가 변하여 업데이트 사이클이 시작될때 실행됨.
-beforeUpdate 훅은 DOM이 재 렌더링되고 패치되기 직전에 실행됨.
-beforeUpdate 훅은 재 랜더링 전의 새 상태의 데이터를 얻을 수 있고 더 많은 변경이 가능함. 이변경은 재 랜더링은 트리거되지 않음.

-updated 훅은 데이터가 변하여 재 렌더링이 일어날 후에 실행됨.
-updated 훅은 여기서 상태를 변경하면 무한루프에 빠질 수 있음. 모든 자식컴포넌트의 재 랜더링 상태를 보장하지는 않음.

Destruction : 해제 단계

-beforeDestroy 훅은 해제 되기 직전에 호출됨.
-beforeDestroy 훅은 이벤트리스너 또는 reactive subscription을 제거하고 싶으면 여기서 하면 좋음. 서버렌더링시 호출안됨.
-destroyed 훅은 해제된 후에 호출됨.
-destroyed 훅은 모든 리스너 하위인스턴스도 제거 및 해제됨. 서버렌더링시 호출안됨.

-------------------------------------------------------------------------------------------------------------------

컴포넌트에는 3가지로 이루어짐
- template : html, vue에서 제공하는 디렉티브, 템플릿, 다른 컴포넌트
- script : js 파일들
- style : css, scss 스타일 파일들

-------------------------------------------------------------------------------------------------------------------

assets : 정적인 자원 (img, js, css, font 등등)
components : .vue 파일 존재 (컴포넌트 존재)
router : .js 파일 존재 (http 사용, 또는 컴포넌트간에 통신을 위한 스크립트)
store : : .js 파일 존재 (vuex ??? 내용 존재)
view : .vue 파일 존재 (template, html, script, css 등등 내용이 존재)