Vue.js18 [Vue.js 프로젝트 투입 일주일 전] 6장 - Mock 서버 준비하기 6.1 Postman 설치 - Mock 서버: 실제 서버처럼 클라이언트로부터 요청을 받으면 응답하는 가짜 서버 - Postman 툴: API 개발을 위한 협업 플랫폼 6.2 Mock 서버 생성 6.3 API 반환 데이터 설정 2022. 4. 29. [Vue.js 프로젝트 투입 일주일 전] 5장 - 컴포넌트 Basic 5.1 컴포넌트란? - 컴포넌트: View (HTML), Code (JavaScript), Data의 세트 5.2 컴포넌트 구조 이해하기 - 컴포넌트 기본 구조 - Snippet 설정 - Snippet 사용 - Lifecycle Hooks - beforeCreate - created - beforeMount - mounted - beforeUnmount - unmounted 5.3 데이터 바인딩 - 문자열 데이터 바인딩 (텍스트 데이터 바인딩) -이중 중괄호를 이용해서 데이터 바인딩 (텍스트 바인딩) - raw(원시) HTML 데이터 바인딩 - v-html 디렉티브 사용 - form 입력 데이터 바인딩 - v-model 디렉티브를 사용하여 양방향 데이터 바인딩 생성 - 내부적으로 서로 다른 속성 사용하고.. 2022. 4. 29. [Vue.js 프로젝트 투입 일주일 전] 4장 - Vue Router 설정 4.1 라우팅이란? - 라우팅: 사용자가 접속한 주소에 따라 페이지(컴포넌트)가 달라지는 것 - SPA, 클라이언트에서 미리 가지고 있던 페이지를 라우팅을 이용하여 화면 갱신 (서버에게 요청해서 페이지 새로 갱신 X) 4.2 Vue-Router 설치 - vue add router 4.3 Lazy Load 적용하기 (비동기 컴포넌트) - Lazy Load: 리소스를 컴포넌트 단위로 분리하여 컴포넌트 혹은 라우터 단위로 필요한 것들만 그때 그때 다운받을 수 있게 하는 방법 - prefetch: 미래에 사용될 수 있는 리소스 (비동기 컴포넌트)를 캐시에 저장함으로써, 사용자가 접속했을 때 굉장히 빠르게 리소스 로드 가능 (캐시 담는 비용도 발생) [Source Code] Ch 04. Vue Router 설정 2022. 4. 24. [Vue.js 프로젝트 투입 일주일 전] 3장 - Vue CLI로 Vue 프로젝트 생성하기 3.1 Vue CLI 설치 - Vue CLI: Vue 프로젝트를 빠르게 구성하고 빌드, 디플로이 할 수 있게 도와주는 도구 - npm install -g @vue/cli 명령어로 설치 3.2 Default 옵션으로 프로젝트 설치하기 - Vue 프로젝트 생성 - vue create 프로젝트명 - Vue 프로젝트 실행 - npm run serve - npm run serve -- --port 다른포트번호 - Vue 프로젝트 파일 구조 - node_modules - public: 웹팩을 통해 관리되지 않는 정적 리소스가 모여있는 디렉토리 - src/assets - src/components - App.vue: 최상위(root) 컴포넌트 - main.js: 가장 먼저 실행되는 JS 파일로써, Vue 인스턴스 생.. 2022. 4. 24. 이전 1 2 3 4 5 다음 반응형