Vue.js 강의 내용 정리

postman : Api 테스트 도구vue-cli 버전 확인 : vue --versionvue 프로젝트 시작: vue create 프로젝트 명Preset : 플러그인들의 집합을 의미unit testing, 테스트 도구 Jestdedicated config files :

Vue.use(): 플러그인을 실행하고, 초기화하기 위해서 필요한 코드뷰 라우터 인스턴스와 routes 배열routes 배열은 라우팅 정보를 담는 속성라우터 경로와 해당 경로에 접속할 경우 그려지는 페이지(컴포넌트)를 정의router-view & router-linkr

axios 인스턴스 생성과 api URL 공통화: ✨✨ 배포 시 API URL과 프로토타이핑 할 때 URL이 다를 수 있기 때문에, URL을 공통화하고, 환경 변수 파일에 저장해 주어야 한다.api 공통화 및 인스턴스 생성을 통해 코드를 간결하게 작성할 수 있다.axi

axios response에서 api 요청 결과는 data 속성 안에 담겨져 있다.ES6의 해체 문법(destructuring)을 통해서 axios response의 data속성에 쉽게 접근할 수 있다.✨✨✨ API 요청 시 에러 처리 방법 ( async/await의

Scoped속성을 가진 style 태그 <style scoped>: style태그에 선언된 CSS의 범위를 현재 컴포넌트로 제한한다.: https://vue-loader-v14.vuejs.org/kr/features/scoped-css.htmlrouter

vuex getters: computed 처럼 state값이 변경될때 특정 상태를 계산할 수 있도록 사용하는 속성.로그인 후 헤더 영역 분기 처리: 로그인 후 나타날 영역과 사라질 영역을 <template> 태그를 이용해서 조건부 렌더링한다.: 로그인 후 Logi

git checkout -f(force): -f 옵션을 사용하면 기존의 코드를 모두 덮어쓰게된다.HTTP 401 코드 : 권한이 없음을 나타내는 코드(unAuthroized)토큰 : 사용자가 인증되었을 경우 발급하는 데이터, 이 값을 통해 인증 여부를 판단한다.jwt(

props: props는 부모 컴포넌트에서 자식 컴포넌트에 전달하는 데이터이다.뷰의 단방향 데이터 성질?: 자식 컴포넌트에서 전달받은 prop을 직접 전달하면 vue는 에러를 표시한다. 따라서 computed 속성을 사용해서 prop의 형태를 바꾸거나, 초기 값만 pr

: 컴포넌트 단에서 비즈니스 로직이 많으면 좋지 않다. => actions를 이용해서 간결하게 만들 수 있다.movie 모듈 생성하기namespaced: true로 설정해서 FETCH_MAIN_MOVIE의 인자로 전달받은 commit, state는 모두 movie mo

: https://xn--xy1bk56a.run/axios/guide/usage.html\`\`\`javascriptaxios.post('url', data);: https://stackoverflow.com/questions/40382388/how-

1번 코드로 작성 시 최초 컴포넌트가 생성될 때 filter를 적용할 수 없다는 에러가 발생한다. 왜냐하면 처음 컴포넌트 생성시 this.movieData는 빈 객체이므로, movieData안에 crew 프로퍼티가 undefined 상태이기 때문이다.따라서, 삼항 연산

1\. mixin내의 메소드에서 this는 이 메소드를 사용한 뷰 컴포넌트가된다.믹스인에 정의되어있는 메소드 onErrorImage를 컴포넌트에서 사용할 수 있다.

영화 아이템을 클릭 시 => 현재 라우트 경로에 ?movieId='해당 영화 아이디값'를 추가.스토어의 mutations를 이용해서 영화 상세 모달이 보여지도록 설정영화 상세 모달 컴포넌트에서 created 훅이 실행되고, 현재 라우트에 있는 movieId값을 받아서

참고 링크 : https://ui.toast.com/weekly-pick/ko_20190307: watch로 배열이나 객체를 감시할때 사용하는 속성.: 배열이나 객체의 값이 변할 경우 뷰가 감지하지 못하는 경우가 있어서 속성의 변화를 감시하도록 설정하기 위해서

: 프로젝트에 사용하려고 했던 vue 인피니티 스크롤 컴포넌트가 vue3에서 지원을 하지 않아서 형태를 참고해서 직접 컴포넌트를 구현해 보았다.: 정말 간단하게 만들어서 그런지 컴포넌트가 유연하지 않다..부모 자식 컴포넌트간 통신하는 새로운 방법에 대해서 알게되었다기존