송민준의 개발노트

우선 Directive란 무엇인가? Vue 컴포넌트에 특별한 속성으로 사용되고 특정한 동작을 지정해주는 것이다. Vue에서 흔히 사용하는 v-if, v-show, v-text 등이 디렉티브이다. 그렇다면 개발자가 어떤 특정한 기능을 공통적으로 속성에 적용하고 싶다면 커스텀 디렉티브를 이용해서 구현이 가능할 것이다. 추가적인 디렉티브 개념이 알고싶다면 아래의 링크 참고 https://kr.vuejs.org/v2/guide/custom-directive.html 사용자 지정 디렉티브 — Vue.js Vue.js - 프로그레시브 자바스크립트 프레임워크 kr.vuejs.org 나는 디렉티브를 이용해서 CSR Vue 프로젝트에 스크롤 애니메이션 효과를 구현한 적이 있다. 이번에 Nuxt로 전환하면서 해당 디렉티브..

얼마 전 Vue를 사용해서 프로젝트를 만들어 완성했다. 기본적인 CSR로 개발을 했는데 초기 로딩 속도와 SEO 때문에 SSR 개발을 도와주는 Nuxt를 공부하게 되었다. 그에 앞서 CSR과 SSR을 정리하고자 한다~! 1. CSR(Client Side Rendering) CSR은 SPA(Single Page Application)에서 쓰이는 방법으로 웹서버(Nginx 등)에서 html과 static 파일 번들을 가져온 후, javascript를 통해 동적으로 Rendering하는 방법이다. [장점] 동작하는데 데이터 갱신에만 리소스를 요청하므로 서버 부하가 덜하다. 최초 이후 동작들은 빠르게 Rendering이 가능해서 UX가 뛰어나다. [단점] 다만 SPA는 초기에 한번에 번들되어 오기 때문에 시간이..