차곡차곡

1. 슬롯이란?슬롯은 Vue.js에서 컴포넌트의 재사용성을 높이기 위해 사용되는 기능입니다. 부모 컴포넌트에서 자식 컴포넌트로 템플릿 컨텐츠를 동적으로 삽입할 수 있게 해줍니다. 이를 통해 컴포넌트의 유연성과 재사용성이 향상됩니다.2. 기본 슬롯 사용기본 슬롯은 자식 컴포넌트에 태그를 사용하여 정의하고, 부모 컴포넌트에서 자식 컴포넌트 태그 내에 삽입된 컨텐츠가 슬롯 위치에 렌더링됩니다.예시: 클릭하기!3. 명명된 슬롯하나의 컴포넌트 내에서 여러 개의 슬롯을 사용할 때, 각 슬롯에 고유 이름을 할당할 수 있습니다. 이렇게 하면 각 슬롯의 용도를 명확히 할 수 있으며, 부모 컴포넌트에서는 해당 이름을 사용하여 적절한 컨텐츠를 삽입할 수 있습니다.예시: ..

Vue.js의 컴포넌트 생명주기는 컴포넌트가 생성되고, 업데이트되며, 파괴되는 과정을 관리합니다. 각 생명주기 단계에서 특정한 작업을 수행할 수 있는 '라이프사이클 훅'을 제공합니다. 이 훅들을 이용하면 데이터를 불러오거나, DOM을 조작하고, 타이머를 설정하거나 제거하는 등의 작업을 적절한 시점에 수행할 수 있습니다. Vue.js에서는 주로 아래와 같은 주요 라이프사이클 훅들을 제공합니다:beforeCreate: 컴포넌트가 생성되기 직전에 호출됩니다. 이 시점에서는 데이터와 이벤트가 아직 설정되지 않아 데이터에 접근하거나 이벤트를 사용할 수 없습니다.created: 컴포넌트가 생성된 직후에 호출됩니다. 이 시점에서는 데이터와 메서드가 활성화되어 있으므로, API 호출을 통해 데이터를 불러오는 작업 등을..

Vue 프로젝트 실행 구조 이해하기vue└─ project ├─ node_modules # 설치된 node 모듈이 위치한 폴더. npm install 명령어를 통해 설치한 모듈이 위치한 곳. ├─ public # index.html 파일이 위치한 곳 (정적 파일 위치) │ ├─ favicon.ico │ └─ index.html ├─ src # 구현되는 vue 컴포넌트 파일이 위치하는 곳 │ ├─ assets # css, image 등 파일이 위치하는 곳 │ │ └─ logo.png │ ├─ components # Vue 컴포넌트 중에 재사용을 위해서 구현된 컴포넌트가 위치하는 곳 │ │ └─ HelloWorld.vue │ ├─ ..

Vue.js 란 무엇인가?사용자 인터페이스 (User Interface : UI) 개발을 위한 Progressive Framework로 직관적이고 배우기 쉬워숴 초보 개발자 ~ 숙련된 개발자까지 널리 사용되고있음데이터 바인딩, 컴포넌트 기반 개발 , 라우팅 , 상태관리 등 다양한 기능 제공웹과 네이티브 앱의 장점을 모두 수용하여 빠르고 쉽게 개발 가능함.MVVP 패턴에 해당하며 SPA 를 구축에 용이1. MVVP 패턴이란?ui 개발에 널리 사용되는 아키텍처 패턴 중 하나로 , 데이터 표현방식과 비즈니스 로직을 분리하여 유지 보수에 용이하고 개발 효율이 높다.구성요소model : 데이터베이스 , 파일시스템 , API로부터 데이터 로드하고 관리view : 사용자에게 보이는 ui 부분으로 html,css,js..