용어 수정: 구성화 → 컴포저블

Author: niceplugin

ko-KR/.vitepress/config.ts

@@ -199,7 +199,7 @@ export const sidebar = {
       text: '재사용성',
       items: [
         {
-          text: '구성화',
+          text: '컴포저블',
           link: '/guide/reusability/composables'
         },
         {

ko-KR/src/api/application.md

@@ -278,7 +278,7 @@ import CustomPreferenceSwitch from './CustomPreferenceSwitch.vue'
 믹스인은 라이브러리 생태계에서 널리 사용되고 있기 때문에, 하위 호환성을 위해 Vue 3에서 지원됩니다.
 하지만 앱 내 코드에서 믹스인(특히 전역 믹스인)의 사용은 피해야 합니다.
 
-로직 재상용은 [구성화](/guide/reusability/composables.html)를 추천합니다.
+로직 재상용은 [컴포저블](/guide/reusability/composables.html)을 추천합니다.
 :::
 
 - **타입**:

ko-KR/src/api/reactivity-utilities.md

@@ -87,15 +87,15 @@
   위의 ref는 `state.foo`와 **동기화되지 않습니다**.
   `ref()`가 일반 숫자 값을 수신하기 때문입니다.
 
-  `toRef()`는 구성화 함수에 prop을 ref로 전달하려는 경우에 유용합니다:
+  `toRef()`는 컴포저블 함수에 prop을 ref로 전달하려는 경우에 유용합니다:
 
   ```vue
   <script setup>
   import { toRef } from 'vue'
   
   const props = defineProps(/* ... */)
 
-  // `props.foo`를 ref로 변환한 다음 구성화 함수에 전달
+  // `props.foo`를 ref로 변환한 다음 컴포저블 함수에 전달
   useSomeFeature(toRef(props, 'foo'))
   </script>
   ```
@@ -151,7 +151,7 @@
   console.log(state.foo) // 3
   ```
 
-  `toRefs`는 구성화 함수에서 반응형 객체를 반환하면,
+  `toRefs`는 컴포저블 함수에서 반응형 객체를 반환하면,
   이것을 사용하는 컴포넌트가 반응형을 잃지 않고 분해 할당 및 확장 할 수 있어 유용합니다.
 
   ```js

ko-KR/src/guide/extras/composition-api-faq.md

@@ -59,10 +59,10 @@ Vue를 컴포지션 API와 함께 사용하는 방법을 배우고 싶다면 왼
 
 ### 더 나은 로직 재사용성
 
-컴포지션 API의 가장 큰 장점은 [구성화 함수](/guide/reusability/composables.html)의 형태로 깔끔하고 효율적인 로직 재사용이 가능하다는 것입니다.
+컴포지션 API의 가장 큰 장점은 [컴포저블 함수](/guide/reusability/composables.html)의 형태로 깔끔하고 효율적인 로직 재사용이 가능하다는 것입니다.
 옵션 API의 기본 로직 재사용 메커니즘인 [믹스인의 모든 단점](/guide/reusability/composables.html#vs-mixins)을 해결합니다.
 
-컴포지션 API의 로직 재사용 기능은 구성화 유틸리티의 계속 성장하는 컬렉션인 [VueUse](https://vueuse.org/)와 같은 인상적인 커뮤니티 프로젝트를 탄생시켰습니다.
+컴포지션 API의 로직 재사용 기능은 컴포저블 유틸리티의 계속 성장하는 컬렉션인 [VueUse](https://vueuse.org/)와 같은 인상적인 커뮤니티 프로젝트를 탄생시켰습니다.
 또한 상태 저장 타사 서비스 또는 라이브러리를 [불변 데이터](/guide/extras/reactivity-in-depth.html#immutable-data), [상태 머신](/guide/extras/reactivity-in-depth.html#state-machines) 및 [RxJS](https://vueuse.org/rxjs/readme.html#vueuse-rxjs)와 같은 Vue의 반응형 시스템에 쉽게 통합하기 위한 깔끔한 메커니즘 역할을 합니다.
 
 ### 보다 유연한 코드 구성

ko-KR/src/guide/extras/reactivity-in-depth.md

@@ -446,7 +446,7 @@ export function useImmer(baseState) {
 단순한 컴포넌트에는 과도할 수 있지만, 복잡한 상태 흐름을 보다 강력하고 관리하기 쉽게 만드는 데 도움이 될 수 있습니다.
 
 JavaScript에서 가장 널리 사용되는 상태 머신 구현 중 하나는 [XState](https://xstate.js.org/)입니다.
-다음은 이를 통합하는 구성화입니다:
+다음은 이를 통합하는 컴포저블입니다:
 
 ```js
 import { createMachine, interpret } from 'xstate'

ko-KR/src/guide/reusability/composables.md

@@ -12,8 +12,8 @@ const vFocus = {
 
 코어에 포함된 기본 디렉티브 세트(예: `v-model` 또는 `v-show`) 외에도 Vue를 사용하면 커스텀 디렉티브를 정의할 수 있습니다.
 
-우리는 Vue에서 [컴포넌트 기초](/guide/essentials/component-basics.html)와 [구성화](./composables)라는 두 가지 형태의 코드 재사용을 도입했습니다.
-컴포넌트는 주요 구성-요소(building-block)이고, 구성화는 상태 저장 로직을 재사용하는 데 중점을 둡니다.
+우리는 Vue에서 [컴포넌트 기초](/guide/essentials/component-basics.html)와 [컴포저블](./composables)이라는 두 가지 형태의 코드 재사용을 도입했습니다.
+컴포넌트는 주요 구성-요소(building-block)이고, 컴포저블은 상태 저장 로직을 재사용하는 데 중점을 둡니다.
 반면에 커스텀 디렉티브는 주로 일반 엘리먼트에 대한 저수준(low-level) DOM 접근과 관련된 로직을 재사용하기 위한 것입니다.
 
 커스텀 디렉티브는 컴포넌트의 수명주기 훅을 포함하는 객체처럼 정의됩니다.

ko-KR/src/guide/reusability/custom-directives.md

@@ -211,7 +211,7 @@ export const store = reactive({
 이것은 컴포넌트 메서드가 아니기 때문에, 적절히 `this` 컨텍스트를 사용하여 메서드를 호출할 필요가 있습니다.
 :::
 
-여기에서는 단일 반응형 객체를 `store`로 사용하고 있지만, `ref()` 또는 `computed()`와 같은 다른 [반응형 API](/api/reactivity-core.html)를 사용하여 생성된 반응형 상태를 공유하거나 [구성화](/guide/reusability/composables.html)를 통해 전역 상태를 반환할 수도 있습니다:
+여기에서는 단일 반응형 객체를 `store`로 사용하고 있지만, `ref()` 또는 `computed()`와 같은 다른 [반응형 API](/api/reactivity-core.html)를 사용하여 생성된 반응형 상태를 공유하거나 [컴포저블](/guide/reusability/composables.html)을 통해 전역 상태를 반환할 수도 있습니다:
 
 ```js
 import { ref } from 'vue'

ko-KR/src/guide/scaling-up/state-management.md

@@ -14,8 +14,8 @@ import TestingApiSwitcher from './TestingApiSwitcher.vue'
 
 이 가이드에서는 기본 용어를 다루고 Vue 3 앱에 어떤 도구를 선택해야 하는지에 대한 권장 사항을 제공합니다.
 
-구성화를 다루는 Vue 특정 섹션이 있습니다.
-자세한 내용은 아래의 [구성화 테스트](#testing-composables)를 참조하세요.
+컴포저블을 다루는 Vue 특정 섹션이 있습니다.
+자세한 내용은 아래의 [컴포저블 테스트](#testing-composables)를 참조하세요.
 
 ## 테스트 시기 {#when-to-test}
 
@@ -28,7 +28,7 @@ import TestingApiSwitcher from './TestingApiSwitcher.vue'
 Vue 앱의 테스트 전략을 설계할 때는 다음 테스트 유형을 활용해야 합니다:
 
 - **단위**:
-  주어진 함수, 클래스 또는 구성화에 제공된 입력 정보가 의도하는 출력 또는 사이드 이팩트를 생성하는지 확인합니다.
+  주어진 함수, 클래스 또는 컴포저블에 제공된 입력 정보가 의도하는 출력 또는 사이드 이팩트를 생성하는지 확인합니다.
 - **컴포넌트**:
   컴포넌트가 마운트, 렌더링, 상호 작용이 의도대로 작동하는지 확인합니다.
   이러한 테스트는 단위 테스트보다 더 많은 코드를 가져오고 더 복잡하며 실행하는 데 더 많은 시간이 필요합니다.
@@ -54,7 +54,7 @@ Vue 앱의 테스트 전략을 설계할 때는 다음 테스트 유형을 활
 ## 단위 테스트 {#unit-testing}
 
 단위 테스트는 작고 독립된 코드 단위가 예상대로 작동하는지 확인하기 위해 작성됩니다.
-단위 테스트는 일반적으로 단일 함수, 클래스, 구성화 또는 모듈을 다룹니다.
+단위 테스트는 일반적으로 단일 함수, 클래스, 컴포저블 또는 모듈을 다룹니다.
 단위 테스트는 논리적 정확성에 초점을 맞추고 앱의 전체 기능 중 작은 부분에만 관심을 둡니다.
 앱 환경의 많은 부분(예: 초기 상태, 복잡한 클래스, 타사 모듈 및 네트워크 요청)을 모의할 수 있습니다.
 
@@ -102,13 +102,13 @@ describe('increment', () => {
 
 Vue 관련 기능을 단위 테스트하는 두 가지 경우가 있습니다.
 
-1. 구성화
+1. 컴포저블
 2. 컴포넌트
 
-### 구성화 {#composables}
+### 컴포저블 {#composables}
 
-Vue 앱에 특별한 함수의 한 범주인 [구성화](/guide/reusability/composables.html)는 테스트 중에 특별한 처리가 필요할 수 있습니다.
-자세한 내용은 아래의 [구성화 테스트](#testing-composables)를 참조하세요.
+Vue 앱에 특별한 함수의 한 범주인 [컴포저블](/guide/reusability/composables.html)은 테스트 중에 특별한 처리가 필요할 수 있습니다.
+자세한 내용은 아래의 [컴포저블 테스트](#testing-composables)를 참조하세요.
 
 ### 컴포넌트 단위 테스트 {#unit-testing-components}
 
@@ -449,18 +449,18 @@ test('it should work', () => {
 > npm test
 ```
 
-### 구성화 테스트 {#testing-composables}
+### 컴포저블 테스트 {#testing-composables}
 
-> 이 섹션은 [구성화](/guide/reusability/composables.html) 섹션을 읽었다고 가정합니다.
+> 이 섹션은 [컴포저블](/guide/reusability/composables.html) 섹션을 읽었다고 가정합니다.
 
-구성화를 테스트할 때, 호스트 컴포넌트 인스턴스에 의존하는 경우와 그렇지 않은 경우 두 가지 범주로 나눌 수 있습니다.
+컴포저블을 테스트할 때, 호스트 컴포넌트 인스턴스에 의존하는 경우와 그렇지 않은 경우 두 가지 범주로 나눌 수 있습니다.
 
-구성화는 아래 API를 사용할 때 호스트 컴포넌트 인스턴스에 따라 달라집니다.
+컴포저블은 아래 API를 사용할 때 호스트 컴포넌트 인스턴스에 따라 달라집니다.
 
 - 수명 주기 훅
 - Provide(제공) / Inject(주입)
 
-구성화가 반응형 API만 사용하는 경우 직접 호출하고, 반환된 상태/메서드를 검증하여 테스트할 수 있습니다:
+컴포저블이 반응형 API만 사용하는 경우 직접 호출하고, 반환된 상태/메서드를 검증하여 테스트할 수 있습니다:
 
 ```js
 // counter.js
@@ -490,7 +490,7 @@ test('useCounter', () => {
 })
 ```
 
-수명 주기 훅 또는 Provide/Inject에 의존하는 구성화는 테스트할 호스트 컴포넌트에 래핑되어야 합니다.
+수명 주기 훅 또는 Provide/Inject에 의존하는 컴포저블은 테스트할 호스트 컴포넌트에 래핑되어야 합니다.
 다음과 같은 핼퍼를 만들 수 있습니다:
 
 ```js
@@ -527,7 +527,7 @@ test('useFoo', () => {
 })
 ```
 
-더 복잡한 구성화의 경우,
+더 복잡한 컴포저블의 경우,
 [컴포넌트 테스트](#component-testing) 기술을 사용하여 래퍼 컴포넌트에 대한 테스트를 작성하여 테스트하는 것이 더 쉬울 수도 있습니다.
 
 <!--