Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Translate Home Page #8

Merged
merged 2 commits into from
Feb 13, 2019
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions content/home/examples/a-component-using-external-plugins.md
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
---
title: A Component Using External Plugins
title: 외부 플러그인을 사용하는 컴포넌트
order: 3
domid: markdown-example
---

React allows you to interface with other libraries and frameworks. This example uses **remarkable**, an external Markdown library, to convert the `<textarea>`'s value in real time.
React는 유연하며 다른 라이브러리나 프레임워크를 함께 활용할 수 있습니다. 이 예제에서는 외부 마크다운 라이브러리인 **remarkable**을 사용해 `<textarea>`의 값을 실시간으로 변환합니다.
6 changes: 3 additions & 3 deletions content/home/examples/a-simple-component.md
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
---
title: A Simple Component
title: 간단한 컴포넌트
order: 0
domid: hello-example
---

React components implement a `render()` method that takes input data and returns what to display. This example uses an XML-like syntax called JSX. Input data that is passed into the component can be accessed by `render()` via `this.props`.
React 컴포넌트는 `render()`라는 메서드를 구현하는데, 이것은 데이터를 입력받아 화면에 표시할 내용을 반환하는 역할을 합니다. 이 예제에서는 XML과 유사한 문법인 JSX를 사용합니다. 컴포넌트로 전달된 데이터는 `render()` 안에서 `this.props`를 통해 접근할 수 있습니다.

**JSX is optional and not required to use React.** Try the [Babel REPL](babel://es5-syntax-example) to see the raw JavaScript code produced by the JSX compilation step.
**React를 사용하기 위해서 JSX가 꼭 필요한 것은 아닙니다.** JSX를 컴파일한 JavaScript 코드를 확인하려면 [Babel REPL](babel://es5-syntax-example)을 이용해보세요.
4 changes: 2 additions & 2 deletions content/home/examples/a-stateful-component.md
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
---
title: A Stateful Component
title: 상태를 가지는 컴포넌트
order: 1
domid: timer-example
---

In addition to taking input data (accessed via `this.props`), a component can maintain internal state data (accessed via `this.state`). When a component's state data changes, the rendered markup will be updated by re-invoking `render()`.
컴포넌트는 `this.props`를 이용해 입력 데이터를 다루는 것 외에도 내부적인 상태 데이터를 가질 수 있습니다. 이는 `this.state`로 접근할 수 있습니다. 컴포넌트의 상태 데이터가 바뀌면 `render()`가 다시 호출되어 마크업이 갱신됩니다.
4 changes: 2 additions & 2 deletions content/home/examples/an-application.md
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
---
title: An Application
title: 애플리케이션
order: 2
domid: todos-example
---

Using `props` and `state`, we can put together a small Todo application. This example uses `state` to track the current list of items as well as the text that the user has entered. Although event handlers appear to be rendered inline, they will be collected and implemented using event delegation.
`props``state`를 사용해서 간단한 Todo 애플리케이션을 만들 수 있습니다. 이 예제에서는 `state`를 사용해 사용자가 입력한 텍스트와 할 일 목록을 관리합니다. 이벤트 핸들러들이 인라인으로 각각 존재하는 것처럼 보이지만, 실제로는 이벤트 위임을 통해 하나로 구현됩니다.
6 changes: 3 additions & 3 deletions content/home/marketing/component-based.md
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
---
title: Component-Based
title: 컴포넌트 기반
order: 1
---

Build encapsulated components that manage their own state, then compose them to make complex UIs.
스스로 상태를 관리하는 캡슐화된 컴포넌트를 만드세요. 그리고 이를 조합해 복잡한 UI를 만들어보세요.

Since component logic is written in JavaScript instead of templates, you can easily pass rich data through your app and keep state out of the DOM.
컴포넌트 로직은 템플릿이 아닌 JavaScript로 작성됩니다. 따라서 다양한 형식의 데이터를 앱 안에서 손쉽게 전달할 수 있고, DOM과는 별개로 상태를 관리할 수 있습니다.
6 changes: 3 additions & 3 deletions content/home/marketing/declarative.md
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
---
title: Declarative
title: 선언형
order: 0
---

React makes it painless to create interactive UIs. Design simple views for each state in your application, and React will efficiently update and render just the right components when your data changes.
React는 상호작용이 많은 UI를 만들 때 생기는 어려움을 줄여줍니다. 애플리케이션의 각 상태에 대한 간단한 뷰만 설계하세요. 그럼 React는 데이터가 변경됨에 따라 적절한 컴포넌트만 효율적으로 갱신하고 렌더링합니다.

Declarative views make your code more predictable and easier to debug.
선언형 뷰는 코드를 예측 가능하고 디버그하기 쉽게 만들어 줍니다.
6 changes: 3 additions & 3 deletions content/home/marketing/learn-once-write-anywhere.md
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
---
title: Learn Once, Write Anywhere
title: 한 번 배워서 어디서나 사용하기
order: 2
---

We don't make assumptions about the rest of your technology stack, so you can develop new features in React without rewriting existing code.
기술 스택의 나머지 부분에는 관여하지 않기 때문에, 기존 코드를 다시 작성하지 않고도 React의 새로운 기능을 이용해 개발할 수 있습니다.

React can also render on the server using Node and power mobile apps using [React Native](https://facebook.github.io/react-native/).
React는 Node 서버에서 렌더링을 할 수도 있고, [React Native](https://facebook.github.io/react-native/)를 이용하면 모바일 앱도 만들 수 있습니다.