From 0d20b93b0f3ca9f199ed1bcb5bf7bcc8c8d025cf Mon Sep 17 00:00:00 2001 From: "Heehyeon, Lee" <76590935+dev-hikun@users.noreply.github.com> Date: Fri, 5 Feb 2021 14:58:41 +0900 Subject: [PATCH 1/2] Update higher-order-components.md Add Introduction Partial Translation --- content/docs/higher-order-components.md | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/content/docs/higher-order-components.md b/content/docs/higher-order-components.md index 8d97b61ce..af3e2305a 100644 --- a/content/docs/higher-order-components.md +++ b/content/docs/higher-order-components.md @@ -1,22 +1,22 @@ --- id: higher-order-components -title: Higher-Order Components +title: 고차 컴포넌트 permalink: docs/higher-order-components.html --- -A higher-order component (HOC) is an advanced technique in React for reusing component logic. HOCs are not part of the React API, per se. They are a pattern that emerges from React's compositional nature. +고차 컴포넌트 (HOC, Higher Order Component) 는 컴포넌트 로직을 재사용하기 위한 React의 고급 기술입니다. HOC는 React API의 일부가 아니며, 리액트의 구성적 특성에서 나오는 패턴입니다. -Concretely, **a higher-order component is a function that takes a component and returns a new component.** +구체적으로, **고차 컴포넌트는 컴포넌트를 가져와 새 컴포넌트를 리턴(반환)하는 함수입니다..** ```js const EnhancedComponent = higherOrderComponent(WrappedComponent); ``` -Whereas a component transforms props into UI, a higher-order component transforms a component into another component. +컴포넌트는 props를 UI로 변환하는 반면에, 고차 컴포넌트는 컴포넌트를 새로운 컴포넌트로 변환합니다. -HOCs are common in third-party React libraries, such as Redux's [`connect`](https://github.com/reduxjs/react-redux/blob/master/docs/api/connect.md#connect) and Relay's [`createFragmentContainer`](http://facebook.github.io/relay/docs/en/fragment-container.html). +고차 컴포넌트(HOC)는 Redux의 [`connect`](https://github.com/reduxjs/react-redux/blob/master/docs/api/connect.md#connect)와 Relay의 [`createFragmentContainer`](http://facebook.github.io/relay/docs/en/fragment-container.html)와 같은 서드 파티 리액트 라이브러리에서 흔하게 볼 수 있습니다. -In this document, we'll discuss why higher-order components are useful, and how to write your own. +이 문서에서는 고차 컴포넌트가 유용한 이유를 보여주고, 직접 작성하는 방법에 대해 알아보겠습니다. ## Use HOCs For Cross-Cutting Concerns {#use-hocs-for-cross-cutting-concerns} From 72921330c44db74a0b725c6d64baaa5c1d03433e Mon Sep 17 00:00:00 2001 From: "Heehyeon, Lee" <76590935+dev-hikun@users.noreply.github.com> Date: Fri, 5 Feb 2021 15:03:06 +0900 Subject: [PATCH 2/2] Update higher-order-components.md --- content/docs/higher-order-components.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/content/docs/higher-order-components.md b/content/docs/higher-order-components.md index af3e2305a..ced31b5ec 100644 --- a/content/docs/higher-order-components.md +++ b/content/docs/higher-order-components.md @@ -4,9 +4,9 @@ title: 고차 컴포넌트 permalink: docs/higher-order-components.html --- -고차 컴포넌트 (HOC, Higher Order Component) 는 컴포넌트 로직을 재사용하기 위한 React의 고급 기술입니다. HOC는 React API의 일부가 아니며, 리액트의 구성적 특성에서 나오는 패턴입니다. +고차 컴포넌트(HOC, Higher Order Component)는 컴포넌트 로직을 재사용하기 위한 React의 고급 기술입니다. 고차 컴포넌트(HOC)는 React API의 일부가 아니며, 리액트의 구성적 특성에서 나오는 패턴입니다. -구체적으로, **고차 컴포넌트는 컴포넌트를 가져와 새 컴포넌트를 리턴(반환)하는 함수입니다..** +구체적으로, **고차 컴포넌트는 컴포넌트를 가져와 새 컴포넌트를 반환하는 함수입니다.** ```js const EnhancedComponent = higherOrderComponent(WrappedComponent);