Vue 끝내기 - newlife-js/Wiki GitHub Wiki

웹 서비스 개발 절차

요구사항 -> 서비스 기획 -> UI, UX 상세 설계 -=> GUI 디자인 -> 퍼블리싱 -> 백엔드 API 개발 -> 프런트엔드 개발 -> QA

env 파일 설정 방법

.env
.env.development
.env.production
파일에 VUE_APP_로 시작하는 설정들을 작성하면 됨 .env.development와 .env에 공통되는 환경변수가 존재한다면, env.development의 변수가 우선 적용됨
.env.development(production)에 없는 변수가 .env에 존재한다면 그 변수 적용됨

코드 스플리팅

웹 사이트 로드시에 모든 컴포넌트를 로드하면 웹 사이트 로딩속도가 느리다.

이를 해결하기 위해 사용할 때 로드하도록 하는 코드 스플리팅 사용 @router/index.js

{
  path: 'login',
  component: () => import('@/view/LoginPage.vue'),
}

axios.interceptors

request나 response 전에 로직 수행하도록 하는 기능

cookie

새로고침 후에도 로그인 인증 값을 보존하기 위해서는 cookie에 저장해서 꺼내쓸 수 있도록 해야 함.

document.cookie = // set
return document.cookie // get

icon

ionic.io/ionicons

filter

데이터 포맷팅을 위해서 filter를 사용(ex: 날짜 형식)

{{ 변수 | 필터함수 }}

filters: {
  필터함수 : function(value) {
  }

전역으로 사용하기 위해서는 @main.js new Vue 전에

vue.filter('필터함수', 함수)

router meta 속성

router 페이지의 속성들을 적용하기 위해서 meta라는 object에 속성들을 정의할 수 있다.