본문 바로가기

vuejs3

210712 Next VueRouter 사용법 및 Hash 삭제 Next VueRouter(VueRouter v4.x) 사용법 및 Hash 삭제 Next VueRouter(VueRouter v4.x) 사용법 및 Hash 삭제 기존 VueRouter 호출방식 Next VueRouter 기본 Hash 삭제 이번에 새로 시작하게된 프로젝트를 Vue3 로 설정하게되었는데, Vue Router 를 사용하려니 기존 Vue 2 와 조금 다른 설정방식에 적응이 안되었다. 정말 간단하게 딱 두가지만 설명할 것이다. 기존 VueRouter 호출방식 일단 기존 Vue Router 에서 처럼, import VueRouter from 'vue-router' 를 호출하면 undefined 가 나온다. 이제는 모듈로 내보내주므로, 아래와 같은 방법으로는 Router 를 호출할 수 없다. // .. 2021. 7. 12.
Vue.js (3) - Computed :: Getter & Setter의 정의 Computed computed 프로퍼티는 methods와 비슷하지만, 아주 강력한 힘을 가지고 있습니다. Computed는 캐싱(cache)을 가지고있다는 것입니다. 그래서 캐싱이 뭔가요? 캐시(cache)는 잠시 저장해 둔다는 의미를 가진 특별한 기능입니다. 하드웨어에서 '캐시 메모리'라고 하면 실제 메모리와 CPU 사이에서 빠르게 전달하기 위해 미리 데이터들을 저장해 두는 좀 더 빠른 메모리입니다. 같은 맥락으로 네트워크 영역에서도 캐시는 로컬 장소에 파일을 미리 받아놓는것을 의미합니다. 웹 서버에서도 매번 번거롭고 느리게 로딩을 해야 하는 파일들을 미리 로딩해두고, 발빠른 응답을 주기도 합니다. 데이터 베이스를 매번 확인해야 하는 것도 캐시 서버를 이용한다면 빠른 응답을 줄 수 있습니다. 먼 곳에.. 2020. 9. 6.
Vue - Virtual DOM에 대하여 Vitual DOM - 가상 DOM DOM 이란? Virtual DOM에 대해 들어가 보기 전에, DOM 이 무엇인지 살펴보도록 합시다. DOM은 Document Object Model(문서객체모델) 이고, 기본적으로 HTML 마크업과 HTML 요소를 위한 객체로 구성되어 있습니다. 이 객체들은 tree 구조로 저장되어있는데, 브라우저는 이 구조를 웹 페이지를 로딩할 때 만들어내고, DOM은 우리에게 interaction(상호작용)과 HTML 요소(elements나 css 등)를 제작할 수 있도록 합니다. DOM을 이용하는것은 규모가 작은 웹 어플리케이션을 작업할때 아주 깔끔하지만, 앱이 커지면 커질수록, DOM을 직접 제작하는일은 느려지며, 비효율적입니다. 이것이 Virtual DOM이 생겨나게 된 이.. 2020. 7. 26.