Google extension 접속vue.js devtools 설치브라우저 우측 상단 - devtools 오른쪽 클릭 - 확장 프로그램 관리파일 URL에 대한 엑세스 허용 - 활성화
FrontEnd Development프론트엔드 개발은 HTML, CSS, 그리고 JavaScript를 활용해서 데이터를 볼 수 있게 만들어 줌이 작업을 통해 사용자는 데이터를 눈으로 볼 수 있고 데이터와 상호작용 할 수 있음대표적인 프론트엔드 프레임워크Vue.js, R
CDN개발버전, 도움되는 콘솔 경고를 포함<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>상용버전, 속도와 용량이 최적화됨.<script src="https://
기본 HTML 엘리먼트를 확장하여 재사용 가능한 코드를 캡슐화 하는데 도움을 줌CS에서는 다시 사용할 수 있는 범용성을 위해 개발된 소프트웨어 구성 요소를 의미즉, 컴포넌트는 개발을 함에 있어 유지보수를 쉽게 만들어 줄 뿐만 아니라, 재사용성의 측면에서도 매우 강력한
컴포넌트는 부모 - 자식 관계에서 가장 일반적으로 함께 사용하기 위함부모는 자식에게 데이터를 전달(Pass props)하며,자식은 자신에게 일어난 일을 부모에게 알림(Emit event)부모와 자식이 명확하게 정의된 인터페이스를 통해 격리된 상태로 유지할 수 있음pro
프로젝트 생성 $ vue create 프로젝트명cd 프로젝트명 으로 폴더 이동vue add router일단 초기화 시키기views > About, Home 삭제 및 나의 vue 만들기router > index.js 의 routes 안에 내용 지우고, 나의 vue 등록c
Vue.js의 공식 라우터중첩된 라우트/ 뷰 매핑 모듈화 된, 컴포넌트 기반의 라우터 설정 등SPA 상에서 라우팅을 쉽게 개발 할 수 있는 기능을 제공설치방법https://router.vuejs.org/installation.htmlvue add routerv
Vuex는 Vue.js 애플리케이션에 대한 상태관리패턴 + 라이브러리상태를 전역 저장소로 관리할 수 있도록 지원하는 라이브러리예측 가능한 방식으로 상태를 변경될 수 있도록 보장하는 규칙 설정애플리케이션의 모든 컴포넌트에 대한 중앙집중식 저장소 역할Vue의 공식 devt
새로고침을 하더라도 값이 다 초기화되지 않음그럼 어디에다가 값을 저장하고 있는 것인가?f12- application - Local Storage 으로 들어가서 확인하기vuex라는 키가 생겨있는 것을 확인할 수 있음state를 여기다가 저장중vue add vuexvue
https://www.netlify.com/로그인 및 회원가입npm run buildVue 의 src 폴더 내에 있는 것들을 하나의 script 코드로 만들어주는 역할완료되면 dist 라는 폴더가 생김전부 / 를 기준으로 작성되기 때문에 로컬에서 제대로 작동을
vue를 더 깔끔하게 쓰기 위해 스타일가이드를 읽어보자https://kr.vuejs.org/v2/style-guide/컴포넌트 이름에는 합성어를 사용item, list 등의 단어를 붙이면서 명확하게 구분하며, 엘리먼트간의 이름충돌을 방지컴포넌트 데이터는 반드시