Fix line highlighting in code blocks due to addition of extra example code
Jon Scott Clark committed
Apr 22, 2015 at 10:45 UTC
f4a6644f4e352430296305b93262b947d902516b
3 files changed
+15
-15
docs/docs/tutorial.ja-JP.md
+5
-5
@@ -387,7 +387,7 @@ var CommentBox = React.createClass({
387
388
注意: ここからは AJAX アプリケーションを作っていくので、自分のファイルシステム上ではなく Web サーバを使ってアプリを作る必要があります。残りのチュートリアルに必要な機能は [冒頭で紹介した](#running-a-server) サーバに含まれています。ソースコードは [GitHub に](https://github.com/reactjs/react-tutorial/)用意してあります。
389
390
-```javascript{6-17}
390
+```javascript{6-18}
391
// tutorial13.js
392
var CommentBox = React.createClass({
393
getInitialState: function() {
@@ -420,7 +420,7 @@ var CommentBox = React.createClass({
420
421
さて、`componentDidMount` はコンポーネントがレンダリングされたときに React が自動的に呼び出すメソッドです。動的な更新の鍵となるのは `this.setState()` の呼び出し方です。ここでは、古いコメントの配列をサーバから取ってきた新しい配列に置き換え、UI を自動的に更新させてみましょう。このような reactivity（反応性・柔軟性）のおかげで、リアルタイム更新を最小限にすることが出来ます。次のコードではシンプルなポーリングをしていますが、WebSockets や他の方法でも簡単に実現できます。
422
423
-```javascript{3,14,19-20,34}
423
+```javascript{3,15,20-21,35}
424
// tutorial14.js
425
var CommentBox = React.createClass({
426
loadCommentsFromServer: function() {
@@ -527,7 +527,7 @@ React がコンポーネントにイベントハンドラを登録する際は c
527
528
ここでは子のコンポーネントから親に向かって、いつもとは逆方向にデータを返す必要があります。まず、親のコンポーネントに新しいコールバック関数（`handleCommentSubmit`）を定義します。続いて `render` メソッド内にある子のコンポーネントにコールバックを渡すことで、`onCommentSubmit` イベントとコールバックを結び付けています。こうすることで、イベントが発生するたびにコールバックが呼び出されます。
529
530
-```javascript{15-17,30}
530
+```javascript{16-18,31}
531
// tutorial17.js
532
var CommentBox = React.createClass({
533
loadCommentsFromServer: function() {
@@ -596,7 +596,7 @@ var CommentForm = React.createClass({
596
597
こうしてコールバックが出来たので、あとはサーバにコメントを送信してリストをリフレッシュすれば完璧です。
598
599
-```javascript{16-27}
599
+```javascript{17-28}
600
// tutorial19.js
601
var CommentBox = React.createClass({
602
loadCommentsFromServer: function() {
@@ -649,7 +649,7 @@ var CommentBox = React.createClass({
649
650
アプリケーションに必要な機能は一通り実装できました。しかし、フォームからコメントを送信しても、サーバからのレスポンスが来るまで自分のコメントはリストに載らないため、アプリの動作は遅く感じます。ここでは、送信したコメントをリストに先読みさせて、アプリの体感速度をアップさせましょう。
651
652
-```javascript{16-18}
652
+```javascript{17-19}
653
// tutorial20.js
654
var CommentBox = React.createClass({
655
loadCommentsFromServer: function() {
docs/docs/tutorial.ko-KR.md
+5
-5
@@ -388,7 +388,7 @@ var CommentBox = React.createClass({
388
389
주의: 우리의 앱이 AJAX 애플리케이션으로 변화하고 있기 때문에, 이제 파일 시스템의 파일을 참조하는 대신 웹서버를 사용하도록 앱을 개발해야 합니다. [위에서 언급한 바와 같이](#running-a-server), 우리는 튜토리얼의 나머지 부분에 필요한 기능을 제공하는 서버를 몇 가지 준비해 놓았습니다. [GitHub에 올려놓았으니](https://github.com/reactjs/react-tutorial) 확인해 보세요.
390
391
-```javascript{6-17}
391
+```javascript{6-18}
392
// tutorial13.js
393
var CommentBox = React.createClass({
394
getInitialState: function() {
@@ -421,7 +421,7 @@ var CommentBox = React.createClass({
421
422
여기서 `componentDidMount`는 컴포넌트가 렌더링 된 다음 React에 의해 자동으로 호출되는 메소드입니다. 동적 업데이트의 핵심은 `this.setState()`의 호출입니다. 우리가 이전의 댓글 목록을 서버에서 넘어온 새로운 목록으로 변경하면 자동으로 UI가 업데이트 될 것입니다. 이 반응성 덕분에 실시간 업데이트에 아주 작은 수정만 가해집니다. 우리는 여기선 간단한 폴링을 사용할 것이지만 웹소켓등의 다른 기술도 쉽게 사용할 수 있습니다.
423
424
-```javascript{3,14,19-20,34}
424
+```javascript{3,15,20-21,35}
425
// tutorial14.js
426
var CommentBox = React.createClass({
427
loadCommentsFromServer: function() {
@@ -528,7 +528,7 @@ React는 카멜케이스 네이밍 컨벤션으로 컴포넌트에 이벤트 핸
528
529
자식 컴포넌트가 그의 부모에게 데이터를 넘겨줄 필요가 있습니다. 부모의 `render` 메소드에서 새로운 콜백(`handleCommentSubmit`)을 자식에게 넘겨주고, 자식의 `onCommentSubmit` 이벤트에 그것을 바인딩해주는 식으로 구현합니다. 이벤트가 작동될때(triggered)마다, 콜백이 호출됩니다:
530
531
-```javascript{15-17,30}
531
+```javascript{16-18,31}
532
// tutorial17.js
533
var CommentBox = React.createClass({
534
loadCommentsFromServer: function() {
@@ -597,7 +597,7 @@ var CommentForm = React.createClass({
597
598
이제 콜백이 제자리를 찾았습니다. 우리가 할 일은 서버에 요청을 날리고 목록을 업데이트하는 것 뿐입니다:
599
600
-```javascript{16-27}
600
+```javascript{17-28}
601
// tutorial19.js
602
var CommentBox = React.createClass({
603
loadCommentsFromServer: function() {
@@ -650,7 +650,7 @@ var CommentBox = React.createClass({
650
651
우리의 애플리케이션은 이제 모든 기능을 갖추었습니다. 하지만 댓글이 목록에 업데이트되기 전에 완료요청을 기다리는 게 조금 느린듯한 느낌이 드네요. 우리는 낙관적 업데이트를 통해 댓글이 목록에 추가되도록 함으로써 앱이 좀 더 빨라진 것처럼 느껴지도록 할 수 있습니다.
652
653
-```javascript{16-18}
653
+```javascript{17-19}
654
// tutorial20.js
655
var CommentBox = React.createClass({
656
loadCommentsFromServer: function() {
docs/docs/tutorial.md
+5
-5
@@ -385,7 +385,7 @@ We'll use jQuery to help make an asynchronous request to the server.
385
386
Note: because this is becoming an AJAX application you'll need to develop your app using a web server rather than as a file sitting on your file system. [As mentioned above](#running-a-server), we have provided several servers you can use [on GitHub](https://github.com/reactjs/react-tutorial/). They provide the functionality you need for the rest of this tutorial.
387
388
-```javascript{6-17}
388
+```javascript{6-18}
389
// tutorial13.js
390
var CommentBox = React.createClass({
391
getInitialState: function() {
@@ -418,7 +418,7 @@ var CommentBox = React.createClass({
418
419
Here, `componentDidMount` is a method called automatically by React when a component is rendered. The key to dynamic updates is the call to `this.setState()`. We replace the old array of comments with the new one from the server and the UI automatically updates itself. Because of this reactivity, it is only a minor change to add live updates. We will use simple polling here but you could easily use WebSockets or other technologies.
420
421
-```javascript{3,14,19-20,34}
421
+```javascript{3,15,20-21,35}
422
// tutorial14.js
423
var CommentBox = React.createClass({
424
loadCommentsFromServer: function() {
@@ -525,7 +525,7 @@ When a user submits a comment, we will need to refresh the list of comments to i
525
526
We need to pass data from the child component back up to its parent. We do this in our parent's `render` method by passing a new callback (`handleCommentSubmit`) into the child, binding it to the child's `onCommentSubmit` event. Whenever the event is triggered, the callback will be invoked:
527
528
-```javascript{15-17,30}
528
+```javascript{16-18,31}
529
// tutorial17.js
530
var CommentBox = React.createClass({
531
loadCommentsFromServer: function() {
@@ -594,7 +594,7 @@ var CommentForm = React.createClass({
594
595
Now that the callbacks are in place, all we have to do is submit to the server and refresh the list:
596
597
-```javascript{16-27}
597
+```javascript{17-28}
598
// tutorial19.js
599
var CommentBox = React.createClass({
600
loadCommentsFromServer: function() {
@@ -647,7 +647,7 @@ var CommentBox = React.createClass({
647
648
Our application is now feature complete but it feels slow to have to wait for the request to complete before your comment appears in the list. We can optimistically add this comment to the list to make the app feel faster.
649
650
-```javascript{16-18}
650
+```javascript{17-19}
651
// tutorial20.js
652
var CommentBox = React.createClass({
653
loadCommentsFromServer: function() {