Vue.js 2

Vue.js / 기초 / 11. 서버 데이터 바인딩 하기 (w/postman Mock Server)

1. Mock 서버 만들기 목적 Postman을 이용해서 Mock 서버를 만든다. 실무에서는 백엔드가 만들어놓은 서버 API에 프론트가 요청을 보내서 데이터를 받아오는데, 서버가 없으니 가짜로 서버를 만들어놓고 프론트엔드 테스트를 하는 것이다. 실제로, 기획이나 디자인 쪽에서 엑셀로 데이터를 만들어놓고, 이것을 JSON 데이터로 바꾼 뒤, Mock 서버를 만들어서 백엔드에서 개발을 하는 동안 프론트 엔드도 병렬적으로 업무를 진행할 수 있도록 한다고 한다. Mock 서버 만들기 1) new-> mock server를 선택한다. 2) GET, test URL로 API를 만들고, next 클릭, Server name을 설정하여 Mock 서버 생성을 완료한다. 3) Mock Server - 서버 이름 - vie..

Vue.js / 기초 / 2. Vue 인스턴스 만들기 : 변수, 함수, 바인딩, 이벤트

딱 핵심만 짚고 넘어가자. 그리고 실제로 코딩하고 실행해보자. 처음에는 몸과 머리에 안 익숙하겠지만, 그냥 쭉쭉 넘어가다보면, 오래하다보면 익숙해진다. 1. 기본 구조 및 data 객체 기본구조 및 데이터 바인딩 이해하기 상세한 구조에 대해서는 나중에 알아보는 편이 좋다. 처음에는 src 폴더 내에 index.html 파일에 들어가서 모든 내용을 지우고, html 파일을 다시 만들자. 빈 화면에 !만 입력하고, [Tab]키를 누르면 html 기본구조가 생성되는 것을 확인할 수 있다(안되면 직접 쓰든, 구글링을 하든 방법을 찾아보자). CDN을 통해 빠르게 vue 파일 만들어보기 태그의 가장 아랫부분에 Vue.js의 공식사이트에서 제공하는 CDN 방식의 script 코드를 넣으면 vue를 이용할 수 있게 ..