Translate Home page example

content/home/examples/a-component-using-external-plugins.js

@@ -17,16 +17,16 @@ class MarkdownEditor extends React.Component {
   render() {
     return (
       <div className="MarkdownEditor">
-        <h3>Input</h3>
+        <h3>Đầu vào</h3>
         <label htmlFor="markdown-content">
-          Enter some markdown
+          Nhập dưới dạng markdown
         </label>
         <textarea
           id="markdown-content"
           onChange={this.handleChange}
           defaultValue={this.state.value}
         />
-        <h3>Output</h3>
+        <h3>Kết Quả</h3>
         <div
           className="content"
           dangerouslySetInnerHTML={this.getRawMarkup()}

content/home/examples/a-simple-component.js

@@ -2,7 +2,7 @@ class HelloMessage extends React.Component {
   render() {
     return (
       <div>
-        Hello {this.props.name}
+        Xin chào {this.props.name}
       </div>
     );
   }

content/home/examples/a-stateful-component.js

@@ -21,7 +21,7 @@ class Timer extends React.Component {
   render() {
     return (
       <div>
-        Seconds: {this.state.seconds}
+        Giây: {this.state.seconds}
       </div>
     );
   }
@@ -30,4 +30,4 @@ class Timer extends React.Component {
 ReactDOM.render(
   <Timer />,
   document.getElementById('timer-example')
-);
+);

content/home/examples/an-application.js

@@ -9,19 +9,19 @@ class TodoApp extends React.Component {
   render() {
     return (
       <div>
-        <h3>TODO</h3>
+        <h3>Danh sách công việc</h3>
         <TodoList items={this.state.items} />
         <form onSubmit={this.handleSubmit}>
           <label htmlFor="new-todo">
-            What needs to be done?
+            Bạn cần làm gì?
           </label>
           <input
             id="new-todo"
             onChange={this.handleChange}
             value={this.state.text}
           />
           <button>
-            Add #{this.state.items.length + 1}
+            Thêm #{this.state.items.length + 1}
           </button>
         </form>
       </div>

src/components/CodeEditor/CodeEditor.js

@@ -105,7 +105,7 @@ class CodeEditor extends Component {
                 color: colors.white,
               }}>
               <MetaTitle onDark={true}>
-                Live JSX Editor
+                Trình Chỉnh Sửa JSX
                 <label
                   css={{
                     fontSize: 14,
@@ -206,7 +206,7 @@ class CodeEditor extends Component {
                   padding: '0 10px',
                   backgroundColor: colors.divider,
                 }}>
-                <MetaTitle>Result</MetaTitle>
+                <MetaTitle>Kết quả</MetaTitle>
               </div>
               <div
                 id={containerNodeID}