@samitouri / QOS-React-2 / commits / 6911fa5c5b

Update Korean translation to b3c75d8

Shim Won committed Mar 21, 2015 at 08:27 UTC 6911fa5c5b19b8d4c3871e654b527482d2e84dea

18 files changed +71 -51

docs/docs/02-displaying-data.ko-KR.md

+2 -2

@@ -105,7 +105,7 @@ JSX는 완전히 선택적입니다. 당신은 React와 JSX를 함께 사용하

105 var child1 = React.createElement('li', null, 'First Text Content');

106 var child2 = React.createElement('li', null, 'Second Text Content');

107 var root = React.createElement('ul', { className: 'my-list' }, child1, child2);

108 -React.render(root, document.body);

108 +React.render(root, document.getElementById('example'));

109 ```

110

111 편의를 위하여, 당신은 팩토리 함수 헬퍼들을 이용해 커스텀 컴포넌트로부터 엘리먼트들을 만들 수 있습니다.

@@ -114,7 +114,7 @@ React.render(root, document.body);

114 var Factory = React.createFactory(ComponentClass);

115 ...

116 var root = Factory({ custom: 'prop' });

117 -React.render(root, document.body);

117 +React.render(root, document.getElementById('example'));

118 ```

119

120 React는 이미 일반적인 HTML 태그에 대한 빌트인 팩토리를 가지고 있습니다.

docs/docs/02.1-jsx-in-depth.ko-KR.md

+2 -2

@@ -26,7 +26,7 @@ HTML 태그를 렌더하려면, 그냥 JSX에 소문자 태그를 사용하세

27 ```javascript

28 var myDivElement = <div className="foo" />;

29 -React.render(myDivElement, document.body);

29 +React.render(myDivElement, document.getElementById('example'));

30 ```

32 React 컴포넌트를 렌더하려면, 대문자로 시작하는 로컬 변수를 만드세요.

@@ -34,7 +34,7 @@ React 컴포넌트를 렌더하려면, 대문자로 시작하는 로컬 변수

34 ```javascript

35 var MyComponent = React.createClass({/*...*/});

36 var myElement = <MyComponent someProperty={true} />;

37 -React.render(myElement, document.body);

37 +React.render(myElement, document.getElementById('example'));

38 ```

40 React JSX는 대소문자를 로컬 컴포넌트 클래스와 HTML 태그를 구별하는 컨벤션으로 사용합니다.

docs/docs/02.3-jsx-gotchas.ko-KR.md

+1 -1

@@ -10,7 +10,7 @@ JSX는 HTML처럼 보이지만, 작업하다 보면 마주치게 될 몇 가지

11 > 주의:

12 >

13 -> 인라인 `style` 어트리뷰트 같은 DOM과의 차이점은 [여기](/react/docs/dom-differences-ko-KR.html)를 보세요.

13 +> 인라인 `style` 어트리뷰트 같은 DOM과의 차이점은 [여기](/react/tips/dangerously-set-inner-html-ko-KR.html)를 보세요.

15 ## HTML 엔티티

docs/docs/03-interactivity-and-dynamic-uis.ko-KR.md

-2

