주니어 개발자 모몽'-' 주니어 개발자 모몽'-'

Vue.js란 웹 애플리케이션의 사용자 인터페이스를 만들기 위해 사용하는 오픈 소스 프로그레시브 자바스크립트 프레임워크이다. 단일형 프레임워크와 달리 점진적으로 채택할 수 있도록 설계되어 있다. 장점 기존 웹 개발자뿐만 아니라 HTML, CSS, 자바스크립트 기초만 아는 웹 개발 입문자 및 컴퓨터 비전공자들도 배우기 쉽게 만들어졌다. 리액트롸 앵귤러에 비해 성능이 우수하고 빠르다. 리액트의 장점과 앵귤러의 장점을 갖고 있다. 특징 MVVM 패턴 뷰는 UI화면 개발 방법 중 하나인 MVVM 패턴의 뷰 모델에 해당하는 화면단 라이브러리이다. MVVM(Model View VeiwModel): 마크업 언어나 GUI 코드르 비즈니스 로직 또는 백엔드 로직과 분리하여 개발하는 소프트웨ㅔ어 디자인 패턴. View: ..

Vue Router 컴포넌트 생성시 오류 발생 Error Message Component name "Contact" should always be multi-word Vue Router 설치 후 새로운 컴포넌트 생성 시 오류 발생 Contact.vue라는 파일 생성 후 오류가 생김 vue에서는 컴포넌트 이름을 지을 때 반드시 단어 조합으로 지어야 한다. 예를 들면 Contact가 아니라 ContactView 이런식으로 이름을 지어야 한다.

라우팅 특정 웹페이지에 접속을 했을 때 메뉴 또는 특정 링크를 클릭하면 화면이 전환된다. 이 때 브라우저 주소란을 보면 페이지가 이동될때마다 url 주소가 변경되는 것을 볼 수 있다. 뷰와 같은 단일 페이지 애플리케이션인 경우에는 페이지를 이동할 때마다 서버에 요청해서 페이지를 갱신하는 것이 아니라 클라이언트에서 미리 가지고 있던 페이지를 라우팅을 이용해서 화면을 갱신하게 된다. 라우팅은 클라이언트에서 url 주소에 따라 페이지가 전환되는 것으로 이해할 수 있다. Vue Router 설치방법 vue add router 기존 src router history를 Yes 선택하고 한다. src에 router와 views가 생긴것을 확인 할 수 있다. 실행 npm run serve http://localhost..

# Vue 프로젝트 매니저 프로그램 실행 vue ui http://localhost:8000/ 브라우저 오픈 만들기 클릭 후 프로젝트 위치 선택 프리셋 선택하기 수동 클릭 시 기능 선택하기 Router랑 Vuex 선택 설정 Router history 선택 Linter / fommatter config > ESLint + Standard config 선택 앞서 선택한 옵션을 저장해서 다음 프로젝트 만들 때 동일한 preset을 만들지 선택 이해했습니다 클릭 후 프로젝트 생성 완료! Vue 프로젝트 매니저 설정 대시보드 설정 원하는 위젯 추가 후 오른쪽 위 완료 버튼 클릭 위젯이 추가된 모습을 확인할 수 있다. 의존성, 플러그인을 보면 package.json 에 다 작성되어 잇는 부분 작업목록 package..