확장하기 SFC, 라우팅, 상태관리(Pinia), 테스트, SSR)
Vue 3 공식 문서의 확장하기(Scaling Up) 섹션 전체를 다룬다. SFC가 왜 권장되는지부터 Vue Router로 SPA 라우팅을 구성하는 법, Pinia로 전역 상태를 관리하는 법, Vitest + Vue Test Utils로 테스트를 작성하는 법, 그리고 SSR의 원리와 주의사항까지 — 실제 앱을 만들 때 반드시 알아야 할 확장 전략을 한...
Vue 3 공식 문서의 확장하기(Scaling Up) 섹션 전체를 다룬다. SFC가 왜 권장되는지부터 Vue Router로 SPA 라우팅을 구성하는 법, Pinia로 전역 상태를 관리하는 법, Vitest + Vue Test Utils로 테스트를 작성하는 법, 그리고 SSR의 원리와 주의사항까지 — 실제 앱을 만들 때 반드시 알아야 할 확장 전략을 한...
Vue 3 공식 문서의 내장 컴포넌트(Built-ins) 섹션 전체를 다룬다. <Transition>으로 진입·퇴장 애니메이션을 적용하고, <TransitionGroup>으로 리스트를 부드럽게 움직이고, <KeepAlive>로 컴포넌트 상태를 보존하고, <Teleport>로 DOM 계층을 탈출하고, <S...
Vue 3 공식 문서의 재사용성(Reusability) 섹션 전체를 다룬다. Composable로 상태 로직을 재사용하고, 커스텀 디렉티브로 저수준 DOM 접근을 추상화하고, 플러그인으로 앱 수준의 기능을 확장하는 법까지 — Vue에서 코드를 재사용하는 세 가지 방법을 깊이 있게 정리한다. 1. 개요 📌 이 글이 커버하는 공식 문서 페이지 페이지 핵심...
Vue 3 공식 문서의 컴포넌트 심화 섹션 전체를 다룬다. 컴포넌트 등록 방식부터 Props 검증, 커스텀 이벤트 설계, 컴포넌트 v-model, 폴스루 속성($attrs), 슬롯(기본/네임드/스코프드), Provide/Inject, 비동기 컴포넌트까지 — 재사용 가능한 컴포넌트를 올바르게 설계하기 위해 알아야 할 모든 것을 정리한다. 1. 개요 📌 ...
Vue 3 공식 문서의 Essentials(필수) 섹션 전체를 다룬다. 앱 인스턴스 생성부터 템플릿 문법, 반응성 시스템, computed/watch, 조건부·리스트 렌더링, 이벤트·폼 처리, 생명주기 훅, template ref, 컴포넌트 기초까지 — Vue로 뭔가를 만들기 위해 반드시 알아야 할 것들을 정리한다. 1. 개요 📌 이 글이 커버하는 공...
Vue 3를 처음 접할 때 가장 먼저 부딪히는 혼란이 있다. Options API와 Composition API 중 뭘 써야 하는가, <script setup>은 뭔가, SFC는 또 무엇인가. 이 글은 그 혼란을 정리하는 것에서 시작한다. 1. 개요 📌 Vue 3란? Vue는 선언적 렌더링(Declarative Rendering) 과 컴포넌...