@@ -40,8 +40,6 @@ React.render(

41 React에서의 이벤트 핸들러는 HTML에서 그러던 것처럼 간단히 카멜케이스 프로퍼티(camelCased prop)로 넘기면 됩니다. React의 모든 이벤트는 통합적인 이벤트 시스템의 구현으로 IE8 이상에서는 같은 행동이 보장됩니다. 즉, React는 사양에 따라 어떻게 이벤트를 일으키고(bubble) 잡는지 알고 있고, 당신이 사용하는 브라우저와 관계없이 이벤트 핸들러에 전달되는 이벤트는 [W3C 사양](http://www.w3.org/TR/DOM-Level-3-Events/)과 같도록 보장됩니다.

43 -React를 폰이나 테블릿같은 터치 디바이스에서 사용하려 한다면, 간단히 `React.initializeTouchEvents(true);`로 터치 이벤트 핸들링을 켜면 됩니다.

44 -

44 ## 기본 구현: 오토바인딩과 이벤트 델리게이션

docs/docs/04-multiple-components.ko-KR.md

+2 -2

@@ -75,7 +75,7 @@ React 컴포넌트 인스턴스를 만들 때, 추가적인 React 컴포넌트

76 ### 자식 Reconciliation (비교조정)

78 -**Reconciliation은 React가 DOM을 각각 새로운 렌더 패스에 업데이트하는 과정입니다.** 일반적으로, 자식은 렌더하는 순서에 따라 비교조정됩니다. 예를 들어, 각각의 마크업을 생성하는 두 개의 랜더 패스가 있다고 해봅시다.

78 +**Reconciliation은 React가 DOM을 각각 새로운 렌더 패스에 업데이트하는 과정입니다.** 일반적으로, 자식은 렌더하는 순서에 따라 비교조정됩니다. 예를 들어, 각각의 마크업을 생성하는 두 개의 렌더 패스가 있다고 해봅시다.

80 ```html

81 // Render Pass 1

@@ -115,7 +115,7 @@ React 컴포넌트 인스턴스를 만들 때, 추가적인 React 컴포넌트

115 <a name="dynamic-children"></a>

116 ### 동적 자식

117

118 -자식들이 섞이거나(검색의 결과같은 경우) 새로운 컴포넌트가 목록의 앞에 추가(스트림같은 경우)된다면 상황은 점점 더 까다로워집니다. 이런 때에의 동일성과 각 자식의 상태는 반드시 랜더 패스 간에 유지돼야 합니다. 각 자식에 `key`를 할당 함으로써 독자적으로 식별할 수 있습니다.

118 +자식들이 섞이거나(검색의 결과같은 경우) 새로운 컴포넌트가 목록의 앞에 추가(스트림같은 경우)된다면 상황은 점점 더 까다로워집니다. 이런 때에의 동일성과 각 자식의 상태는 반드시 렌더 패스 간에 유지돼야 합니다. 각 자식에 `key`를 할당 함으로써 독자적으로 식별할 수 있습니다.

119

120 ```javascript

121 render: function() {

docs/docs/05-reusable-components.ko-KR.md

+1 -1

@@ -26,7 +26,7 @@ React.createClass({

26 optionalString: React.PropTypes.string,

28 // 렌더링될 수 있는 모든 것: 숫자, 문자열, 요소

29 - // 이것들을 포함하는 배열이나 엘리먼트

29 + // 이것들을 포함하는 배열(이나 프래그먼트)

30 optionalNode: React.PropTypes.node,

32 // React 엘리먼트

docs/docs/06-transferring-props.ko-KR.md

+2 -2

@@ -41,7 +41,7 @@ React.render(

41 <FancyCheckbox checked={true} onClick={console.log.bind(console)}>

42 세상아 안녕!

43 </FancyCheckbox>,

44 - document.body

44 + document.getElementById('example')

45 );

46 ```

@@ -78,7 +78,7 @@ React.render(

78 <FancyCheckbox checked={true} onClick={console.log.bind(console)}>

79 세상아 안녕!

80 </FancyCheckbox>,

81 - document.body

81 + document.getElementById('example')

82 );

83 ```

docs/docs/07-forms.ko-KR.md

+1 -1

@@ -75,7 +75,7 @@ HTML에서는 `<textarea>` 태그의 값을 설정할 때 `<textarea>` 태그의

75 }

76 ```

78 -이것은 빈 값으로 시작되는 input을 랜더합니다. 임의의 사용자 입력은 즉시 렌더된 엘리먼트에 반영됩니다. 값의 업데이트를 감시하길 원한다면, 제어되는 컴포넌트처럼 `onChange` 이벤트를 사용할 수 있습니다.

78 +이것은 빈 값으로 시작되는 input을 렌더합니다. 임의의 사용자 입력은 즉시 렌더된 엘리먼트에 반영됩니다. 값의 업데이트를 감시하길 원한다면, 제어되는 컴포넌트처럼 `onChange` 이벤트를 사용할 수 있습니다.

80 비어 있지 않은 값으로 초기화하길 원한다면, `defaultValue` prop로 할 수 있습니다. 예를 들어,

docs/docs/10-addons.ko-KR.md

-1

@@ -14,7 +14,6 @@ next: animation-ko-KR.html

14 - [`createFragment`](create-fragment-ko-KR.html)는 외부에서 키가 할당된 자식들의 모음을 만듭니다.

15 - [`update`](update-ko-KR.html)는 JavaScript안에서 불변 데이터를 다루기 쉽게하는 헬퍼 함수입니다.

16 - [`PureRenderMixin`](pure-render-mixin-ko-KR.html)는 특정 상황에서 성능을 향상시켜 줍니다.

17 -- (비 추천) [`classSet`](class-name-manipulation-ko-KR.html)는 좀 더 알기 쉽게 DOM `class` 문자열을 다룹니다.

18 밑에 있는 애드온은 React 개발 (압축되지 않은) 버전에서만 사용가능 합니다.

docs/docs/10.1-animation.ko-KR.md

+9 -1

@@ -144,9 +144,17 @@ var ImageCarousel = React.createClass({

144

145 `ReactTransitionGroup`은 애니메이션의 기초입니다. 이는 `React.addons.TransitionGroup`으로 접근할 수 있습니다. 위에 있는 예제처럼 자식들이 선언적으로 여기에 추가되거나 삭제되는 경우, 특별한 훅이 이 생명주기에서 호출됩니다.

146

147 +### `componentWillAppear(callback)`

148 +

149 +이미 있는 `TransitionGroup`에 컴포넌트를 추가할 때 호출되는 `componentDidMount()`와 같이 호출됩니다. 이는 `callback`이 호출될 때까지 다른 애니메이션을 막습니다. `TransitionGroup`의 최초 렌더에서만 호출됩니다.

150 +

151 +### `componentDidAppear()`

152 +

153 +이는 `componentWillAppear`에 넘겨졌던 `callback` 함수가 호출된 다음에 호출됩니다.

154 +

155 ### `componentWillEnter(callback)`

156

149 -이는 이미 있는 `TransitionGroup`에 컴포넌트를 추가할 때 호출되는 `componentDidMount()`와 같이 호출됩니다. 이는 `callback`이 호출될 때까지 다른 애니메이션을 막습니다. `TransitionGroup`의 최조 렌더에서는 불려지지 않습니다.

157 +이미 있는 `TransitionGroup`에 컴포넌트를 추가할 때 호출되는 `componentDidMount()`와 같이 호출됩니다. 이는 `callback`이 호출될 때까지 다른 애니메이션을 막습니다. `TransitionGroup`의 최조 렌더에서는 불려지지 않습니다.

158

159 ### `componentDidEnter()`

160

docs/docs/10.2-form-input-binding-sugar.ko-KR.md

+1 -1

@@ -3,7 +3,7 @@ id: two-way-binding-helpers-ko-KR

3 title: 양방향 바인딩 핼퍼

4 permalink: two-way-binding-helpers-ko-KR.html

5 prev: animation-ko-KR.html

6 -next: class-name-manipulation-ko-KR.html

6 +next: test-utils-ko-KR.html

7 ---

9 `ReactLink`는 React에서 양방향 바인딩을 표현하는 쉬운 방법입니다.

docs/docs/10.4-test-utils.ko-KR.md

+1 -1

@@ -2,7 +2,7 @@

2 id: test-utils-ko-KR

3 title: 테스트 유틸리티

4 permalink: test-utils-ko-KR.html

5 -prev: class-name-manipulation-ko-KR.html

5 +prev: two-way-binding-helpers-ko-KR.html

6 next: clone-with-props-ko-KR.html

7 ---

docs/docs/ref-01-top-level-api.ko-KR.md

-9

@@ -145,15 +145,6 @@ DOMElement findDOMNode(ReactComponent component)

145 `React.PropTypes`는 컴포넌트에 넘어오는 props가 올바른지 검사할 수 있는 컴포넌트의 `propTypes` 객체에 들어가는 타입을 가집니다. `propTypes`에 대한 자세한 정보는 [재사용 가능한 컴포넌트](/react/docs/reusable-components-ko-KR.html)를 참고하세요.

146

147

148 -### React.initializeTouchEvents

149 -

150 -```javascript

151 -initializeTouchEvents(boolean shouldUseTouch)

152 -```

153 -

154 -React의 이벤트 시스템이 모바일 기기의 터치 이벤트를 처리하도록 설정합니다.

155 -

156 -

148 ### React.Children

149

150 `React.Children`은 불투명한 자료 구조인 `this.props.children`를 다룰 수 있는 유틸리티를 제공합니다.

docs/docs/ref-04-tags-and-attributes.ko-KR.md

+1 -1

@@ -60,7 +60,7 @@ formAction formEncType formMethod formNoValidate formTarget frameBorder height

60 hidden href hrefLang htmlFor httpEquiv icon id label lang list loop manifest

61 marginHeight marginWidth max maxLength media mediaGroup method min multiple

62 muted name noValidate open pattern placeholder poster preload radioGroup

63 -readOnly rel required role rows rowSpan sandbox scope scrolling seamless

63 +readOnly rel required role rows rowSpan sandbox scope scoped scrolling seamless

64 selected shape size sizes span spellCheck src srcDoc srcSet start step style

65 tabIndex target title type useMap value width wmode

66 ```

docs/docs/ref-05-events.ko-KR.md

-3

@@ -140,9 +140,6 @@ boolean shiftKey

140

141 ### 터치 이벤트

142

143 -터치 이벤트를 활성화 하려면, 컴포넌트를 렌더하기 전에

144 -`React.initializeTouchEvents(true)`를 호출하세요.

145 -

143 이벤트 이름:

144

145 ```

docs/docs/ref-09-glossary.ko-KR.md

+8 -8

@@ -24,7 +24,7 @@ var root = React.createElement('div');

24 DOM에 새로운 트리를 렌더링하기 위해서는 `ReactElement`를 만들고 일반적인 DOM `Element` (`HTMLElement` 또는 `SVGElement`)와 함께 `React.render`에 넘깁니다. `ReactElement`를 DOM `Element`와 혼동해서는 안됩니다. `ReactElement`는 가볍고, 상태를 갖지 않으며, 변경 불가능한, DOM `Element`의 가상 표현입니다. 즉 가상 DOM입니다.

26 ```javascript

27 -React.render(root, document.body);

27 +React.render(root, document.getElementById('example'));

28 ```

30 DOM 엘리먼트에 프로퍼티를 추가하려면 두번째 인자로 프로퍼티 객체를, 세번째 인자로 자식을 넘깁니다.

@@ -32,7 +32,7 @@ DOM 엘리먼트에 프로퍼티를 추가하려면 두번째 인자로 프로

32 ```javascript

33 var child = React.createElement('li', null, 'Text Content');

34 var root = React.createElement('ul', { className: 'my-list' }, child);

35 -React.render(root, document.body);

35 +React.render(root, document.getElementById('example'));

36 ```

38 React JSX를 사용하면 `ReactElement`가 알아서 만들어집니다. 따라서 다음 코드는 앞의 코드와 같습니다:

@@ -41,7 +41,7 @@ React JSX를 사용하면 `ReactElement`가 알아서 만들어집니다. 따라

41 var root = <ul className="my-list">

42 <li>Text Content</li>

43 </ul>;

44 -React.render(root, document.body);

44 +React.render(root, document.getElementById('example'));

45 ```

47 __팩토리__

@@ -49,7 +49,7 @@ __팩토리__

49 `ReactElement` 팩토리는 그저 특정한 `type` 프로퍼티를 가지는 `ReactElement`를 만들어주는 함수입니다. React에는 팩토리를 만드는 헬퍼가 내장되어 있습니다. 그 함수는 사실상 다음과 같습니다:

51 ```javascript

52 -function createFactory(type){

52 +function createFactory(type) {

53 return React.createElement.bind(null, type);

54 }

55 ```

@@ -59,7 +59,7 @@ function createFactory(type){

59 ```javascript

60 var div = React.createFactory('div');

61 var root = div({ className: 'my-div' });

62 -React.render(root, document.body);

62 +React.render(root, document.getElementById('example'));

63 ```

65 React에는 이미 보통의 HTML 태그를 위한 팩토리가 내장되어 있습니다:

@@ -122,14 +122,14 @@ var element = <MyComponent />;

122 이것이 `React.render`에 넘겨지면 React가 알아서 생성자를 호출하여 `ReactComponent`를 만들고 리턴합니다.

123

124 ```javascript

125 -var component = React.render(element, document.body);

125 +var component = React.render(element, document.getElementById('example'));

126 ```

127

128 같은 타입의 `ReactElement`와 같은 컨테이너 DOM `Element`를 가지고 `React.render`를 계속 호출하면 항상 같은 인스턴스를 리턴합니다. 이 인스턴스는 상태를 가집니다.

129

130 ```javascript

131 -var componentA = React.render(<MyComponent />, document.body);

132 -var componentB = React.render(<MyComponent />, document.body);

131 +var componentA = React.render(<MyComponent />, document.getElementById('example'));

132 +var componentB = React.render(<MyComponent />, document.getElementById('example'));

133 componentA === componentB; // true

134 ```

135

docs/docs/tutorial.ko-KR.md

+1 -1

@@ -41,7 +41,7 @@ next: thinking-in-react-ko-KR.html

41 <title>Hello React</title>

42 <script src="http://fb.me/react-{{site.react_version}}.js"></script>

43 <script src="http://fb.me/JSXTransformer-{{site.react_version}}.js"></script>

44 - <script src="http://code.jquery.com/jquery-1.10.0.min.js"></script>

44 + <script src="https://code.jquery.com/jquery-2.1.3.min.js"></script>

45 </head>

46 <body>

47 <div id="content"></div>

docs/docs/videos.ko-KR.md

+39 -12

@@ -8,28 +8,34 @@ next: complementary-tools-ko-KR.html

9 ### Rethinking best practices - JSConf.eu

11 -<iframe width="650" height="315" src="//www.youtube.com/embed/x7cQ3mrcKaY" frameborder="0" allowfullscreen></iframe>

11 +<iframe width="650" height="366" src="https://www.youtube.com/embed/x7cQ3mrcKaY" frameborder="0" allowfullscreen></iframe>

13 "페이스북과 인스타그램에서, 우리는 React 를 이용해 웹에서 벌어질 수 있는 한계를 뛰어넘으려 노력하고 있습니다. 저는 프레임워크에 대한 짤막한 소개로 시작해서, 논쟁이 벌어질 수 있는 다음의 세가지 주제로 넘어갈겁니다. 템플릿의 개념을 버리고 Javascript 를 이용해 View 를 구축하기, 자료가 변할때 전체 어플리케이션을 다시 그리기(“re-rendering”), 그리고 DOM과 events의 경량화된 구현 입니다." -- [Pete Hunt](http://www.petehunt.net/)

15 +* * *

16 +

17 ### Thinking in react - tagtree.tv

19 [tagtree.tv](http://tagtree.tv/)의 비디오는 간단한 어플리케이션을 구성하면서 [Thinking in React](/react/docs/thinking-in-react-ko-KR.html)의 원리들을 전달합니다.

20 <figure>[![](/react/img/docs/thinking-in-react-tagtree.png)](http://tagtree.tv/thinking-in-react)</figure>

22 +* * *

24 ### Secrets of the Virtual DOM - MtnWest JS

23 -<iframe width="560" height="315" src="//www.youtube.com/embed/h3KksH8gfcQ" frameborder="0" allowfullscreen></iframe>

26 +<iframe width="650" height="366" src="https://www.youtube.com/embed/h3KksH8gfcQ" frameborder="0" allowfullscreen></iframe>

28 "이번에는 왜 우리가 virtual DOM을 만들었는지, 이것이 다른 시스템들과는 어떻게 다른지, 그리고 브라우져 기술들의 미래와 어떻게 관련이 있는지에 대해서 이야기 해 볼 겁니다." -- [Pete Hunt](http://www.petehunt.net/)

30 +* * *

32 ### Going big with React

34 "이 발표에서, 이 모든 JS 프레임워크가 다음을 약속하는것처럼 보입니다: 꺠끗한 구현들, 빠른 코드 디자인, 완전한 수행. 그런데 당신이 Javascript 스트레스 테스트를 할때, 어떤 일이 발생합니까? 혹은 6MB의 코드를 던지면 무슨일이 발생합니까? 이번에는 높은 스트레스 환경에서 React가 어떻게 작동하는지, 그리고 이것이 우리 팀이 방대한 크기의 코드를 안전하게 구성하는데 어떻게 도움이 되어줄지를 조사해 볼겁니다."

35 [![](https://i.vimeocdn.com/video/481670116_650.jpg)](https://skillsmatter.com/skillscasts/5429-going-big-with-react#video)

37 +* * *

38 +

39 ### CodeWinds

41 CodeWinds Episode 4 에서 [Pete Hunt](http://www.petehunt.net/)와 [Jeff Barczewski](http://jeff.barczewski.com/)가 React에 대해서 이야기 합니다.

@@ -62,6 +68,7 @@ CodeWinds Episode 4 에서 [Pete Hunt](http://www.petehunt.net/)와 [Jeff Barcze

69 [방송 자료 읽어보기](http://codewinds.com/4)

71 +* * *

73 ### JavaScript Jabber

@@ -90,58 +97,78 @@ Javascript Jabber 73에서 [Pete Hunt](http://www.petehunt.net/)와 [Jordan Walk

98 [전체 기록 읽어보기](http://javascriptjabber.com/073-jsj-react-with-pete-hunt-and-jordan-walke/)

100 +* * *

101 +

102 ### Introduction to React.js - Facebook Seattle

103

95 -<iframe width="650" height="315" src="//www.youtube.com/embed/XxVg_s8xAms" frameborder="0" allowfullscreen></iframe>

104 +<iframe width="650" height="366" src="https://www.youtube.com/embed/XxVg_s8xAms" frameborder="0" allowfullscreen></iframe>

105

106 By [Tom Occhino](http://tomocchino.com/), [Jordan Walke](https://github.com/jordwalke)

107

108 +* * *

109 +

110 ### Backbone + React + Middleman Screencast

100 -<iframe width="650" height="315" src="//www.youtube.com/embed/iul1fWHVU6A" frameborder="0" allowfullscreen></iframe>

111 +<iframe width="650" height="488" src="https://www.youtube.com/embed/iul1fWHVU6A" frameborder="0" allowfullscreen></iframe>

112

113 Backbone은 React로 REST API를 제공하기 위한 아주 좋은 방법입니다. 이 화면중개는 [Backbone-React-Component](https://github.com/magalhas/backbone-react-component)을 이용해서 어떻게 이 두가지를 병합하는지 보여줍니다. Middleman은 이 예제에서 사용되는 프레임워크이지만, 쉽게 다른 프레임워크로 대체하실 수 있습니다. 지원되는 템플릿은 [이곳](https://github.com/jbhatab/middleman-backbone-react-template)에서 찾으실 수 있습니다. -- [열린 마음의 혁명들](http://www.openmindedinnovations.com/)

114

115 +* * *

116 +

117 ### Developing User Interfaces With React - Super VanJS

118

106 -<iframe width="650" height="315" src="//www.youtube.com/embed/1OeXsL5mr4g" frameborder="0" allowfullscreen></iframe>

119 +<iframe width="650" height="366" src="https://www.youtube.com/embed/1OeXsL5mr4g" frameborder="0" allowfullscreen></iframe>

120

121 By [Steven Luscher](https://github.com/steveluscher)

122

123 +* * *

124 +

125 ### Introduction to React - LAWebSpeed meetup

126

112 -<iframe width="650" height="315" src="//www.youtube.com/embed/SMMRJif5QW0" frameborder="0" allowfullscreen></iframe>

127 +<iframe width="650" height="366" src="https://www.youtube.com/embed/SMMRJif5QW0" frameborder="0" allowfullscreen></iframe>

128

129 by [Stoyan Stefanov](http://www.phpied.com/)

130

131 +* * *

132 +

133 ### React, or how to make life simpler - FrontEnd Dev Conf '14

134

118 -<iframe width="560" height="315" src="//www.youtube.com/embed/YJNUK0EA_Jo" frameborder="0" allowfullscreen></iframe>

135 +<iframe width="560" height="366" src="https://www.youtube.com/embed/YJNUK0EA_Jo" frameborder="0" allowfullscreen></iframe>

136

137 **러시아어** by [Alexander Solovyov](http://solovyov.net/)

138

139 +* * *

140 +

141 ### "Functional DOM programming" - Meteor DevShop 11

142

124 -<iframe width="650" height="315" src="//www.youtube.com/embed/qqVbr_LaCIo" frameborder="0" allowfullscreen></iframe>

143 +<iframe width="650" height="366" src="https://www.youtube.com/embed/qqVbr_LaCIo" frameborder="0" allowfullscreen></iframe>

144 +

145 +* * *

146

147 ### "Rethinking Web App Development at Facebook" - Facebook F8 Conference 2014

148

128 -<iframe width="650" height="315" src="//www.youtube.com/embed/nYkdrAPrdcw" frameborder="0" allowfullscreen></iframe>

149 +<iframe width="650" height="366" src="https://www.youtube.com/embed/nYkdrAPrdcw" frameborder="0" allowfullscreen></iframe>

150 +

151 +* * *

152

153 ### React and Flux: Building Applications with a Unidirectional Data Flow - Forward JS 2014

154

132 -<iframe width="650" height="315" src="//www.youtube.com/embed/i__969noyAM" frameborder="0" allowfullscreen></iframe>

155 +<iframe width="650" height="366" src="https://www.youtube.com/embed/i__969noyAM" frameborder="0" allowfullscreen></iframe>

156

157 Facebook 개발자 [Bill Fisher](http://twitter.com/fisherwebdev)와 [Jing Chen](http://twitter.com/jingc)가 Flux 와 React 에 대해서 이야기합니다. 그리고 어떻게 단일 방향의 자료흐름을 사용하는 어플리케이션 구조가 방대한 코드를 정리하는지에 대해서 이야기합니다."

158

159 +* * *

160 +

161 ### Server-Side Rendering of Isomorphic Apps at SoundCloud

162

138 -<iframe src="//player.vimeo.com/video/108488724" width="500" height="281" frameborder="0" allowfullscreen></iframe>

163 +<iframe src="https://player.vimeo.com/video/108488724" width="650" height="365" frameborder="0" allowfullscreen></iframe>

164

165 Server-side rendering을 위해 [SoundCloud](https://developers.soundcloud.com/blog/)가 React 와 Flux를 사용하는지 by [Andres Suarez](https://github.com/zertosh)

166 [발표 자료와 예제 코드](https://github.com/zertosh/ssr-demo-kit)

167

168 +* * *

169 +

170 ### Introducing React Native (+Playlist) - React.js Conf 2015

171

145 -<iframe width="650" height="315" src="//www.youtube.com/watch?v=KVZ-P-ZI6W4&index=1&list=PLb0IAmt7-GS1cbw4qonlQztYV1TAW0sCr" frameborder="0" allowfullscreen></iframe>

172 +<iframe width="650" height="366" src="https://www.youtube.com/watch?v=KVZ-P-ZI6W4&index=1&list=PLb0IAmt7-GS1cbw4qonlQztYV1TAW0sCr" frameborder="0" allowfullscreen></iframe>

173

174 2015년에 [Tom Occhino](https://twitter.com/tomocchino)님이 React의 과거와 현재를 리뷰하고 나아갈 방향을 제시했습니다.