JavaScript/Vue.js 썸네일형 리스트형 Parallax.js in Vue https://www.npmjs.com/package/vue-parallax-js vue-parallax-js Tiny vue component that adds a directive for parallax effect on elements. www.npmjs.com https://vuejsexamples.com/tag/parallax/ Parallax - Vue.js Examples An easy to use Mouse Parallax Component - Made with Vue.js vuejsexamples.com SPA와 SSR의 장단점 그리고 Nuxt.js 지난 편에서 프론트엔드 프레임워크를Vue.js 로 결정하고 본격적으로 개발에만 집중하면 될 줄 알았지만, 한 가지 더 고민할 부분이 있었습니다. Vue-CLI로 만든 앱은 검색엔진최적화(SEO)가 어렵다는 점이죠. 웹서비스를 하는 저희 회사 입장에서는 검색엔진에 적절하게 노출되는 것이 아주 중요합니다. 일반적인 SPA 앱을 검색 로봇 입장에서 보면 모든 페이지의 소스가 아래와 같습니다. 로딩시점에서는 검색 엔진이 색인을 할 만한 콘텐츠가 존재하지 않는 것이죠. SPA 는 어떻게 렌더링되는 걸까요? 그리고 SSR은 왜 하는거죠? SPA와 SSR의 장단점을 살펴본 후, Vue.js 에서 SSR을 하는 여러 옵션의 특징을 분석해보겠습니다. SPA는 어떻게 렌더링하길래? 다들 아시겠지만 SPA(Single Pa.. [Library] vue-scroll-reveal ScrollReveal은 요소를 뷰포트에 enter / leave 할 때 요소를 쉽게 애니메이트하기위한 JavaScript 라이브러리이다. 직접 DOM을 Select 해서 스크롤 높이와 content의 높이를 계산해서 구현하려다 좋은 라이브러리가 있어서 사용하게 되었다. 사용 예시: https://wizball.io/info Wizball(ウィズボール)の紹介ページ WizballはLINK chain(ブロックチェーン)を基盤としたdAappとして運営する知識共有のためのQ&Aサービスです。 wizball.io # 사용방법 1. vue-scroll-reveal 설치 yarn add vue-scroll-reveal 2. main.js에 vue-scroll-reveal 셋팅 import VueScrollReveal fro.. Vue.js의 $refs를 통하여 DOM에 접근하기 출처 : https://codingexplained.com/coding/front-end/vue-js/accessing-dom-refs Accessing the DOM in Vue.js with $refs Learn how to access the DOM in Vue by using the $refs property that is available on Vue instances and components. Manipulating the DOM is easy with $refs. codingexplained.com 뷰에서는 $refs 속성을 이용해 DOM에 접근할 수 있습니다. 템플릿 안의 엘리먼트에 ref 속성을 추가함으로서, 뷰 인스턴스에 이 엘리먼트에 대한 정보를 줄 수 있습니다. 또한, 우리는 이 .. zero base 환경 설정 https://velog.io/@kyusung/Vue-app-sfc-without-vue-cli [Vue] 개발환경 만들기 (without vue-cli) 원문: https://bit.ly/2E1zTUz 이 글은 번역한 내용이 아니라 원문 내용 공부할 목적으로 작성한 내용입니다🤣 일반적으로 Vue로 개발할 때, vue-cli를 사용하여 프로젝트 구조를 생성합니다. 아래 내용은 vue-cli를 사용하지 않고, vue 단일 파일 컴포넌트를 빌드하는 방법을 설명합니다. vue.js의 CDN을 사용하면 스크립트... velog.io 이전 1 다음
