Library & Framework/Vue (3) 썸네일형 리스트형 Vue3 FullPage 적용하기? scroll-snap-type 개요 기존에 리액트에서 react-full-page 라이브러리를 이용하여 fullpage 기능을 적용한 적이 있었습니다. 2021.11.19 - [Programming/React] - [React]풀페이지 적용 하기. react-full-page vue3를 알아보면서 비슷한 기능을 테스트 해보면 좋겠다 싶어 비슷한 기능의 라이브러리를 찾아보았지만, vue3를 지원하는 라이브러리는 찾기가 힘들었습니다.(혹시 괜찮은 라이브러리가 있다면 댓글 부탁드립니다.) 그러던중 CSS의 scroll-snap-type 속성을 이용하여 비슷한 기능을 할 수 있다는 글을 보아 테스트 해보았습니다. 구현하기에 앞서 테스트 결과부터 말해보자면 해당 기능이 생각보다 많이 쓰이지 않는 이유를 알 것 같았습니다. 기존 라이브러리들을 .. Vue 개발 환경 세팅 node/nvm 설치 & vs code 설치 해당 내용은 React에서 다뤘으니 아래 포스팅을 참고 부탁드립니다. 2022.10.10 - [Programming/React] - [React] 개발환경 세팅하기 vs code extension설치 Vetur .vue 파일의 코드 하이라이팅, 인텔리센스 Vue 3 Snippets : .vue 파일 초기 구성 생성 .vue 파일에서 vuevueinit입력 Vue CLI 설치 Vue CLI는 기본 vue 개발 환경 설정 도구입니다. 기본적인 vue 프로젝트 세팅을 해주기에 세팅에 대한 고민을 줄일 수 있습니다. npm install -g @vue/cli # or yarn global add @vue/cli 프로젝트 생성 vue create test-app Vue.. Vue 개요 Vue? SPA 웹 개발을 위한 JS UI 라이브러리이며 프레임워크 기능도 하는 점진적인 프레임워크입니다. Vue는 구글에서 AngularJS를 사용하던 Evan You에 의해 개발되어 2014년 출시되었으며 발음처럼 View에 최적화된 프레임워크입니다. 특징 Virtual Dom 사용. SFC (Single-File Component) MVVM 패턴의 ViewModel의 역할 Tree Shaking(번등링 과정에서 사용하지 않는 코드 제거) 양방향 데이터 바인딩 코드 스타일이 통일된 부분이 많습니다.(v-for, v-if등) 상태 변경을 자동 추적하여 변경 발생시 효울적으로 DOM을 업데이트합니다. 장점 타프레임워크에 비하여 러닝커브가 낮습니다. react의 장점과 Angular의 장점을 갖고 있습니다.. 이전 1 다음
