# Vue 컴포저블 (Vue.js / Nuxt.js)

> composables 생성, 재사용 가능한 로직, useState, useRoute, useRouter, 커스텀 composables 패턴

- 20 면접 질문
- Mid-Level
- [면접 질문: Vue.js / Nuxt.js](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions.md)

## 1. Vue 3와 Nuxt 3에서 composable이란 무엇인가요?

**답변**

composable은 Vue의 Composition API를 사용하여 재사용 가능한 로직을 캡슐화하는 함수입니다. composable을 사용하면 mixin에 의존하지 않고도 컴포넌트 간에 상태와 효과를 공유할 수 있습니다. 관례적으로 composable의 이름은 항상 use 접두사로 시작하여 코드에서 쉽게 식별할 수 있습니다.

## 2. composable에 권장되는 명명 규칙은 무엇인가요?

**답변**

composable은 항상 use 접두사로 시작하고 그 뒤에 camelCase로 작성한 설명적인 이름을 붙여야 합니다. 이 관례를 통해 코드에서 composable을 빠르게 식별하고 일반적인 유틸리티 함수와 구별할 수 있습니다. 예를 들어 useCounter, useFetch, useAuth는 composable에 적합한 이름입니다.

## 3. Nuxt 3 프로젝트에서 composable은 어디에 두어야 하나요?

**답변**

composable은 프로젝트 루트의 composables 디렉터리에 두어야 합니다. Nuxt 3는 이 디렉터리의 모든 파일을 자동으로 임포트하므로 수동으로 임포트할 필요 없이 composable을 사용할 수 있습니다. 이 자동 임포트는 개발자 경험을 향상시키고 보일러플레이트 코드를 줄여줍니다.

## 17개 추가 질문 이용 가능

- Nuxt 3에서 ref 대비 useState의 주요 장점은 무엇인가요?
- Nuxt composable에서 현재 라우트의 파라미터에 어떻게 접근하나요?

무료로 가입하기: https://sharpskill.dev/ko/login

## 기타 Vue.js / Nuxt.js 면접 주제

- [JavaScript 기초](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/javascript-fundamentals.md): 20개 질문, Junior
- [모던 JavaScript (ES6+)](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/es6-modern-javascript.md): 20개 질문, Junior
- [Vue 기초](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/vue-basics.md): 22개 질문, Junior
- [Vue 컴포넌트](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/vue-components.md): 20개 질문, Junior
- [Vue Router](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/vue-router.md): 18개 질문, Junior
- [Pinia State Management](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/pinia-state-management.md): 20개 질문, Junior
- [Vuex (Legacy)](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/vuex-legacy.md): 15개 질문, Mid-Level
- [Composition API](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/composition-api.md): 24개 질문, Mid-Level
- [Vue 반응성](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/vue-reactivity.md): 20개 질문, Mid-Level
- [Nuxt 기초](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/nuxt-fundamentals.md): 22개 질문, Mid-Level
- [Nuxt 데이터 페칭](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/nuxt-data-fetching.md): 20개 질문, Mid-Level
- [Nuxt SSR 및 SSG](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/nuxt-ssr-ssg.md): 22개 질문, Mid-Level
- [Nuxt 서버 라우트](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/nuxt-server-routes.md): 20개 질문, Mid-Level
- [Nuxt 모듈](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/nuxt-modules.md): 18개 질문, Mid-Level
- [Vue 폼과 유효성 검사](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/vue-forms-validation.md): 20개 질문, Mid-Level
- [Nuxt 상태 관리](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/nuxt-state-management.md): 18개 질문, Mid-Level
- [Vue 테스팅](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/vue-testing.md): 20개 질문, Mid-Level
- [Nuxt 배포 및 CI/CD](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/nuxt-deployment-cicd.md): 22개 질문, Mid-Level
- [Vue 성능](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/vue-performance.md): 22개 질문, Senior
- [Vue 고급 패턴](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/vue-advanced-patterns.md): 24개 질문, Senior
- [Vue와 함께 사용하는 TypeScript](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/typescript-vue.md): 22개 질문, Senior
- [Nuxt 인증](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/nuxt-auth.md): 20개 질문, Senior
- [Nuxt에서의 SEO](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/nuxt-seo.md): 20개 질문, Senior
- [Nuxt 국제화](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/nuxt-i18n.md): 18개 질문, Senior
- [Vue 아키텍처](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/vue-architecture.md): 22개 질문, Senior
- [Nuxt 보안](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/nuxt-security.md): 20개 질문, Senior
- [Vue 생태계](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/vue-ecosystem.md): 18개 질문, Senior
- [Vue 2→3 및 Nuxt 2→3 마이그레이션](https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/migration-vue2-vue3-nuxt2-nuxt3.md): 22개 질문, Senior

---

Source: SharpSkill (https://sharpskill.dev), tech interview preparation for your real stack.
HTML version of this page: https://sharpskill.dev/ko/technologies/vue-nuxt/interview-questions/vue-composables