Vue에서 외부라이브러리를 전역화하는 녀석이 있는데 바로 config.globalProperties이다. 근데 이녀석은 Vue3에서 새로 나온 녀석이라, Vue2에서의 전역화 하는 방식과는 다르다. 그래서 오늘은 Vue2와 Vue3에서의 전역화의 차이점을 정리하려고 한다. 전역화란? 해당하는 모든 컴포넌트들에서 사용 가능하도록 전역으로 등록하는 것을 의미한다. 예를 들면 아래와 같다. 내가 이해한 건 이런 느낌인데.. 아닐 수도 있다. 어쨌든 해당 하는 컴포넌트들에서 사용 가능하도록 하는 것이 전역화이다. 라고 이해하면 되지 않을까? Vue2 import axios from 'axios'; Vue.prototype.$axios = axios; new Vue({ el:#app, components: { A..

저번에 화면은 만들어 보았다. 그럼 실제로 데이터를 가져와야 하는데, 보통 Vue프로젝트에서는 FireDB를 많이 쓴다고 한다. 잘은 모르겠지만... 나는 그냥 API를 통해 데이터를 가져와서 화면에 뿌려줘 보겠다. 본 글에서는 문화 공공데이터광장 이라는 곳을 이용하겠다. API 인증키 신청 ============================================================================ 아래 링크로 접속해주자. https://developers.naver.com/docs/common/openapiguide/ API 공통 가이드 - Open API 가이드 API 공통 가이드 네이버 오픈API는 네이버 플랫폼의 기능을 외부 개발자가 쉽게 이용할 수 있게 웹 또는 SD..

node.js를 통해 Vue프로젝트도 만들어봤고, 부트스트랩, 웹팩에 대해 알아봤으니, 이제 이것들 복습하는 기분으로 API를 통해 영화정보를 받아와 게시판을 만드는 연습을 해보려 한다. router은 나중에... 아마 길어질 것 같아서 연습장이라는 카테고리도 만들어 나눠 놓았다. 처음이라 잘못 된 게 많아도 이해하길.. 연습이라.. 참고로 SPA형식으로 만들 예정이다. 실무에서는 그렇게 사용하지 않는다지만 아직 Vue프로젝트 구조를 완전히 이해 하지 못한 상태라.. 그럼 시작해보자 프로젝트 폴더 생성 ============================================================================ Vue 프로젝트를 생성 할 폴더를 생성해주자. 프로젝트 폴더 이동 ..

Vue를 이용해서 API로 영화목록을 받아오는 게시판을 만들어 보려고 하는데.. 화면에 예뻐야 할 맛이 나지 않겠는가? 근데 나는 CSS나 이런 건 잼병이기 때문에 부트스트랩을 이용해 보려고 한다. 예전에 부트스트랩을 사용하는 방법을 정리한 적이 있는데, Vue 프로젝트 환경에서는 조금 다른 것 같아 다시 정리하려고 한다. 부트스트랩 설치 ============================================================================ 터미널에 아래 명령어를 입력하여 부트스트랩을 설치해준다. npm install --save bootstrap 그럼 아래와 같이 package.json에 부트스트랩이 추가 된 것을 확인 할 수 있다. 이제 main.js에 가서 부트스트..