From 986c636e6d29ee1c5d7c6ba7c9e196adf90fff59 Mon Sep 17 00:00:00 2001
From: helios1101 <harshit.singh1101@gmail.com>
Date: Fri, 8 Mar 2019 01:08:40 +0530
Subject: [PATCH 01/16] Initial Vocabs Changes

---
 content/docs/components-and-props.md | 60 ++++++++++++++--------------
 1 file changed, 30 insertions(+), 30 deletions(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index 4b3bbb6e6..89da036e4 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -16,13 +16,13 @@ prev: rendering-elements.html
 next: state-and-lifecycle.html
 ---
 
-Components let you split the UI into independent, reusable pieces, and think about each piece in isolation. This page provides an introduction to the idea of components. You can find a [detailed component API reference here](/docs/react-component.html).
+कौम्पोनॅन्टस let you split the UI into independent, reusable pieces, and think about each piece in isolation. This page provides an introduction to the idea of कौम्पोनॅन्टस. You can find a [detailed कौम्पोनॅन्ट API reference here](/docs/react-component.html).
 
-Conceptually, components are like JavaScript functions. They accept arbitrary inputs (called "props") and return React elements describing what should appear on the screen.
+Conceptually, कौम्पोनॅन्टस are like जावास्क्रिप्ट functions. They accept arbitrary inputs (called "props") and return React elements describing what should appear on the screen.
 
-## Function and Class Components {#function-and-class-components}
+## Function and Class कौम्पोनॅन्टस {#function-and-class-components}
 
-The simplest way to define a component is to write a JavaScript function:
+The simplest way to define a कौम्पोनॅन्ट is to write a जावास्क्रिप्ट function:
 
 ```js
 function Welcome(props) {
@@ -30,9 +30,9 @@ function Welcome(props) {
 }
 ```
 
-This function is a valid React component because it accepts a single "props" (which stands for properties) object argument with data and returns a React element. We call such components "function components" because they are literally JavaScript functions.
+This function is a valid React कौम्पोनॅन्ट because it accepts a single "props" (which stands for properties) object argument with data and returns a React element. We call such कौम्पोनॅन्टस "function कौम्पोनॅन्टस" because they are literally जावास्क्रिप्ट functions.
 
-You can also use an [ES6 class](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Classes) to define a component:
+You can also use an [ES6 class](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Classes) to define a कौम्पोनॅन्ट:
 
 ```js
 class Welcome extends React.Component {
@@ -42,11 +42,11 @@ class Welcome extends React.Component {
 }
 ```
 
-The above two components are equivalent from React's point of view.
+The above two कौम्पोनॅन्टस are equivalent from React's point of view.
 
-Classes have some additional features that we will discuss in the [next sections](/docs/state-and-lifecycle.html). Until then, we will use function components for their conciseness.
+Classes have some additional features that we will discuss in the [next sections](/docs/state-and-lifecycle.html). Until then, we will use function कौम्पोनॅन्टस for their conciseness.
 
-## Rendering a Component {#rendering-a-component}
+## Rendering a कौम्पोनॅन्ट {#rendering-a-component}
 
 Previously, we only encountered React elements that represent DOM tags:
 
@@ -54,15 +54,15 @@ Previously, we only encountered React elements that represent DOM tags:
 const element = <div />;
 ```
 
-However, elements can also represent user-defined components:
+However, elements can also represent user-defined कौम्पोनॅन्टस:
 
 ```js
 const element = <Welcome name="Sara" />;
 ```
 
-When React sees an element representing a user-defined component, it passes JSX attributes to this component as a single object. We call this object "props".
+When React sees an element representing a user-defined कौम्पोनॅन्ट, it passes JSX attributes to this कौम्पोनॅन्ट as a single object. We call this object "props".
 
-For example, this code renders "Hello, Sara" on the page:
+For example, this code रेंडरस "Hello, Sara" on the page:
 
 ```js{1,5}
 function Welcome(props) {
@@ -81,21 +81,21 @@ ReactDOM.render(
 Let's recap what happens in this example:
 
 1. We call `ReactDOM.render()` with the `<Welcome name="Sara" />` element.
-2. React calls the `Welcome` component with `{name: 'Sara'}` as the props.
-3. Our `Welcome` component returns a `<h1>Hello, Sara</h1>` element as the result.
+2. React calls the `Welcome` कौम्पोनॅन्ट with `{name: 'Sara'}` as the props.
+3. Our `Welcome` रेंडरस returns a `<h1>Hello, Sara</h1>` element as the result.
 4. React DOM efficiently updates the DOM to match `<h1>Hello, Sara</h1>`.
 
->**Note:** Always start component names with a capital letter.
+>**Note:** Always start रेंडरस names with a capital letter.
 >
->React treats components starting with lowercase letters as DOM tags. For example, `<div />` represents an HTML div tag, but `<Welcome />` represents a component and requires `Welcome` to be in scope.
+>React treats कौम्पोनॅन्टस starting with lowercase letters as DOM tags. For example, `<div />` represents an HTML div tag, but `<Welcome />` represents a रेंडरस and requires `Welcome` to be in scope.
 >
 >To learn more about the reasoning behind this convention, please read [JSX In Depth](/docs/jsx-in-depth.html#user-defined-components-must-be-capitalized).
 
-## Composing Components {#composing-components}
+## Composing कौम्पोनॅन्टस {#composing-components}
 
-Components can refer to other components in their output. This lets us use the same component abstraction for any level of detail. A button, a form, a dialog, a screen: in React apps, all those are commonly expressed as components.
+कौम्पोनॅन्टस can refer to other कौम्पोनॅन्टस in their output. This lets us use the same रेंडरस abstraction for any level of detail. A button, a form, a dialog, a screen: in React apps, all those are commonly expressed as कौम्पोनॅन्टस.
 
-For example, we can create an `App` component that renders `Welcome` many times:
+For example, we can create an `App` रेंडरस that रेंडरस `Welcome` many times:
 
 ```js{8-10}
 function Welcome(props) {
@@ -120,13 +120,13 @@ ReactDOM.render(
 
 [](codepen://components-and-props/composing-components)
 
-Typically, new React apps have a single `App` component at the very top. However, if you integrate React into an existing app, you might start bottom-up with a small component like `Button` and gradually work your way to the top of the view hierarchy.
+Typically, new React apps have a single `App` रेंडरस at the very top. However, if you integrate React into an existing app, you might start bottom-up with a small रेंडरस like `Button` and gradually work your way to the top of the view hierarchy.
 
-## Extracting Components {#extracting-components}
+## Extracting कौम्पोनॅन्टस {#extracting-components}
 
-Don't be afraid to split components into smaller components.
+Don't be afraid to split कौम्पोनॅन्टस into smaller कौम्पोनॅन्टस.
 
-For example, consider this `Comment` component:
+For example, consider this `Comment` रेंडरस:
 
 ```js
 function Comment(props) {
@@ -156,7 +156,7 @@ function Comment(props) {
 
 It accepts `author` (an object), `text` (a string), and `date` (a date) as props, and describes a comment on a social media website.
 
-This component can be tricky to change because of all the nesting, and it is also hard to reuse individual parts of it. Let's extract a few components from it.
+This रेंडरस can be tricky to change because of all the nesting, and it is also hard to reuse individual parts of it. Let's extract a few कौम्पोनॅन्टस from it.
 
 First, we will extract `Avatar`:
 
@@ -173,7 +173,7 @@ function Avatar(props) {
 
 The `Avatar` doesn't need to know that it is being rendered inside a `Comment`. This is why we have given its prop a more generic name: `user` rather than `author`.
 
-We recommend naming props from the component's own point of view rather than the context in which it is being used.
+We recommend naming props from the रेंडरस's own point of view rather than the context in which it is being used.
 
 We can now simplify `Comment` a tiny bit:
 
@@ -198,7 +198,7 @@ function Comment(props) {
 }
 ```
 
-Next, we will extract a `UserInfo` component that renders an `Avatar` next to the user's name:
+Next, we will extract a `UserInfo` रेंडरस that रेंडरस an `Avatar` next to the user's name:
 
 ```js{3-8}
 function UserInfo(props) {
@@ -233,11 +233,11 @@ function Comment(props) {
 
 [](codepen://components-and-props/extracting-components-continued)
 
-Extracting components might seem like grunt work at first, but having a palette of reusable components pays off in larger apps. A good rule of thumb is that if a part of your UI is used several times (`Button`, `Panel`, `Avatar`), or is complex enough on its own (`App`, `FeedStory`, `Comment`), it is a good candidate to be a reusable component.
+Extracting कौम्पोनॅन्टस might seem like grunt work at first, but having a palette of reusable कौम्पोनॅन्टस pays off in larger apps. A good rule of thumb is that if a part of your UI is used several times (`Button`, `Panel`, `Avatar`), or is complex enough on its own (`App`, `FeedStory`, `Comment`), it is a good candidate to be a reusable कौम्पोनॅन्ट.
 
 ## Props are Read-Only {#props-are-read-only}
 
-Whether you declare a component [as a function or a class](#function-and-class-components), it must never modify its own props. Consider this `sum` function:
+Whether you declare a कौम्पोनॅन्ट [as a function or a class](#function-and-class-components), it must never modify its own props. Consider this `sum` function:
 
 ```js
 function sum(a, b) {
@@ -257,6 +257,6 @@ function withdraw(account, amount) {
 
 React is pretty flexible but it has a single strict rule:
 
-**All React components must act like pure functions with respect to their props.**
+**All React कौम्पोनॅन्टस must act like pure functions with respect to their props.**
 
-Of course, application UIs are dynamic and change over time. In the [next section](/docs/state-and-lifecycle.html), we will introduce a new concept of "state". State allows React components to change their output over time in response to user actions, network responses, and anything else, without violating this rule.
+Of course, application UIs are dynamic and change over time. In the [next section](/docs/state-and-lifecycle.html), we will introduce a new concept of "state". State allows React कौम्पोनॅन्टस to change their output over time in response to user actions, network responses, and anything else, without violating this rule.

From 162ed0eae988a8d74ec80b0e4f79c91fe31e7bd1 Mon Sep 17 00:00:00 2001
From: helios1101 <harshit.singh1101@gmail.com>
Date: Fri, 8 Mar 2019 02:45:47 +0530
Subject: [PATCH 02/16] Rendering section to be started

---
 content/docs/components-and-props.md | 43 +++++++++++++++-------------
 1 file changed, 23 insertions(+), 20 deletions(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index 89da036e4..3fb0e7b20 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -1,6 +1,6 @@
 ---
 id: components-and-props
-title: Components and Props
+title: कौम्पोनॅन्ट तथा Props
 permalink: docs/components-and-props.html
 redirect_from:
   - "docs/reusable-components.html"
@@ -16,35 +16,38 @@ prev: rendering-elements.html
 next: state-and-lifecycle.html
 ---
 
-कौम्पोनॅन्टस let you split the UI into independent, reusable pieces, and think about each piece in isolation. This page provides an introduction to the idea of कौम्पोनॅन्टस. You can find a [detailed कौम्पोनॅन्ट API reference here](/docs/react-component.html).
+कौम्पोनॅन्टस हमें UI को स्वतंत्र, पुन: प्रयोज्य टुकड़ो में विभाजित करने में मदद करता है ,तथा
+हर हिस्से को अलग मानता है. यह पन्ना कौम्पोनॅन्टस का परिचय देता है. आप खोज सकते है [ विस्तृत कौम्पोनॅन्ट API reference यहाँ पर](/docs/react-component.html).
 
-Conceptually, कौम्पोनॅन्टस are like जावास्क्रिप्ट functions. They accept arbitrary inputs (called "props") and return React elements describing what should appear on the screen.
+सैद्धांतिक रूप से, कौम्पोनॅन्टस जावास्क्रिप्ट फंक्शन्स जैसा है. 
+वे अर्बिट्ररी इनपुट्स स्वीकार करते है (जिससे "props" बुलाया जाता है ) और वापस आती है React एलिमेंट्स जो वर्णन करती है की स्क्रीन पर क्या आना चाहिए.
 
-## Function and Class कौम्पोनॅन्टस {#function-and-class-components}
+## फंक्शन्स तथा कौम्पोनॅन्टस {#function-and-class-components}
 
-The simplest way to define a कौम्पोनॅन्ट is to write a जावास्क्रिप्ट function:
+सबसे सरल तरीका एक कौम्पोनॅन्ट को परिभाषित करने की यह है की एक  जावास्क्रिप्ट फंक्शन्स लिखी जाए:
 
 ```js
 function Welcome(props) {
-  return <h1>Hello, {props.name}</h1>;
+  return <h1>नमस्ते, {props.name}</h1>;
 }
 ```
 
-This function is a valid React कौम्पोनॅन्ट because it accepts a single "props" (which stands for properties) object argument with data and returns a React element. We call such कौम्पोनॅन्टस "function कौम्पोनॅन्टस" because they are literally जावास्क्रिप्ट functions.
+यह फंक्शन्स एक वैध React कौम्पोनॅन्ट है क्योकि यह स्वीकार करता है एक अकेला "props" (which stands for properties) object argument with data और वापस आती है React एलिमेंट्स. हम उन कौम्पोनॅन्टस "फंक्शन्स कहते है  कौम्पोनॅन्टस "फंक्शन्स कौम्पोनॅन्टस" क्योकि वो वाकई में एक जावास्क्रिप्ट फंक्शन्स है.
 
-You can also use an [ES6 class](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Classes) to define a कौम्पोनॅन्ट:
+
+आप भी उपयोग कर सकते हैं [ES6 class](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Classes) का ताकि परिभाषित कर सके कौम्पोनॅन्ट को:
 
 ```js
 class Welcome extends React.Component {
   render() {
-    return <h1>Hello, {this.props.name}</h1>;
+    return <h1>नमस्ते, {this.props.name}</h1>;
   }
 }
 ```
 
-The above two कौम्पोनॅन्टस are equivalent from React's point of view.
+ऊपर के दोनों कौम्पोनॅन्टस बराबर है React's दृष्टिकोण से.
 
-Classes have some additional features that we will discuss in the [next sections](/docs/state-and-lifecycle.html). Until then, we will use function कौम्पोनॅन्टस for their conciseness.
+Classes have some additional features that we will discuss in the [next sections](/docs/state-and-lifecycle.html). Until then, we will use फंक्शन्स कौम्पोनॅन्टस for their conciseness.
 
 ## Rendering a कौम्पोनॅन्ट {#rendering-a-component}
 
@@ -62,11 +65,11 @@ const element = <Welcome name="Sara" />;
 
 When React sees an element representing a user-defined कौम्पोनॅन्ट, it passes JSX attributes to this कौम्पोनॅन्ट as a single object. We call this object "props".
 
-For example, this code रेंडरस "Hello, Sara" on the page:
+For example, this code रेंडरस "नमस्ते, Sara" on the page:
 
 ```js{1,5}
 function Welcome(props) {
-  return <h1>Hello, {props.name}</h1>;
+  return <h1>नमस्ते, {props.name}</h1>;
 }
 
 const element = <Welcome name="Sara" />;
@@ -82,8 +85,8 @@ Let's recap what happens in this example:
 
 1. We call `ReactDOM.render()` with the `<Welcome name="Sara" />` element.
 2. React calls the `Welcome` कौम्पोनॅन्ट with `{name: 'Sara'}` as the props.
-3. Our `Welcome` रेंडरस returns a `<h1>Hello, Sara</h1>` element as the result.
-4. React DOM efficiently updates the DOM to match `<h1>Hello, Sara</h1>`.
+3. Our `Welcome` रेंडरस returns a `<h1>नमस्ते, Sara</h1>` element as the result.
+4. React DOM efficiently updates the DOM to match `<h1>नमस्ते, Sara</h1>`.
 
 >**Note:** Always start रेंडरस names with a capital letter.
 >
@@ -99,7 +102,7 @@ For example, we can create an `App` रेंडरस that रेंडरस `
 
 ```js{8-10}
 function Welcome(props) {
-  return <h1>Hello, {props.name}</h1>;
+  return <h1>नमस्ते, {props.name}</h1>;
 }
 
 function App() {
@@ -237,7 +240,7 @@ Extracting कौम्पोनॅन्टस might seem like grunt work at fi
 
 ## Props are Read-Only {#props-are-read-only}
 
-Whether you declare a कौम्पोनॅन्ट [as a function or a class](#function-and-class-components), it must never modify its own props. Consider this `sum` function:
+Whether you declare a कौम्पोनॅन्ट [as a फंक्शन्स or a class](#function-and-class-components), it must never modify its own props. Consider this `sum` फंक्शन्स:
 
 ```js
 function sum(a, b) {
@@ -245,9 +248,9 @@ function sum(a, b) {
 }
 ```
 
-Such functions are called ["pure"](https://en.wikipedia.org/wiki/Pure_function) because they do not attempt to change their inputs, and always return the same result for the same inputs.
+Such फंक्शन्स are called ["pure"](https://en.wikipedia.org/wiki/Pure_function) because they do not attempt to change their inputs, and always return the same result for the same inputs.
 
-In contrast, this function is impure because it changes its own input:
+In contrast, this फंक्शन्स is impure because it changes its own input:
 
 ```js
 function withdraw(account, amount) {
@@ -257,6 +260,6 @@ function withdraw(account, amount) {
 
 React is pretty flexible but it has a single strict rule:
 
-**All React कौम्पोनॅन्टस must act like pure functions with respect to their props.**
+**All React कौम्पोनॅन्टस must act like pure फंक्शन्स with respect to their props.**
 
 Of course, application UIs are dynamic and change over time. In the [next section](/docs/state-and-lifecycle.html), we will introduce a new concept of "state". State allows React कौम्पोनॅन्टस to change their output over time in response to user actions, network responses, and anything else, without violating this rule.

From 60e42d5b706df649b7efa9fdf99b79343c831cdf Mon Sep 17 00:00:00 2001
From: helios1101 <harshit.singh1101@gmail.com>
Date: Sat, 9 Mar 2019 03:31:39 +0530
Subject: [PATCH 03/16] Few more lines translated

---
 content/docs/components-and-props.md | 52 +++++++++++++++-------------
 1 file changed, 27 insertions(+), 25 deletions(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index 3fb0e7b20..86f1257e1 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -47,25 +47,25 @@ class Welcome extends React.Component {
 
 ऊपर के दोनों कौम्पोनॅन्टस बराबर है React's दृष्टिकोण से.
 
-Classes have some additional features that we will discuss in the [next sections](/docs/state-and-lifecycle.html). Until then, we will use फंक्शन्स कौम्पोनॅन्टस for their conciseness.
+Classes की कुछ अतिरिक्त विशेषताएं भी हैं जिसकी हम चर्चा करेंगे [अगले खंड](/docs/state-and-lifecycle.html) में. तब तक, हम इस्तेमाल करेंगे फंक्शन्स कौम्पोनॅन्टस के संक्षिप्ति होने का.
 
-## Rendering a कौम्पोनॅन्ट {#rendering-a-component}
+## कौम्पोनॅन्ट रेंडरिंग {#rendering-a-component}
 
-Previously, we only encountered React elements that represent DOM tags:
+इससे पहले, हमने केवल वही React एलिमेंट्स का सामना किया जो DOM टैग्स का दर्शाता था:
 
 ```js
 const element = <div />;
 ```
 
-However, elements can also represent user-defined कौम्पोनॅन्टस:
+हालाँकि, एलिमेंट्स उपयोगकर्ता परिभाषित कौम्पोनॅन्टस को भी दर्शा सकते है:
 
 ```js
 const element = <Welcome name="Sara" />;
 ```
 
-When React sees an element representing a user-defined कौम्पोनॅन्ट, it passes JSX attributes to this कौम्पोनॅन्ट as a single object. We call this object "props".
+जब कभी भी React देखता है एलिमेंट को यूजर-डिफाइंड  कौम्पोनॅन्ट का प्रतिनिधित्व करते हुए, it passes JSX attributes to this कौम्पोनॅन्ट as a single object. We call this object "props".
 
-For example, this code रेंडरस "नमस्ते, Sara" on the page:
+उदाहरण के लिए, यह कोड पेज पर रेंडर करता है "नमस्ते, Sara" :
 
 ```js{1,5}
 function Welcome(props) {
@@ -81,24 +81,24 @@ ReactDOM.render(
 
 [](codepen://components-and-props/rendering-a-component)
 
-Let's recap what happens in this example:
+चलो देकते है इस उदाहरण में क्या होता है:
 
-1. We call `ReactDOM.render()` with the `<Welcome name="Sara" />` element.
-2. React calls the `Welcome` कौम्पोनॅन्ट with `{name: 'Sara'}` as the props.
-3. Our `Welcome` रेंडरस returns a `<h1>नमस्ते, Sara</h1>` element as the result.
-4. React DOM efficiently updates the DOM to match `<h1>नमस्ते, Sara</h1>`.
+1. हम बुलाते है `ReactDOM.render()` को `<Welcome name="Sara" />` एलिमेंट्स से.
+2. React बुलाते है `Welcome` कौम्पोनॅन्ट को `name: 'Sara'}` के साथ props के रूप में.
+3. यह `Welcome` रेंडरस और वापस आती है `<h1>नमस्ते, Sara</h1>` एलिमेंट परिणाम के तौर पर .
+4. React DOM कुशलता पूर्वक DOM को अपडेट करता है `<h1>नमस्ते, Sara</h1>` से.
 
->**Note:** Always start रेंडरस names with a capital letter.
+>**Note:** हमेशा रेंडरस में नेम्स की शुरुवात कैपिटल लेटर से  होना चाहिए.
 >
->React treats कौम्पोनॅन्टस starting with lowercase letters as DOM tags. For example, `<div />` represents an HTML div tag, but `<Welcome />` represents a रेंडरस and requires `Welcome` to be in scope.
+>React उन कौम्पोनॅन्टस को जो लोअरकेस से स्टार्ट होते है उससे DOM टैग्स मानता है. उदाहरण के लिए, `<div />` HTML div टैग्स को दर्शाता है, पर `<Welcome />` दर्शाता है रेंडरस को और ज़रुरत होती है `Welcome` को दायरे में होने की.
 >
->To learn more about the reasoning behind this convention, please read [JSX In Depth](/docs/jsx-in-depth.html#user-defined-components-must-be-capitalized).
+>इस सम्मेलन के पीछे तर्क के बारे में अधिक जानने के लिए, कृपया पढ़ें [JSX गहराई में](/docs/jsx-in-depth.html#user-defined-components-must-be-capitalized).
 
-## Composing कौम्पोनॅन्टस {#composing-components}
+## कौम्पोनॅन्टस लिखना {#composing-components}
 
-कौम्पोनॅन्टस can refer to other कौम्पोनॅन्टस in their output. This lets us use the same रेंडरस abstraction for any level of detail. A button, a form, a dialog, a screen: in React apps, all those are commonly expressed as कौम्पोनॅन्टस.
+कौम्पोनॅन्टस अन्य कौम्पोनॅन्टस का उल्लेख कर सकते हैं अपने आउटपुट में. इससे हम उसी रेंडरस का उपयोग कर सकते हैं, विस्तार के किसी भी स्तर के लिए. एक बटन, फॉर्म, डायलॉग, स्क्रीन: React अप्प्स में, वे सब को आमतौर पर कौम्पोनॅन्टस के रूप में व्यक्त किया जाता है.
 
-For example, we can create an `App` रेंडरस that रेंडरस `Welcome` many times:
+उदाहरण के लिए, हम एक `App` बना सकते हैं जो रेंडरस करता है `Welcome` को कई बार:
 
 ```js{8-10}
 function Welcome(props) {
@@ -123,13 +123,13 @@ ReactDOM.render(
 
 [](codepen://components-and-props/composing-components)
 
-Typically, new React apps have a single `App` रेंडरस at the very top. However, if you integrate React into an existing app, you might start bottom-up with a small रेंडरस like `Button` and gradually work your way to the top of the view hierarchy.
+आम तौर पर, नया React अप्प्स के पास एक अकेला `App`  रेंडरस होता है सबसे ऊपर में. हालाँकि, अगर आप एकीकृत करते हैं React एक मौजूदा ऐप में, आप नीचे शुरू कर सकते छोटी चीज़ो के रेंडर्स से हैं जैसे `Button` और धीरे-धीरे दृश्य पदानुक्रम के ऊपर तक.
 
-## Extracting कौम्पोनॅन्टस {#extracting-components}
+## कौम्पोनॅन्टस निकालना {#extracting-components}
 
-Don't be afraid to split कौम्पोनॅन्टस into smaller कौम्पोनॅन्टस.
+कौम्पोनॅन्टस को छोटे छोटे कौम्पोनॅन्टस में विभाजित करने से डरना नहीं चाहिए.
 
-For example, consider this `Comment` रेंडरस:
+उदाहरण के लिए, इस पर विचार करो की `Comment` रेंडरस:
 
 ```js
 function Comment(props) {
@@ -157,11 +157,11 @@ function Comment(props) {
 
 [](codepen://components-and-props/extracting-components)
 
-It accepts `author` (an object), `text` (a string), and `date` (a date) as props, and describes a comment on a social media website.
+यह स्वीकार करता है `author` (एक ऑब्जेक्ट), `text` (एक स्ट्रिंग), और `date` (एक डेट) जैसे props, और सोशल मीडिया वेबसाइट पर एक टिप्पणी का वर्णन करता है.
 
-This रेंडरस can be tricky to change because of all the nesting, and it is also hard to reuse individual parts of it. Let's extract a few कौम्पोनॅन्टस from it.
+यह रेंडरस को बदलने के लिए मुश्किल हो सकता है क्योंकि एक के अंदर दूसरी संरचना के वजह से,तथा इसकी अकेली पार्ट्स का पुन: उपयोग करना भी कठिन है. चलो कुछ कौम्पोनॅन्टस निकालते हैं.
 
-First, we will extract `Avatar`:
+सबसे पहले, हम निकालेंगे `Avatar`:
 
 ```js{3-6}
 function Avatar(props) {
@@ -173,8 +173,10 @@ function Avatar(props) {
   );
 }
 ```
+ 
 
-The `Avatar` doesn't need to know that it is being rendered inside a `Comment`. This is why we have given its prop a more generic name: `user` rather than `author`.
+यह `Avatar` को जानने की जरूरत नहीं है कि यह एक `Comment` के अंदर रेंडर किया जा रहा है. इसलिए हमने इसके prop को एक ज्यादा सामान्य नाम दिया है : `user` 
+बजाय `author` के.
 
 We recommend naming props from the रेंडरस's own point of view rather than the context in which it is being used.
 

From 2f53d77f339f0db589015173296ec3b5faba1cd2 Mon Sep 17 00:00:00 2001
From: helios1101 <harshit.singh1101@gmail.com>
Date: Sat, 9 Mar 2019 04:41:01 +0530
Subject: [PATCH 04/16] Ready for review

---
 content/docs/components-and-props.md | 41 +++++++++++++++-------------
 1 file changed, 22 insertions(+), 19 deletions(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index 86f1257e1..c5f69e8ad 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -63,7 +63,7 @@ const element = <div />;
 const element = <Welcome name="Sara" />;
 ```
 
-जब कभी भी React देखता है एलिमेंट को यूजर-डिफाइंड  कौम्पोनॅन्ट का प्रतिनिधित्व करते हुए, it passes JSX attributes to this कौम्पोनॅन्ट as a single object. We call this object "props".
+जब कभी भी React देखता है एलिमेंट को यूजर-डिफाइंड  कौम्पोनॅन्ट का प्रतिनिधित्व करते हुए, यह JSX की विशेषताएँ पास करता है इस  कौम्पोनॅन्ट को एक object के रूप में. हम इस object को "props" कहते हैं .
 
 उदाहरण के लिए, यह कोड पेज पर रेंडर करता है "नमस्ते, Sara" :
 
@@ -88,9 +88,9 @@ ReactDOM.render(
 3. यह `Welcome` रेंडरस और वापस आती है `<h1>नमस्ते, Sara</h1>` एलिमेंट परिणाम के तौर पर .
 4. React DOM कुशलता पूर्वक DOM को अपडेट करता है `<h1>नमस्ते, Sara</h1>` से.
 
->**Note:** हमेशा रेंडरस में नेम्स की शुरुवात कैपिटल लेटर से  होना चाहिए.
+>**ध्यान दें:** हमेशा रेंडर की नाम की शुरुवात कैपिटल लेटर से होनी चाहिए.
 >
->React उन कौम्पोनॅन्टस को जो लोअरकेस से स्टार्ट होते है उससे DOM टैग्स मानता है. उदाहरण के लिए, `<div />` HTML div टैग्स को दर्शाता है, पर `<Welcome />` दर्शाता है रेंडरस को और ज़रुरत होती है `Welcome` को दायरे में होने की.
+>React उन कौम्पोनॅन्टस को जो लोअरकेस से स्टार्ट होते है उससे DOM टैग्स मानता है. उदाहरण के लिए, `<div />` HTML div टैग्स को दर्शाता है, पर `<Welcome />` दर्शाता है रेंडर को और ज़रुरत होती है `Welcome` को दायरे में होने की.
 >
 >इस सम्मेलन के पीछे तर्क के बारे में अधिक जानने के लिए, कृपया पढ़ें [JSX गहराई में](/docs/jsx-in-depth.html#user-defined-components-must-be-capitalized).
 
@@ -123,7 +123,7 @@ ReactDOM.render(
 
 [](codepen://components-and-props/composing-components)
 
-आम तौर पर, नया React अप्प्स के पास एक अकेला `App`  रेंडरस होता है सबसे ऊपर में. हालाँकि, अगर आप एकीकृत करते हैं React एक मौजूदा ऐप में, आप नीचे शुरू कर सकते छोटी चीज़ो के रेंडर्स से हैं जैसे `Button` और धीरे-धीरे दृश्य पदानुक्रम के ऊपर तक.
+आम तौर पर, नया React अप्प्स के पास एक अकेला `App`  रेंडर होता है सबसे ऊपर में. हालाँकि, अगर आप एकीकृत करते हैं React को एक मौजूदा ऐप में, आप बेहद नीचे से छोटी चीज़ो के रेंडर्स से शुरुवात कर सकते हैं जैसे `Button` और धीरे-धीरे दृश्य पदानुक्रम के ऊपर तक जाते है.
 
 ## कौम्पोनॅन्टस निकालना {#extracting-components}
 
@@ -157,7 +157,7 @@ function Comment(props) {
 
 [](codepen://components-and-props/extracting-components)
 
-यह स्वीकार करता है `author` (एक ऑब्जेक्ट), `text` (एक स्ट्रिंग), और `date` (एक डेट) जैसे props, और सोशल मीडिया वेबसाइट पर एक टिप्पणी का वर्णन करता है.
+यह स्वीकार करता है `author` (एक ऑब्जेक्ट), `text` (एक string), और `date` (एक date) जैसे props, और सोशल मीडिया वेबसाइट पर एक टिप्पणी का वर्णन करता है.
 
 यह रेंडरस को बदलने के लिए मुश्किल हो सकता है क्योंकि एक के अंदर दूसरी संरचना के वजह से,तथा इसकी अकेली पार्ट्स का पुन: उपयोग करना भी कठिन है. चलो कुछ कौम्पोनॅन्टस निकालते हैं.
 
@@ -175,12 +175,11 @@ function Avatar(props) {
 ```
  
 
-यह `Avatar` को जानने की जरूरत नहीं है कि यह एक `Comment` के अंदर रेंडर किया जा रहा है. इसलिए हमने इसके prop को एक ज्यादा सामान्य नाम दिया है : `user` 
-बजाय `author` के.
+यह `Avatar` को जानने की जरूरत नहीं है कि यह एक `Comment` के अंदर रेंडर किया जा रहा है. इसलिए हमने इसके prop को एक ज्यादा सामान्य नाम दिया है : `author` के बजाय `user`.
 
-We recommend naming props from the रेंडरस's own point of view rather than the context in which it is being used.
+Props की नामकरण हम रेंडर की अनुसार करने की सलाह देते हैं  बजाय उस संदर्भ में किया जाए जिसमें इसका उपयोग किया जा रहा है.
 
-We can now simplify `Comment` a tiny bit:
+हम अब `Comment` को थोड़ा सरल कर सकते हैं:
 
 ```js{5}
 function Comment(props) {
@@ -203,7 +202,7 @@ function Comment(props) {
 }
 ```
 
-Next, we will extract a `UserInfo` रेंडरस that रेंडरस an `Avatar` next to the user's name:
+अगला, हम एक निकालेंगे `UserInfo` रेंडर जो रेंडर करता है `Avatar` को जोकि user's name के पास है:
 
 ```js{3-8}
 function UserInfo(props) {
@@ -218,7 +217,7 @@ function UserInfo(props) {
 }
 ```
 
-This lets us simplify `Comment` even further:
+यह हमे `Comment` को और भी ज्यादा आसान बना देता है:
 
 ```js{4}
 function Comment(props) {
@@ -238,11 +237,13 @@ function Comment(props) {
 
 [](codepen://components-and-props/extracting-components-continued)
 
-Extracting कौम्पोनॅन्टस might seem like grunt work at first, but having a palette of reusable कौम्पोनॅन्टस pays off in larger apps. A good rule of thumb is that if a part of your UI is used several times (`Button`, `Panel`, `Avatar`), or is complex enough on its own (`App`, `FeedStory`, `Comment`), it is a good candidate to be a reusable कौम्पोनॅन्ट.
+कौम्पोनॅन्टस निकालना पहली बार में ग्रंट काम लग सकता है, लेकिन पुन: प्रयोज्य कौम्पोनॅन्टस के एक पैलेट होना बड़े ऐप्स में भुगतान करता है. यह एक अच्छा व्यवहार है की अगर आपका UI के पार्ट कई बार इस्तेमाल किये गए है (`Button`, `Panel`, `Avatar`), या अपने आप में काफी जटिल है (`App`, `FeedStory`, `Comment`), 
+यह पुन: प्रयोज्य कौम्पोनॅन्ट होने के लिए एक अच्छा उम्मीदवार है.
 
-## Props are Read-Only {#props-are-read-only}
+## Props केवल-पढ़ने के लिए हैं {#props-are-read-only}
 
-Whether you declare a कौम्पोनॅन्ट [as a फंक्शन्स or a class](#function-and-class-components), it must never modify its own props. Consider this `sum` फंक्शन्स:
+चाहे आप ए की घोषणा करें कौम्पोनॅन्ट की [फंक्शन्स या class के जैसे](#function-and-class-components), 
+इसे कभी भी संशोधित नहीं करना चाहिए खुदके props का. इस `sum` फंक्शन्स पर विचार करो:
 
 ```js
 function sum(a, b) {
@@ -250,9 +251,9 @@ function sum(a, b) {
 }
 ```
 
-Such फंक्शन्स are called ["pure"](https://en.wikipedia.org/wiki/Pure_function) because they do not attempt to change their inputs, and always return the same result for the same inputs.
+यह फंक्शन्स को हम कहते है ["pure"](https://en.wikipedia.org/wiki/Pure_function) क्योंकि वे अपने इनपुट को बदलने का प्रयास नहीं करते हैं, और हमेशा समान इनपुट के लिए समान परिणाम लौटाते हैं. 
 
-In contrast, this फंक्शन्स is impure because it changes its own input:
+इसके विपरीत, यह फंक्शन्स impure है क्योंकि यह अपना इनपुट खुद बदलता है:
 
 ```js
 function withdraw(account, amount) {
@@ -260,8 +261,10 @@ function withdraw(account, amount) {
 }
 ```
 
-React is pretty flexible but it has a single strict rule:
+React बहुत लचीला है, लेकिन इसमें एक सख्त नियम है:
 
-**All React कौम्पोनॅन्टस must act like pure फंक्शन्स with respect to their props.**
+**सारे React कौम्पोनॅन्टस को pure फंक्शन्स की तरह कार्य करना चाहिए अपने props के अनुसार.**
 
-Of course, application UIs are dynamic and change over time. In the [next section](/docs/state-and-lifecycle.html), we will introduce a new concept of "state". State allows React कौम्पोनॅन्टस to change their output over time in response to user actions, network responses, and anything else, without violating this rule.
+
+बेशक, अनुप्रयोग UI गतिशील हैं और समय के साथ बदलते हैं. अब [अगले सेक्शन](/docs/state-and-lifecycle.html) 
+में, हम एक नई अवधारणा पेश करेंगे "state". State React कौम्पोनॅन्टस को उपयोगकर्ता क्रियाओं के जवाब में समय के साथ अपने उत्पादन को बदलने के लिए अनुमति देता है, नेटवर्क प्रतिक्रियाएँ, और कुछ भी, इस नियम का उल्लंघन किए बिना.

From a3f0d070b472cde6a4c3044c92800a901c13ff58 Mon Sep 17 00:00:00 2001
From: helios1101 <harshit.singh1101@gmail.com>
Date: Sun, 10 Mar 2019 12:17:35 +0530
Subject: [PATCH 05/16] Review1 Changes

---
 content/docs/components-and-props.md | 68 ++++++++++++++--------------
 1 file changed, 33 insertions(+), 35 deletions(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index c5f69e8ad..3736d7015 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -16,15 +16,14 @@ prev: rendering-elements.html
 next: state-and-lifecycle.html
 ---
 
-कौम्पोनॅन्टस हमें UI को स्वतंत्र, पुन: प्रयोज्य टुकड़ो में विभाजित करने में मदद करता है ,तथा
-हर हिस्से को अलग मानता है. यह पन्ना कौम्पोनॅन्टस का परिचय देता है. आप खोज सकते है [ विस्तृत कौम्पोनॅन्ट API reference यहाँ पर](/docs/react-component.html).
+कौम्पोनॅन्टस हमें UI को स्वतंत्र, पुन: प्रयोज्य टुकड़ो में विभाजित करने में मदद करता है, तथा
+हर हिस्से को अलग मानता है| यह पेज कौम्पोनॅन्टस का परिचय देता है| आपको [यहाँ पर विस्तृत कौम्पोनॅन्ट API reference](/docs/react-component.html) मिल जाएगा|
 
-सैद्धांतिक रूप से, कौम्पोनॅन्टस जावास्क्रिप्ट फंक्शन्स जैसा है. 
-वे अर्बिट्ररी इनपुट्स स्वीकार करते है (जिससे "props" बुलाया जाता है ) और वापस आती है React एलिमेंट्स जो वर्णन करती है की स्क्रीन पर क्या आना चाहिए.
+सैद्धांतिक रूप से, कौम्पोनॅन्टस जावास्क्रिप्ट फंक्शन्स जैसा है| वे अर्बिट्ररी इनपुट्स स्वीकार करते है (जिसे "props" बुलाया जाता है ) और React एलिमेंट्स रीटर्न करते हैं जो वर्णन करती है की स्क्रीन पर क्या आना चाहिए|
 
-## फंक्शन्स तथा कौम्पोनॅन्टस {#function-and-class-components}
+## फंक्शन्स तथा क्लास कौम्पोनॅन्टस {#function-and-class-components}
 
-सबसे सरल तरीका एक कौम्पोनॅन्ट को परिभाषित करने की यह है की एक  जावास्क्रिप्ट फंक्शन्स लिखी जाए:
+सबसे सरल तरीका एक कौम्पोनॅन्ट को परिभाषित करने का यह है की एक जावास्क्रिप्ट फंक्शन्स लिखा जाए:
 
 ```js
 function Welcome(props) {
@@ -32,10 +31,9 @@ function Welcome(props) {
 }
 ```
 
-यह फंक्शन्स एक वैध React कौम्पोनॅन्ट है क्योकि यह स्वीकार करता है एक अकेला "props" (which stands for properties) object argument with data और वापस आती है React एलिमेंट्स. हम उन कौम्पोनॅन्टस "फंक्शन्स कहते है  कौम्पोनॅन्टस "फंक्शन्स कौम्पोनॅन्टस" क्योकि वो वाकई में एक जावास्क्रिप्ट फंक्शन्स है.
+यह फंक्शन्स एक वैध React कौम्पोनॅन्ट है क्योकि यह एक अकेला "props" (जो प्रॉपर्टीज का प्रतिनिधित्व करता है) ऑब्जेक्ट आर्गुमेंट डाटा सहित स्वीकार करता है और वापस करता है React एलिमेंट्स| हम उन कौम्पोनॅन्टस को "फंक्शन्स कौम्पोनॅन्टस" कहते है क्योकि वो वाकई में एक जावास्क्रिप्ट फंक्शन्स है|
 
-
-आप भी उपयोग कर सकते हैं [ES6 class](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Classes) का ताकि परिभाषित कर सके कौम्पोनॅन्ट को:
+आप कौम्पोनॅन्ट को परिभाषित करने के लिए एक [ES6 class](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Classes) का उपयोग भी कर सकते हैं:
 
 ```js
 class Welcome extends React.Component {
@@ -45,13 +43,13 @@ class Welcome extends React.Component {
 }
 ```
 
-ऊपर के दोनों कौम्पोनॅन्टस बराबर है React's दृष्टिकोण से.
+ऊपर के दोनों कौम्पोनॅन्टस बराबर है React's दृष्टिकोण से|
 
-Classes की कुछ अतिरिक्त विशेषताएं भी हैं जिसकी हम चर्चा करेंगे [अगले खंड](/docs/state-and-lifecycle.html) में. तब तक, हम इस्तेमाल करेंगे फंक्शन्स कौम्पोनॅन्टस के संक्षिप्ति होने का.
+क्लासेज की कुछ अतिरिक्त विशेषताएं भी हैं जिसकी हम चर्चा [अगले खंड](/docs/state-and-lifecycle.html) में करेंगे| तब तक, हम उनकी संक्षिप्तता के लिए फ़ंक्शन कौम्पोनॅन्टस का उपयोग करेंगे।
 
 ## कौम्पोनॅन्ट रेंडरिंग {#rendering-a-component}
 
-इससे पहले, हमने केवल वही React एलिमेंट्स का सामना किया जो DOM टैग्स का दर्शाता था:
+इससे पहले, हमने केवल वही React एलिमेंट्स को सामना किया जो DOM टैग्स का दर्शाता था:
 
 ```js
 const element = <div />;
@@ -63,9 +61,9 @@ const element = <div />;
 const element = <Welcome name="Sara" />;
 ```
 
-जब कभी भी React देखता है एलिमेंट को यूजर-डिफाइंड  कौम्पोनॅन्ट का प्रतिनिधित्व करते हुए, यह JSX की विशेषताएँ पास करता है इस  कौम्पोनॅन्ट को एक object के रूप में. हम इस object को "props" कहते हैं .
+जब कभी भी React एक एलिमेंट को यूजर-डिफाइंड कौम्पोनॅन्ट का प्रतिनिधित्व करते हुए देखता है, तुरंत ही JSX ऐट्रिब्यूट्स को पास कर देता है इन कौम्पोनॅन्ट को, एक object के रूप में| हम इस object को "props" कहते हैं|
 
-उदाहरण के लिए, यह कोड पेज पर रेंडर करता है "नमस्ते, Sara" :
+उदाहरण के लिए, यह कोड पेज पर रेंडर करता है "नमस्ते, Sara":
 
 ```js{1,5}
 function Welcome(props) {
@@ -83,20 +81,20 @@ ReactDOM.render(
 
 चलो देकते है इस उदाहरण में क्या होता है:
 
-1. हम बुलाते है `ReactDOM.render()` को `<Welcome name="Sara" />` एलिमेंट्स से.
-2. React बुलाते है `Welcome` कौम्पोनॅन्ट को `name: 'Sara'}` के साथ props के रूप में.
-3. यह `Welcome` रेंडरस और वापस आती है `<h1>नमस्ते, Sara</h1>` एलिमेंट परिणाम के तौर पर .
-4. React DOM कुशलता पूर्वक DOM को अपडेट करता है `<h1>नमस्ते, Sara</h1>` से.
+1. हम बुलाते है `ReactDOM.render()` को `<Welcome name="Sara" />` एलिमेंट्स से|
+2. React बुलाते है `Welcome` कौम्पोनॅन्ट को `name: 'Sara'}` के साथ props के रूप में|
+3. यह `Welcome` रेंडरस और वापस आती है `<h1>नमस्ते, Sara</h1>` एलिमेंट परिणाम के तौर पर|
+4. React DOM कुशलता पूर्वक DOM को अपडेट करता है `<h1>नमस्ते, Sara</h1>` से|
 
->**ध्यान दें:** हमेशा रेंडर की नाम की शुरुवात कैपिटल लेटर से होनी चाहिए.
+>**ध्यान दें:** हमेशा रेंडर की नाम की शुरुवात कैपिटल लेटर से होनी चाहिए|
 >
->React उन कौम्पोनॅन्टस को जो लोअरकेस से स्टार्ट होते है उससे DOM टैग्स मानता है. उदाहरण के लिए, `<div />` HTML div टैग्स को दर्शाता है, पर `<Welcome />` दर्शाता है रेंडर को और ज़रुरत होती है `Welcome` को दायरे में होने की.
+>React उन कौम्पोनॅन्टस को जो लोअरकेस से स्टार्ट होते है उससे DOM टैग्स मानता है| उदाहरण के लिए, `<div />` HTML div टैग्स को दर्शाता है, पर `<Welcome />` दर्शाता है रेंडर को और ज़रुरत होती है `Welcome` को दायरे में होने की|
 >
->इस सम्मेलन के पीछे तर्क के बारे में अधिक जानने के लिए, कृपया पढ़ें [JSX गहराई में](/docs/jsx-in-depth.html#user-defined-components-must-be-capitalized).
+>इस सम्मेलन के पीछे तर्क के बारे में अधिक जानने के लिए, कृपया पढ़ें [JSX गहराई में](/docs/jsx-in-depth.html#user-defined-components-must-be-capitalized)|
 
 ## कौम्पोनॅन्टस लिखना {#composing-components}
 
-कौम्पोनॅन्टस अन्य कौम्पोनॅन्टस का उल्लेख कर सकते हैं अपने आउटपुट में. इससे हम उसी रेंडरस का उपयोग कर सकते हैं, विस्तार के किसी भी स्तर के लिए. एक बटन, फॉर्म, डायलॉग, स्क्रीन: React अप्प्स में, वे सब को आमतौर पर कौम्पोनॅन्टस के रूप में व्यक्त किया जाता है.
+कौम्पोनॅन्टस अन्य कौम्पोनॅन्टस का उल्लेख कर सकते हैं अपने आउटपुट में| इससे हम उसी रेंडरस का उपयोग कर सकते हैं, विस्तार के किसी भी स्तर के लिए| एक बटन, फॉर्म, डायलॉग, स्क्रीन: React अप्प्स में, वे सब को आमतौर पर कौम्पोनॅन्टस के रूप में व्यक्त किया जाता है|
 
 उदाहरण के लिए, हम एक `App` बना सकते हैं जो रेंडरस करता है `Welcome` को कई बार:
 
@@ -123,11 +121,11 @@ ReactDOM.render(
 
 [](codepen://components-and-props/composing-components)
 
-आम तौर पर, नया React अप्प्स के पास एक अकेला `App`  रेंडर होता है सबसे ऊपर में. हालाँकि, अगर आप एकीकृत करते हैं React को एक मौजूदा ऐप में, आप बेहद नीचे से छोटी चीज़ो के रेंडर्स से शुरुवात कर सकते हैं जैसे `Button` और धीरे-धीरे दृश्य पदानुक्रम के ऊपर तक जाते है.
+आम तौर पर, नया React अप्प्स के पास एक अकेला `App`  रेंडर होता है सबसे ऊपर में| हालाँकि, अगर आप एकीकृत करते हैं React को एक मौजूदा ऐप में, आप बेहद नीचे से छोटी चीज़ो के रेंडर्स से शुरुवात कर सकते हैं जैसे `Button` और धीरे-धीरे दृश्य पदानुक्रम के ऊपर तक जाते है|
 
 ## कौम्पोनॅन्टस निकालना {#extracting-components}
 
-कौम्पोनॅन्टस को छोटे छोटे कौम्पोनॅन्टस में विभाजित करने से डरना नहीं चाहिए.
+कौम्पोनॅन्टस को छोटे छोटे कौम्पोनॅन्टस में विभाजित करने से डरना नहीं चाहिए|
 
 उदाहरण के लिए, इस पर विचार करो की `Comment` रेंडरस:
 
@@ -157,9 +155,9 @@ function Comment(props) {
 
 [](codepen://components-and-props/extracting-components)
 
-यह स्वीकार करता है `author` (एक ऑब्जेक्ट), `text` (एक string), और `date` (एक date) जैसे props, और सोशल मीडिया वेबसाइट पर एक टिप्पणी का वर्णन करता है.
+यह स्वीकार करता है `author` (एक ऑब्जेक्ट), `text` (एक string), और `date` (एक date) जैसे props, और सोशल मीडिया वेबसाइट पर एक टिप्पणी का वर्णन करता है|
 
-यह रेंडरस को बदलने के लिए मुश्किल हो सकता है क्योंकि एक के अंदर दूसरी संरचना के वजह से,तथा इसकी अकेली पार्ट्स का पुन: उपयोग करना भी कठिन है. चलो कुछ कौम्पोनॅन्टस निकालते हैं.
+यह रेंडरस को बदलने के लिए मुश्किल हो सकता है क्योंकि एक के अंदर दूसरी संरचना के वजह से,तथा इसकी अकेली पार्ट्स का पुन: उपयोग करना भी कठिन है| चलो कुछ कौम्पोनॅन्टस निकालते हैं|
 
 सबसे पहले, हम निकालेंगे `Avatar`:
 
@@ -175,9 +173,9 @@ function Avatar(props) {
 ```
  
 
-यह `Avatar` को जानने की जरूरत नहीं है कि यह एक `Comment` के अंदर रेंडर किया जा रहा है. इसलिए हमने इसके prop को एक ज्यादा सामान्य नाम दिया है : `author` के बजाय `user`.
+यह `Avatar` को जानने की जरूरत नहीं है कि यह एक `Comment` के अंदर रेंडर किया जा रहा है| इसलिए हमने इसके prop को एक ज्यादा सामान्य नाम दिया है : `author` के बजाय `user`|
 
-Props की नामकरण हम रेंडर की अनुसार करने की सलाह देते हैं  बजाय उस संदर्भ में किया जाए जिसमें इसका उपयोग किया जा रहा है.
+Props की नामकरण हम रेंडर की अनुसार करने की सलाह देते हैं  बजाय उस संदर्भ में किया जाए जिसमें इसका उपयोग किया जा रहा है|
 
 हम अब `Comment` को थोड़ा सरल कर सकते हैं:
 
@@ -237,13 +235,13 @@ function Comment(props) {
 
 [](codepen://components-and-props/extracting-components-continued)
 
-कौम्पोनॅन्टस निकालना पहली बार में ग्रंट काम लग सकता है, लेकिन पुन: प्रयोज्य कौम्पोनॅन्टस के एक पैलेट होना बड़े ऐप्स में भुगतान करता है. यह एक अच्छा व्यवहार है की अगर आपका UI के पार्ट कई बार इस्तेमाल किये गए है (`Button`, `Panel`, `Avatar`), या अपने आप में काफी जटिल है (`App`, `FeedStory`, `Comment`), 
-यह पुन: प्रयोज्य कौम्पोनॅन्ट होने के लिए एक अच्छा उम्मीदवार है.
+कौम्पोनॅन्टस निकालना पहली बार में ग्रंट काम लग सकता है, लेकिन पुन: प्रयोज्य कौम्पोनॅन्टस के एक पैलेट होना बड़े ऐप्स में भुगतान करता है| यह एक अच्छा व्यवहार है की अगर आपका UI के पार्ट कई बार इस्तेमाल किये गए है (`Button`, `Panel`, `Avatar`), या अपने आप में काफी जटिल है (`App`, `FeedStory`, `Comment`), 
+यह पुन: प्रयोज्य कौम्पोनॅन्ट होने के लिए एक अच्छा उम्मीदवार है|
 
 ## Props केवल-पढ़ने के लिए हैं {#props-are-read-only}
 
 चाहे आप ए की घोषणा करें कौम्पोनॅन्ट की [फंक्शन्स या class के जैसे](#function-and-class-components), 
-इसे कभी भी संशोधित नहीं करना चाहिए खुदके props का. इस `sum` फंक्शन्स पर विचार करो:
+इसे कभी भी संशोधित नहीं करना चाहिए खुदके props का| इस `sum` फंक्शन्स पर विचार करो:
 
 ```js
 function sum(a, b) {
@@ -251,7 +249,7 @@ function sum(a, b) {
 }
 ```
 
-यह फंक्शन्स को हम कहते है ["pure"](https://en.wikipedia.org/wiki/Pure_function) क्योंकि वे अपने इनपुट को बदलने का प्रयास नहीं करते हैं, और हमेशा समान इनपुट के लिए समान परिणाम लौटाते हैं. 
+यह फंक्शन्स को हम कहते है ["pure"](https://en.wikipedia.org/wiki/Pure_function) क्योंकि वे अपने इनपुट को बदलने का प्रयास नहीं करते हैं, और हमेशा समान इनपुट के लिए समान परिणाम लौटाते हैं| 
 
 इसके विपरीत, यह फंक्शन्स impure है क्योंकि यह अपना इनपुट खुद बदलता है:
 
@@ -263,8 +261,8 @@ function withdraw(account, amount) {
 
 React बहुत लचीला है, लेकिन इसमें एक सख्त नियम है:
 
-**सारे React कौम्पोनॅन्टस को pure फंक्शन्स की तरह कार्य करना चाहिए अपने props के अनुसार.**
+**सारे React कौम्पोनॅन्टस को pure फंक्शन्स की तरह कार्य करना चाहिए अपने props के अनुसार|**
 
 
-बेशक, अनुप्रयोग UI गतिशील हैं और समय के साथ बदलते हैं. अब [अगले सेक्शन](/docs/state-and-lifecycle.html) 
-में, हम एक नई अवधारणा पेश करेंगे "state". State React कौम्पोनॅन्टस को उपयोगकर्ता क्रियाओं के जवाब में समय के साथ अपने उत्पादन को बदलने के लिए अनुमति देता है, नेटवर्क प्रतिक्रियाएँ, और कुछ भी, इस नियम का उल्लंघन किए बिना.
+बेशक, अनुप्रयोग UI गतिशील हैं और समय के साथ बदलते हैं| अब [अगले सेक्शन](/docs/state-and-lifecycle.html) 
+में, हम एक नई अवधारणा पेश करेंगे "state"| State React कौम्पोनॅन्टस को उपयोगकर्ता क्रियाओं के जवाब में समय के साथ अपने उत्पादन को बदलने के लिए अनुमति देता है, नेटवर्क प्रतिक्रियाएँ, और कुछ भी, इस नियम का उल्लंघन किए बिना|

From fcb77f8a26a8a8c4da296b1941eb31c7ceeb54a2 Mon Sep 17 00:00:00 2001
From: helios1101 <harshit.singh1101@gmail.com>
Date: Mon, 11 Mar 2019 21:02:11 +0530
Subject: [PATCH 06/16] Few more changes in Review1

---
 content/docs/components-and-props.md | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index 3736d7015..0cb5a46e3 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -15,7 +15,6 @@ redirect_from:
 prev: rendering-elements.html
 next: state-and-lifecycle.html
 ---
-
 कौम्पोनॅन्टस हमें UI को स्वतंत्र, पुन: प्रयोज्य टुकड़ो में विभाजित करने में मदद करता है, तथा
 हर हिस्से को अलग मानता है| यह पेज कौम्पोनॅन्टस का परिचय देता है| आपको [यहाँ पर विस्तृत कौम्पोनॅन्ट API reference](/docs/react-component.html) मिल जाएगा|
 
@@ -31,7 +30,7 @@ function Welcome(props) {
 }
 ```
 
-यह फंक्शन्स एक वैध React कौम्पोनॅन्ट है क्योकि यह एक अकेला "props" (जो प्रॉपर्टीज का प्रतिनिधित्व करता है) ऑब्जेक्ट आर्गुमेंट डाटा सहित स्वीकार करता है और वापस करता है React एलिमेंट्स| हम उन कौम्पोनॅन्टस को "फंक्शन्स कौम्पोनॅन्टस" कहते है क्योकि वो वाकई में एक जावास्क्रिप्ट फंक्शन्स है|
+यह फंक्शन्स एक वैध React कौम्पोनॅन्ट है क्योकि यह एक अकेला "props" (जो प्रॉपर्टीज का प्रतिनिधित्व करता है) ऑब्जेक्ट आर्गुमेंट डाटा सहित स्वीकार करता है और React एलिमेंट्स वापस करता है| हम उन कौम्पोनॅन्टस को "फंक्शन्स कौम्पोनॅन्टस" कहते है क्योकि वो वाकई में एक जावास्क्रिप्ट फंक्शन्स है|
 
 आप कौम्पोनॅन्ट को परिभाषित करने के लिए एक [ES6 class](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Classes) का उपयोग भी कर सकते हैं:
 
@@ -45,11 +44,11 @@ class Welcome extends React.Component {
 
 ऊपर के दोनों कौम्पोनॅन्टस बराबर है React's दृष्टिकोण से|
 
-क्लासेज की कुछ अतिरिक्त विशेषताएं भी हैं जिसकी हम चर्चा [अगले खंड](/docs/state-and-lifecycle.html) में करेंगे| तब तक, हम उनकी संक्षिप्तता के लिए फ़ंक्शन कौम्पोनॅन्टस का उपयोग करेंगे।
+क्लासेज की कुछ अतिरिक्त विशेषताएं भी हैं जिसकी हम चर्चा [अगले खंड](/docs/state-and-lifecycle.html) में करेंगे| तब तक, हम उनकी संक्षिप्तता के लिए फ़ंक्शन कौम्पोनॅन्टस का उपयोग करेंगे।का
 
 ## कौम्पोनॅन्ट रेंडरिंग {#rendering-a-component}
 
-इससे पहले, हमने केवल वही React एलिमेंट्स को सामना किया जो DOM टैग्स का दर्शाता था:
+इससे पहले, हमने केवल वही React एलिमेंट्स का सामना किया जो DOM टैग्स को दर्शाता था:
 
 ```js
 const element = <div />;

From fdcdc8867ac6baa9c75964068d4af4b3d92b29ce Mon Sep 17 00:00:00 2001
From: helios1101 <harshit.singh1101@gmail.com>
Date: Tue, 12 Mar 2019 01:58:51 +0530
Subject: [PATCH 07/16] Changes in Review2

---
 content/docs/components-and-props.md | 39 ++++++++++++----------------
 1 file changed, 17 insertions(+), 22 deletions(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index 0cb5a46e3..b224d48ba 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -87,15 +87,15 @@ ReactDOM.render(
 
 >**ध्यान दें:** हमेशा रेंडर की नाम की शुरुवात कैपिटल लेटर से होनी चाहिए|
 >
->React उन कौम्पोनॅन्टस को जो लोअरकेस से स्टार्ट होते है उससे DOM टैग्स मानता है| उदाहरण के लिए, `<div />` HTML div टैग्स को दर्शाता है, पर `<Welcome />` दर्शाता है रेंडर को और ज़रुरत होती है `Welcome` को दायरे में होने की|
+>React उन कौम्पोनॅन्टस को DOM टैग्स मानता है जो लोअरकेस से स्टार्ट होते है| उदाहरण के लिए, `<div />` HTML div टैग्स को दर्शाता है, पर `<Welcome />` एक कौम्पोनॅन्ट को दर्शाता है और इसको Welcome स्कोप में चाहिए होता है|
 >
->इस सम्मेलन के पीछे तर्क के बारे में अधिक जानने के लिए, कृपया पढ़ें [JSX गहराई में](/docs/jsx-in-depth.html#user-defined-components-must-be-capitalized)|
+>इसके पीछे की सोच के बारे में और गहराई में जानने के लिए, कृपया [JSX गहराई में](/docs/jsx-in-depth.html#user-defined-components-must-be-capitalized) पढ़ें|
 
-## कौम्पोनॅन्टस लिखना {#composing-components}
+## कौम्पोनॅन्टस की रचना {#composing-components}
 
-कौम्पोनॅन्टस अन्य कौम्पोनॅन्टस का उल्लेख कर सकते हैं अपने आउटपुट में| इससे हम उसी रेंडरस का उपयोग कर सकते हैं, विस्तार के किसी भी स्तर के लिए| एक बटन, फॉर्म, डायलॉग, स्क्रीन: React अप्प्स में, वे सब को आमतौर पर कौम्पोनॅन्टस के रूप में व्यक्त किया जाता है|
+कौम्पोनॅन्टस अपने आउटपुट में अन्य कौम्पोनॅन्टस का उल्लेख कर सकते हैं| इससे हम विस्तार के किसी भी स्तर के लिए उन्ही कौम्पोनॅन्ट का उपयोग कर सकते हैं| एक बटन, एक फॉर्म, एक डायलॉग, एक स्क्रीन React ऍप्स में, इन सबको आमतौर पर कौम्पोनॅन्टस के रूप में व्यक्त किया जाता है|
 
-उदाहरण के लिए, हम एक `App` बना सकते हैं जो रेंडरस करता है `Welcome` को कई बार:
+उदाहरण के लिए, हम एक `App` बना सकते हैं जो Welcome को कई बार रेंडर करता है:
 
 ```js{8-10}
 function Welcome(props) {
@@ -120,13 +120,13 @@ ReactDOM.render(
 
 [](codepen://components-and-props/composing-components)
 
-आम तौर पर, नया React अप्प्स के पास एक अकेला `App`  रेंडर होता है सबसे ऊपर में| हालाँकि, अगर आप एकीकृत करते हैं React को एक मौजूदा ऐप में, आप बेहद नीचे से छोटी चीज़ो के रेंडर्स से शुरुवात कर सकते हैं जैसे `Button` और धीरे-धीरे दृश्य पदानुक्रम के ऊपर तक जाते है|
+आम तौर पर, नया React ऍप्स के पास एक अकेला `App`  रेंडर होता है सबसे ऊपर में| हालाँकि, अगर आप एकीकृत करते हैं React को एक मौजूदा ऐप में, आप बेहद नीचे से छोटी चीज़ो के रेंडर्स से शुरुवात कर सकते हैं जैसे `Button` और धीरे-धीरे दृश्य पदानुक्रम के ऊपर तक जाते है|
 
 ## कौम्पोनॅन्टस निकालना {#extracting-components}
 
 कौम्पोनॅन्टस को छोटे छोटे कौम्पोनॅन्टस में विभाजित करने से डरना नहीं चाहिए|
 
-उदाहरण के लिए, इस पर विचार करो की `Comment` रेंडरस:
+उदाहरण के लिए, इस `Comment` कौम्पोनॅन्टस पर विचार करें:
 
 ```js
 function Comment(props) {
@@ -154,9 +154,9 @@ function Comment(props) {
 
 [](codepen://components-and-props/extracting-components)
 
-यह स्वीकार करता है `author` (एक ऑब्जेक्ट), `text` (एक string), और `date` (एक date) जैसे props, और सोशल मीडिया वेबसाइट पर एक टिप्पणी का वर्णन करता है|
+यह `author` (एक ऑब्जेक्ट), `text` (एक string), और `date` (एक date) को props के जैसे स्वीकार करता है|
 
-यह रेंडरस को बदलने के लिए मुश्किल हो सकता है क्योंकि एक के अंदर दूसरी संरचना के वजह से,तथा इसकी अकेली पार्ट्स का पुन: उपयोग करना भी कठिन है| चलो कुछ कौम्पोनॅन्टस निकालते हैं|
+इस कौम्पोनॅन्टस की नेस्टिंग की वजह से इसको बदलना मुश्किल हो सकता है, तथा इसके अकेले पार्ट्स का पुन: उपयोग करना भी कठिन है| चलो कुछ कौम्पोनॅन्टस निकालते हैं|
 
 सबसे पहले, हम निकालेंगे `Avatar`:
 
@@ -170,11 +170,9 @@ function Avatar(props) {
   );
 }
 ```
- 
+इस `Avatar` को जानने की जरूरत नहीं है कि यह एक `Comment` के अंदर रेंडर किया जा रहा है| इसलिए हमने इसके prop को एक ज्यादा सामान्य नाम दिया है : `author` के बजाय `user`|
 
-यह `Avatar` को जानने की जरूरत नहीं है कि यह एक `Comment` के अंदर रेंडर किया जा रहा है| इसलिए हमने इसके prop को एक ज्यादा सामान्य नाम दिया है : `author` के बजाय `user`|
-
-Props की नामकरण हम रेंडर की अनुसार करने की सलाह देते हैं  बजाय उस संदर्भ में किया जाए जिसमें इसका उपयोग किया जा रहा है|
+Props का नामकरण हम कौम्पोनॅन्टस के अनुसार करने की सलाह देते हैं बजाय उस संदर्भ में किया जाए जिसमें इसका उपयोग किया जा रहा है|
 
 हम अब `Comment` को थोड़ा सरल कर सकते हैं:
 
@@ -199,7 +197,7 @@ function Comment(props) {
 }
 ```
 
-अगला, हम एक निकालेंगे `UserInfo` रेंडर जो रेंडर करता है `Avatar` को जोकि user's name के पास है:
+अगला, हम एक निकालेंगे `UserInfo` कौम्पोनॅन्टस जो `Avatar` को यूजर'स नाम के पास रेंडर करता है:
 
 ```js{3-8}
 function UserInfo(props) {
@@ -214,7 +212,7 @@ function UserInfo(props) {
 }
 ```
 
-यह हमे `Comment` को और भी ज्यादा आसान बना देता है:
+यह हमे `Comment` को और भी ज्यादा आसान बनाने देता है:
 
 ```js{4}
 function Comment(props) {
@@ -234,13 +232,11 @@ function Comment(props) {
 
 [](codepen://components-and-props/extracting-components-continued)
 
-कौम्पोनॅन्टस निकालना पहली बार में ग्रंट काम लग सकता है, लेकिन पुन: प्रयोज्य कौम्पोनॅन्टस के एक पैलेट होना बड़े ऐप्स में भुगतान करता है| यह एक अच्छा व्यवहार है की अगर आपका UI के पार्ट कई बार इस्तेमाल किये गए है (`Button`, `Panel`, `Avatar`), या अपने आप में काफी जटिल है (`App`, `FeedStory`, `Comment`), 
-यह पुन: प्रयोज्य कौम्पोनॅन्ट होने के लिए एक अच्छा उम्मीदवार है|
+कौम्पोनॅन्टस निकालें के लिए पहली बार में ग्रंट काम लग सकता है, लेकिन पुन: प्रयोज्य कौम्पोनॅन्टस के एक पैलेट होना बड़े ऐप्स में भुगतान करता है| यह एक अच्छा व्यवहार है की अगर आपके UI के पार्ट कई बार इस्तेमाल किये गए है (`Button`, `Panel`, `Avatar`), या अपने आप में काफी जटिल है (`App`, `FeedStory`, `Comment`), यह पुन: प्रयोज्य कौम्पोनॅन्ट होने के लिए एक अच्छा उम्मीदवार है|
 
 ## Props केवल-पढ़ने के लिए हैं {#props-are-read-only}
 
-चाहे आप ए की घोषणा करें कौम्पोनॅन्ट की [फंक्शन्स या class के जैसे](#function-and-class-components), 
-इसे कभी भी संशोधित नहीं करना चाहिए खुदके props का| इस `sum` फंक्शन्स पर विचार करो:
+जब भी आप एक कॉम्पोनेन्ट को [फंक्शन या क्लास के जैसे](#function-and-class-components) डिक्लेअर करें, इसे कभी भी खुदके props का संशोधित नहीं करना चाहिए| इस `sum` फंक्शन्स पर विचार करो:
 
 ```js
 function sum(a, b) {
@@ -250,7 +246,7 @@ function sum(a, b) {
 
 यह फंक्शन्स को हम कहते है ["pure"](https://en.wikipedia.org/wiki/Pure_function) क्योंकि वे अपने इनपुट को बदलने का प्रयास नहीं करते हैं, और हमेशा समान इनपुट के लिए समान परिणाम लौटाते हैं| 
 
-इसके विपरीत, यह फंक्शन्स impure है क्योंकि यह अपना इनपुट खुद बदलता है:
+इसके विपरीत, यह फंक्शन्स impure है क्योंकि ऐसे अपना इनपुट खुद बदलता है:
 
 ```js
 function withdraw(account, amount) {
@@ -263,5 +259,4 @@ React बहुत लचीला है, लेकिन इसमें ए
 **सारे React कौम्पोनॅन्टस को pure फंक्शन्स की तरह कार्य करना चाहिए अपने props के अनुसार|**
 
 
-बेशक, अनुप्रयोग UI गतिशील हैं और समय के साथ बदलते हैं| अब [अगले सेक्शन](/docs/state-and-lifecycle.html) 
-में, हम एक नई अवधारणा पेश करेंगे "state"| State React कौम्पोनॅन्टस को उपयोगकर्ता क्रियाओं के जवाब में समय के साथ अपने उत्पादन को बदलने के लिए अनुमति देता है, नेटवर्क प्रतिक्रियाएँ, और कुछ भी, इस नियम का उल्लंघन किए बिना|
+बेशक, अनुप्रयोग UI गतिशील हैं और समय के साथ बदलते हैं| अब [अगले सेक्शन](/docs/state-and-lifecycle.html)में, हम एक नई अवधारणा पेश करेंगे "state"| State React कौम्पोनॅन्टस को उपयोगकर्ता क्रियाओं के जवाब में समय के साथ अपने उत्पादन को बदलने के लिए अनुमति देता है, नेटवर्क प्रतिक्रियाएँ, और कुछ भी, इस नियम का उल्लंघन किए बिना|

From eb5648fd1b3ff453e89110883c959c8cf5e09dec Mon Sep 17 00:00:00 2001
From: helios1101 <harshit.singh1101@gmail.com>
Date: Sat, 16 Mar 2019 21:19:44 +0530
Subject: [PATCH 08/16] FinalChanges

---
 content/docs/components-and-props.md | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index b224d48ba..c8baf94dd 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -170,6 +170,7 @@ function Avatar(props) {
   );
 }
 ```
+
 इस `Avatar` को जानने की जरूरत नहीं है कि यह एक `Comment` के अंदर रेंडर किया जा रहा है| इसलिए हमने इसके prop को एक ज्यादा सामान्य नाम दिया है : `author` के बजाय `user`|
 
 Props का नामकरण हम कौम्पोनॅन्टस के अनुसार करने की सलाह देते हैं बजाय उस संदर्भ में किया जाए जिसमें इसका उपयोग किया जा रहा है|
@@ -232,7 +233,7 @@ function Comment(props) {
 
 [](codepen://components-and-props/extracting-components-continued)
 
-कौम्पोनॅन्टस निकालें के लिए पहली बार में ग्रंट काम लग सकता है, लेकिन पुन: प्रयोज्य कौम्पोनॅन्टस के एक पैलेट होना बड़े ऐप्स में भुगतान करता है| यह एक अच्छा व्यवहार है की अगर आपके UI के पार्ट कई बार इस्तेमाल किये गए है (`Button`, `Panel`, `Avatar`), या अपने आप में काफी जटिल है (`App`, `FeedStory`, `Comment`), यह पुन: प्रयोज्य कौम्पोनॅन्ट होने के लिए एक अच्छा उम्मीदवार है|
+कौम्पोनॅन्टस निकालने के लिए पहली बार में ग्रंट का काम लग सकता है, लेकिन पुन: प्रयोज्य कौम्पोनॅन्टस के एक पैलेट होना बड़े ऐप्स में भुगतान करता है| यह एक अच्छा व्यवहार है की अगर आपके UI के पार्ट कई बार इस्तेमाल किये गए है (`Button`, `Panel`, `Avatar`), या अपने आप में काफी जटिल है (`App`, `FeedStory`, `Comment`), यह पुन: प्रयोज्य कौम्पोनॅन्ट होने के लिए एक अच्छा उम्मीदवार है|
 
 ## Props केवल-पढ़ने के लिए हैं {#props-are-read-only}
 
@@ -244,7 +245,7 @@ function sum(a, b) {
 }
 ```
 
-यह फंक्शन्स को हम कहते है ["pure"](https://en.wikipedia.org/wiki/Pure_function) क्योंकि वे अपने इनपुट को बदलने का प्रयास नहीं करते हैं, और हमेशा समान इनपुट के लिए समान परिणाम लौटाते हैं| 
+ऐसे फंक्शन्स को हम कहते है ["pure"](https://en.wikipedia.org/wiki/Pure_function) क्योंकि वे अपने इनपुट को बदलने का प्रयास नहीं करते हैं, और हमेशा समान इनपुट के लिए समान परिणाम लौटाते हैं| 
 
 इसके विपरीत, यह फंक्शन्स impure है क्योंकि ऐसे अपना इनपुट खुद बदलता है:
 
@@ -259,4 +260,4 @@ React बहुत लचीला है, लेकिन इसमें ए
 **सारे React कौम्पोनॅन्टस को pure फंक्शन्स की तरह कार्य करना चाहिए अपने props के अनुसार|**
 
 
-बेशक, अनुप्रयोग UI गतिशील हैं और समय के साथ बदलते हैं| अब [अगले सेक्शन](/docs/state-and-lifecycle.html)में, हम एक नई अवधारणा पेश करेंगे "state"| State React कौम्पोनॅन्टस को उपयोगकर्ता क्रियाओं के जवाब में समय के साथ अपने उत्पादन को बदलने के लिए अनुमति देता है, नेटवर्क प्रतिक्रियाएँ, और कुछ भी, इस नियम का उल्लंघन किए बिना|
+बेशक, अनुप्रयोग UI गतिशील हैं और समय के साथ बदलते हैं| अब [अगले सेक्शन](/docs/state-and-lifecycle.html) में, हम एक नई अवधारणा पेश करेंगे "state"| State React कौम्पोनॅन्टस को उपयोगकर्ता क्रियाओं के जवाब में समय के साथ अपने उत्पादन को बदलने के लिए अनुमति देता है, नेटवर्क प्रतिक्रियाएँ, और कुछ भी, इस नियम का उल्लंघन किए बिना|

From a79c806d442e492f63b7f8e6e1529e689ae3538e Mon Sep 17 00:00:00 2001
From: helios1101 <harshit.singh1101@gmail.com>
Date: Sun, 17 Mar 2019 23:58:19 +0530
Subject: [PATCH 09/16] Review2-Changes

---
 content/docs/components-and-props.md | 29 ++++++++++++++--------------
 1 file changed, 14 insertions(+), 15 deletions(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index c8baf94dd..0111da5ad 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -15,14 +15,13 @@ redirect_from:
 prev: rendering-elements.html
 next: state-and-lifecycle.html
 ---
-कौम्पोनॅन्टस हमें UI को स्वतंत्र, पुन: प्रयोज्य टुकड़ो में विभाजित करने में मदद करता है, तथा
-हर हिस्से को अलग मानता है| यह पेज कौम्पोनॅन्टस का परिचय देता है| आपको [यहाँ पर विस्तृत कौम्पोनॅन्ट API reference](/docs/react-component.html) मिल जाएगा|
+कौम्पोनॅन्टस हमें UI को स्वतंत्र, पुन: प्रयोज्य टुकड़ो में विभाजित करने में मदद करते हैं, तथा हर हिस्से को अलग मानते है| यह पेज कौम्पोनॅन्टस का परिचय देता है| आपको [यहाँ पर विस्तृत कौम्पोनॅन्ट API reference](/docs/react-component.html) मिल जाएगी|
 
-सैद्धांतिक रूप से, कौम्पोनॅन्टस जावास्क्रिप्ट फंक्शन्स जैसा है| वे अर्बिट्ररी इनपुट्स स्वीकार करते है (जिसे "props" बुलाया जाता है ) और React एलिमेंट्स रीटर्न करते हैं जो वर्णन करती है की स्क्रीन पर क्या आना चाहिए|
+सैद्धांतिक रूप से, कौम्पोनॅन्टस जावास्क्रिप्ट फंक्शन्स जैसे हैं| वे अर्बिट्ररी इनपुट्स स्वीकार करते है (जिसे "props" बुलाया जाता है ) और React एलिमेंट्स रीटर्न करते हैं जो वर्णन करती है की स्क्रीन पर क्या दिखना चाहिए|
 
 ## फंक्शन्स तथा क्लास कौम्पोनॅन्टस {#function-and-class-components}
 
-सबसे सरल तरीका एक कौम्पोनॅन्ट को परिभाषित करने का यह है की एक जावास्क्रिप्ट फंक्शन्स लिखा जाए:
+कौम्पोनॅन्ट को परिभाषित करने कासबसे सरल तरीका एक जावास्क्रिप्ट फंक्शन् है:
 
 ```js
 function Welcome(props) {
@@ -30,7 +29,7 @@ function Welcome(props) {
 }
 ```
 
-यह फंक्शन्स एक वैध React कौम्पोनॅन्ट है क्योकि यह एक अकेला "props" (जो प्रॉपर्टीज का प्रतिनिधित्व करता है) ऑब्जेक्ट आर्गुमेंट डाटा सहित स्वीकार करता है और React एलिमेंट्स वापस करता है| हम उन कौम्पोनॅन्टस को "फंक्शन्स कौम्पोनॅन्टस" कहते है क्योकि वो वाकई में एक जावास्क्रिप्ट फंक्शन्स है|
+यह फंक्शन्स एक वैध React कौम्पोनॅन्ट है क्योकि यह एक अकेला "props" (जो properties का प्रतिनिधित्व करता है) ऑब्जेक्ट आर्गुमेंट डाटा सहित स्वीकार करता है और React एलिमेंट् वापस करता है| हम इन कौम्पोनॅन्टस को "फंक्शन्स कौम्पोनॅन्टस" कहते है क्योकि वो वाकई में एक जावास्क्रिप्ट फंक्शन् है|
 
 आप कौम्पोनॅन्ट को परिभाषित करने के लिए एक [ES6 class](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Classes) का उपयोग भी कर सकते हैं:
 
@@ -42,13 +41,13 @@ class Welcome extends React.Component {
 }
 ```
 
-ऊपर के दोनों कौम्पोनॅन्टस बराबर है React's दृष्टिकोण से|
+ऊपर के दोनों कौम्पोनॅन्ट React के दृष्टिकोण से बराबर है|
 
-क्लासेज की कुछ अतिरिक्त विशेषताएं भी हैं जिसकी हम चर्चा [अगले खंड](/docs/state-and-lifecycle.html) में करेंगे| तब तक, हम उनकी संक्षिप्तता के लिए फ़ंक्शन कौम्पोनॅन्टस का उपयोग करेंगे।का
+क्लासेज की कुछ अतिरिक्त विशेषताएं भी हैं जिसकी हम चर्चा [अगले खंड](/docs/state-and-lifecycle.html) में करेंगे| तब तक, हम उनकी संक्षिप्तता के लिए फ़ंक्शन कौम्पोनॅन्टस का उपयोग करेंगे।
 
 ## कौम्पोनॅन्ट रेंडरिंग {#rendering-a-component}
 
-इससे पहले, हमने केवल वही React एलिमेंट्स का सामना किया जो DOM टैग्स को दर्शाता था:
+इससे पहले, हमने केवल वही React एलिमेंट्स का सामना किया जो DOM टैग्स को दर्शाते थे:
 
 ```js
 const element = <div />;
@@ -60,7 +59,7 @@ const element = <div />;
 const element = <Welcome name="Sara" />;
 ```
 
-जब कभी भी React एक एलिमेंट को यूजर-डिफाइंड कौम्पोनॅन्ट का प्रतिनिधित्व करते हुए देखता है, तुरंत ही JSX ऐट्रिब्यूट्स को पास कर देता है इन कौम्पोनॅन्ट को, एक object के रूप में| हम इस object को "props" कहते हैं|
+जब कभी भी React एक एलिमेंट को यूजर-डिफाइंड कौम्पोनॅन्ट का प्रतिनिधित्व करते हुए देखता है, तुरंत ही इन कौम्पोनॅन्टs को एक object के रूप में JSX ऐट्रिब्यूट्स पास कर देता है| हम इस object को "props" कहते हैं|
 
 उदाहरण के लिए, यह कोड पेज पर रेंडर करता है "नमस्ते, Sara":
 
@@ -78,14 +77,14 @@ ReactDOM.render(
 
 [](codepen://components-and-props/rendering-a-component)
 
-चलो देकते है इस उदाहरण में क्या होता है:
+चलिए देकते है इस उदाहरण में क्या होता है:
 
-1. हम बुलाते है `ReactDOM.render()` को `<Welcome name="Sara" />` एलिमेंट्स से|
-2. React बुलाते है `Welcome` कौम्पोनॅन्ट को `name: 'Sara'}` के साथ props के रूप में|
-3. यह `Welcome` रेंडरस और वापस आती है `<h1>नमस्ते, Sara</h1>` एलिमेंट परिणाम के तौर पर|
-4. React DOM कुशलता पूर्वक DOM को अपडेट करता है `<h1>नमस्ते, Sara</h1>` से|
+1. हम `<Welcome name="Sara" />` के द्वारा `ReactDOM.render()` को call karte है|
+2. React `Welcome` कौम्पोनॅन्ट को `name: 'Sara'}` के साथ props के रूप मे call करती है|
+3. हमारा `Welcome` कौम्पोनॅन्ट परिणाम के तौर पर वापस करता है `<h1>नमस्ते, Sara</h1>` एलिमेंट|
+4. React DOM कुशलता पूर्वक DOM को `<h1>नमस्ते, Sara</h1>` से अपडेट करता है|
 
->**ध्यान दें:** हमेशा रेंडर की नाम की शुरुवात कैपिटल लेटर से होनी चाहिए|
+>**ध्यान दें:** हमेशा रेंकौम्पोनॅन्टस की नाम की शुरुवात कैपिटल लेटर से होनी चाहिए|
 >
 >React उन कौम्पोनॅन्टस को DOM टैग्स मानता है जो लोअरकेस से स्टार्ट होते है| उदाहरण के लिए, `<div />` HTML div टैग्स को दर्शाता है, पर `<Welcome />` एक कौम्पोनॅन्ट को दर्शाता है और इसको Welcome स्कोप में चाहिए होता है|
 >

From a812889efe7d8a66bc573cd0d307862ba8804522 Mon Sep 17 00:00:00 2001
From: helios1101 <harshit.singh1101@gmail.com>
Date: Mon, 18 Mar 2019 11:50:09 +0530
Subject: [PATCH 10/16] Some_More_Changes

---
 content/docs/components-and-props.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index 0111da5ad..5baa90a9b 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -53,7 +53,7 @@ class Welcome extends React.Component {
 const element = <div />;
 ```
 
-हालाँकि, एलिमेंट्स उपयोगकर्ता परिभाषित कौम्पोनॅन्टस को भी दर्शा सकते है:
+हालाँकि, एलिमेंट्स यूज़र डिफ़ाइंड कौम्पोनॅन्टस को भी दर्शा सकते है:
 
 ```js
 const element = <Welcome name="Sara" />;

From bc283997ef3abc463eca0131a7ddce6321b49ccd Mon Sep 17 00:00:00 2001
From: helios1101 <harshit.singh1101@gmail.com>
Date: Wed, 20 Mar 2019 00:18:25 +0530
Subject: [PATCH 11/16] Some_More_Changes2

---
 content/docs/components-and-props.md | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index 5baa90a9b..8da4c503e 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -59,7 +59,7 @@ const element = <div />;
 const element = <Welcome name="Sara" />;
 ```
 
-जब कभी भी React एक एलिमेंट को यूजर-डिफाइंड कौम्पोनॅन्ट का प्रतिनिधित्व करते हुए देखता है, तुरंत ही इन कौम्पोनॅन्टs को एक object के रूप में JSX ऐट्रिब्यूट्स पास कर देता है| हम इस object को "props" कहते हैं|
+जब कभी भी React एक एलिमेंट को यूजर-डिफाइंड कौम्पोनॅन्ट का प्रतिनिधित्व करते हुए देखता है, तुरंत ही इन कौम्पोनॅन्टs को एक ऑब्जेक्ट के रूप में JSX ऐट्रिब्यूट्स पास कर देता है| हम इस ऑब्जेक्ट को "props" कहते हैं|
 
 उदाहरण के लिए, यह कोड पेज पर रेंडर करता है "नमस्ते, Sara":
 
@@ -77,24 +77,24 @@ ReactDOM.render(
 
 [](codepen://components-and-props/rendering-a-component)
 
-चलिए देकते है इस उदाहरण में क्या होता है:
+चलिए देख़ते है इस उदाहरण में क्या होता है:
 
 1. हम `<Welcome name="Sara" />` के द्वारा `ReactDOM.render()` को call karte है|
 2. React `Welcome` कौम्पोनॅन्ट को `name: 'Sara'}` के साथ props के रूप मे call करती है|
-3. हमारा `Welcome` कौम्पोनॅन्ट परिणाम के तौर पर वापस करता है `<h1>नमस्ते, Sara</h1>` एलिमेंट|
+3. हमारा `Welcome` कौम्पोनॅन्ट परिणाम के तौर पर `<h1>नमस्ते, Sara</h1>` एलिमेंट वापस लौटाता करता है|
 4. React DOM कुशलता पूर्वक DOM को `<h1>नमस्ते, Sara</h1>` से अपडेट करता है|
 
->**ध्यान दें:** हमेशा रेंकौम्पोनॅन्टस की नाम की शुरुवात कैपिटल लेटर से होनी चाहिए|
+>**ध्यान दें:** कौम्पोनॅन्टस की नाम की शुरुवात हमेशा कैपिटल लेटर से होनी चाहिए|
 >
->React उन कौम्पोनॅन्टस को DOM टैग्स मानता है जो लोअरकेस से स्टार्ट होते है| उदाहरण के लिए, `<div />` HTML div टैग्स को दर्शाता है, पर `<Welcome />` एक कौम्पोनॅन्ट को दर्शाता है और इसको Welcome स्कोप में चाहिए होता है|
+>React उन कौम्पोनॅन्टस को DOM टैग्स मानता है जो लोअरकेस अक्षरों से स्टार्ट होते है| उदाहरण के लिए, `<div />` HTML div टैग्स को दर्शाता है, पर `<Welcome />` एक कौम्पोनॅन्ट को दर्शाता है और इसके लिए Welcome स्कोप में चाहिए होता है|
 >
 >इसके पीछे की सोच के बारे में और गहराई में जानने के लिए, कृपया [JSX गहराई में](/docs/jsx-in-depth.html#user-defined-components-must-be-capitalized) पढ़ें|
 
 ## कौम्पोनॅन्टस की रचना {#composing-components}
 
-कौम्पोनॅन्टस अपने आउटपुट में अन्य कौम्पोनॅन्टस का उल्लेख कर सकते हैं| इससे हम विस्तार के किसी भी स्तर के लिए उन्ही कौम्पोनॅन्ट का उपयोग कर सकते हैं| एक बटन, एक फॉर्म, एक डायलॉग, एक स्क्रीन React ऍप्स में, इन सबको आमतौर पर कौम्पोनॅन्टस के रूप में व्यक्त किया जाता है|
+कौम्पोनॅन्टस अपने आउटपुट में अन्य कौम्पोनॅन्टस को रेफेर कर सकते हैं| यह हमें विस्तार के किसी भी स्तर के लिए उन्ही कौम्पोनॅन्ट का उपयोग करने देता है| एक बटन, एक फॉर्म, एक डायलॉग, एक स्क्रीन: इन React ऍप्स में सबको आमतौर पर कौम्पोनॅन्टस के रूप में व्यक्त किया जाता है|
 
-उदाहरण के लिए, हम एक `App` बना सकते हैं जो Welcome को कई बार रेंडर करता है:
+उदाहरण के लिए, हम एक `App` बना सकते हैं जो Welcome को कई बार रेंडर करती है:
 
 ```js{8-10}
 function Welcome(props) {
@@ -119,7 +119,7 @@ ReactDOM.render(
 
 [](codepen://components-and-props/composing-components)
 
-आम तौर पर, नया React ऍप्स के पास एक अकेला `App`  रेंडर होता है सबसे ऊपर में| हालाँकि, अगर आप एकीकृत करते हैं React को एक मौजूदा ऐप में, आप बेहद नीचे से छोटी चीज़ो के रेंडर्स से शुरुवात कर सकते हैं जैसे `Button` और धीरे-धीरे दृश्य पदानुक्रम के ऊपर तक जाते है|
+आम तौर पर, नए React ऍप्स के अंदर एक अकेला `App` कॉम्पोनेन्ट सबसे ऊपर होता है| हालाँकि, अगर आप React को एक मौजूदा ऐप में इंटेग्रेट करते है, आप बेहद छोटी चीज़ो के रेंडर्स से शुरुवात कर सकते हैं जैसे `Button` और धीरे-धीरे दृश्य पदानुक्रम के नीचे से ऊपर तक जा सकते है|
 
 ## कौम्पोनॅन्टस निकालना {#extracting-components}
 

From 91a1bc319df768800a9e4f4220a42561a7d24612 Mon Sep 17 00:00:00 2001
From: helios1101 <harshit.singh1101@gmail.com>
Date: Wed, 20 Mar 2019 08:28:22 +0530
Subject: [PATCH 12/16] Names_Made_Generic

---
 content/docs/components-and-props.md | 20 ++++++++++----------
 1 file changed, 10 insertions(+), 10 deletions(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index 8da4c503e..bd9e04405 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -56,19 +56,19 @@ const element = <div />;
 हालाँकि, एलिमेंट्स यूज़र डिफ़ाइंड कौम्पोनॅन्टस को भी दर्शा सकते है:
 
 ```js
-const element = <Welcome name="Sara" />;
+const element = <Welcome name=" नेहा" />;
 ```
 
 जब कभी भी React एक एलिमेंट को यूजर-डिफाइंड कौम्पोनॅन्ट का प्रतिनिधित्व करते हुए देखता है, तुरंत ही इन कौम्पोनॅन्टs को एक ऑब्जेक्ट के रूप में JSX ऐट्रिब्यूट्स पास कर देता है| हम इस ऑब्जेक्ट को "props" कहते हैं|
 
-उदाहरण के लिए, यह कोड पेज पर रेंडर करता है "नमस्ते, Sara":
+उदाहरण के लिए, यह कोड पेज पर रेंडर करता है "नमस्ते,  नेहा":
 
 ```js{1,5}
 function Welcome(props) {
   return <h1>नमस्ते, {props.name}</h1>;
 }
 
-const element = <Welcome name="Sara" />;
+const element = <Welcome name=" नेहा" />;
 ReactDOM.render(
   element,
   document.getElementById('root')
@@ -79,10 +79,10 @@ ReactDOM.render(
 
 चलिए देख़ते है इस उदाहरण में क्या होता है:
 
-1. हम `<Welcome name="Sara" />` के द्वारा `ReactDOM.render()` को call karte है|
-2. React `Welcome` कौम्पोनॅन्ट को `name: 'Sara'}` के साथ props के रूप मे call करती है|
-3. हमारा `Welcome` कौम्पोनॅन्ट परिणाम के तौर पर `<h1>नमस्ते, Sara</h1>` एलिमेंट वापस लौटाता करता है|
-4. React DOM कुशलता पूर्वक DOM को `<h1>नमस्ते, Sara</h1>` से अपडेट करता है|
+1. हम `<Welcome name=" नेहा" />` के द्वारा `ReactDOM.render()` को call karte है|
+2. React `Welcome` कौम्पोनॅन्ट को `name: ' नेहा'}` के साथ props के रूप मे call करती है|
+3. हमारा `Welcome` कौम्पोनॅन्ट परिणाम के तौर पर `<h1>नमस्ते,  नेहा</h1>` एलिमेंट वापस लौटाता करता है|
+4. React DOM कुशलता पूर्वक DOM को `<h1>नमस्ते,  नेहा</h1>` से अपडेट करता है|
 
 >**ध्यान दें:** कौम्पोनॅन्टस की नाम की शुरुवात हमेशा कैपिटल लेटर से होनी चाहिए|
 >
@@ -104,9 +104,9 @@ function Welcome(props) {
 function App() {
   return (
     <div>
-      <Welcome name="Sara" />
-      <Welcome name="Cahal" />
-      <Welcome name="Edite" />
+      <Welcome name=" नेहा" />
+      <Welcome name="चहल" />
+      <Welcome name="राम" />
     </div>
   );
 }

From 6ea5fb8ee8d34ca308cfab81e6ba27ac7149205b Mon Sep 17 00:00:00 2001
From: helios1101 <harshit.singh1101@gmail.com>
Date: Wed, 27 Mar 2019 14:04:22 +0530
Subject: [PATCH 13/16] secondLastChanges

---
 content/docs/components-and-props.md | 37 ++++++++++++++--------------
 1 file changed, 19 insertions(+), 18 deletions(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index bd9e04405..d6bee4d8b 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -56,19 +56,19 @@ const element = <div />;
 हालाँकि, एलिमेंट्स यूज़र डिफ़ाइंड कौम्पोनॅन्टस को भी दर्शा सकते है:
 
 ```js
-const element = <Welcome name=" नेहा" />;
+const element = <Welcome name="नेहा" />;
 ```
 
 जब कभी भी React एक एलिमेंट को यूजर-डिफाइंड कौम्पोनॅन्ट का प्रतिनिधित्व करते हुए देखता है, तुरंत ही इन कौम्पोनॅन्टs को एक ऑब्जेक्ट के रूप में JSX ऐट्रिब्यूट्स पास कर देता है| हम इस ऑब्जेक्ट को "props" कहते हैं|
 
-उदाहरण के लिए, यह कोड पेज पर रेंडर करता है "नमस्ते,  नेहा":
+उदाहरण के लिए, यह कोड पेज पर रेंडर करता है "नमस्ते, नेहा":
 
 ```js{1,5}
 function Welcome(props) {
   return <h1>नमस्ते, {props.name}</h1>;
 }
 
-const element = <Welcome name=" नेहा" />;
+const element = <Welcome name="नेहा" />;
 ReactDOM.render(
   element,
   document.getElementById('root')
@@ -79,12 +79,12 @@ ReactDOM.render(
 
 चलिए देख़ते है इस उदाहरण में क्या होता है:
 
-1. हम `<Welcome name=" नेहा" />` के द्वारा `ReactDOM.render()` को call karte है|
-2. React `Welcome` कौम्पोनॅन्ट को `name: ' नेहा'}` के साथ props के रूप मे call करती है|
-3. हमारा `Welcome` कौम्पोनॅन्ट परिणाम के तौर पर `<h1>नमस्ते,  नेहा</h1>` एलिमेंट वापस लौटाता करता है|
-4. React DOM कुशलता पूर्वक DOM को `<h1>नमस्ते,  नेहा</h1>` से अपडेट करता है|
+1. हम `<Welcome name="नेहा" />` के द्वारा `ReactDOM.render()` को call karte है|
+2. React `Welcome` कौम्पोनॅन्ट को `name: 'नेहा'}` के साथ props के रूप मे call करती है|
+3. हमारा `Welcome` कौम्पोनॅन्ट परिणाम के तौर पर `<h1>नमस्ते, नेहा</h1>` एलिमेंट वापस लौटाता करता है|
+4. React DOM कुशलता पूर्वक DOM को `<h1>नमस्ते, नेहा</h1>` से अपडेट करता है|
 
->**ध्यान दें:** कौम्पोनॅन्टस की नाम की शुरुवात हमेशा कैपिटल लेटर से होनी चाहिए|
+>**ध्यान दें:** कौम्पोनॅन्टस के नाम की शुरुवात हमेशा कैपिटल लेटर से होनी चाहिए|
 >
 >React उन कौम्पोनॅन्टस को DOM टैग्स मानता है जो लोअरकेस अक्षरों से स्टार्ट होते है| उदाहरण के लिए, `<div />` HTML div टैग्स को दर्शाता है, पर `<Welcome />` एक कौम्पोनॅन्ट को दर्शाता है और इसके लिए Welcome स्कोप में चाहिए होता है|
 >
@@ -92,7 +92,7 @@ ReactDOM.render(
 
 ## कौम्पोनॅन्टस की रचना {#composing-components}
 
-कौम्पोनॅन्टस अपने आउटपुट में अन्य कौम्पोनॅन्टस को रेफेर कर सकते हैं| यह हमें विस्तार के किसी भी स्तर के लिए उन्ही कौम्पोनॅन्ट का उपयोग करने देता है| एक बटन, एक फॉर्म, एक डायलॉग, एक स्क्रीन: इन React ऍप्स में सबको आमतौर पर कौम्पोनॅन्टस के रूप में व्यक्त किया जाता है|
+कौम्पोनॅन्टस अपने आउटपुट में अन्य कौम्पोनॅन्टस को रेफेर कर सकते हैं| यह हमें कौम्पोनॅन्ट अब्स्ट्रक्शंस का उपयोग विवरण के किसी भी स्तर के लिए करने देता है| एक बटन, एक फॉर्म, एक डायलॉग, एक स्क्रीन: इन React ऍप्स में सबको आमतौर पर कौम्पोनॅन्टस के रूप में व्यक्त किया जाता है|
 
 उदाहरण के लिए, हम एक `App` बना सकते हैं जो Welcome को कई बार रेंडर करती है:
 
@@ -104,7 +104,7 @@ function Welcome(props) {
 function App() {
   return (
     <div>
-      <Welcome name=" नेहा" />
+      <Welcome name="नेहा" />
       <Welcome name="चहल" />
       <Welcome name="राम" />
     </div>
@@ -123,9 +123,9 @@ ReactDOM.render(
 
 ## कौम्पोनॅन्टस निकालना {#extracting-components}
 
-कौम्पोनॅन्टस को छोटे छोटे कौम्पोनॅन्टस में विभाजित करने से डरना नहीं चाहिए|
+कौम्पोनॅन्टस को छोटे छोटे कौम्पोनॅन्टस में विभाजित करने में संकोच ना करे|
 
-उदाहरण के लिए, इस `Comment` कौम्पोनॅन्टस पर विचार करें:
+उदाहरण के लिए, इस `Comment` कौम्पोनॅन्ट पर विचार करें:
 
 ```js
 function Comment(props) {
@@ -153,9 +153,9 @@ function Comment(props) {
 
 [](codepen://components-and-props/extracting-components)
 
-यह `author` (एक ऑब्जेक्ट), `text` (एक string), और `date` (एक date) को props के जैसे स्वीकार करता है|
+यह `author` (एक ऑब्जेक्ट), `text` (एक string), और `date` (एक date) को props के द्वारा स्वीकार करता है, और सोशल मीडिया वेबसाइट पर एक टिप्पणी का वर्णन करता है|
 
-इस कौम्पोनॅन्टस की नेस्टिंग की वजह से इसको बदलना मुश्किल हो सकता है, तथा इसके अकेले पार्ट्स का पुन: उपयोग करना भी कठिन है| चलो कुछ कौम्पोनॅन्टस निकालते हैं|
+इस कौम्पोनॅन्टस की नेस्टिंग की वजह से बदलना मुश्किल हो सकता है, तथा इसके अकेले पार्ट्स का पुन: उपयोग करना भी कठिन है| चलिए इसमें से कुछ कौम्पोनॅन्टस निकलने की कोशिश करते हैं |
 
 सबसे पहले, हम निकालेंगे `Avatar`:
 
@@ -170,7 +170,8 @@ function Avatar(props) {
 }
 ```
 
-इस `Avatar` को जानने की जरूरत नहीं है कि यह एक `Comment` के अंदर रेंडर किया जा रहा है| इसलिए हमने इसके prop को एक ज्यादा सामान्य नाम दिया है : `author` के बजाय `user`|
+इस `Avatar` को जानने की जरूरत नहीं है कि यह एक `Comment` के अंदर रेंडर किया जा रहा है| इसलिए हमने इसके prop को `author` के बजाय एक ज्यादा
+सामान्य नाम `user` दिया है|
 
 Props का नामकरण हम कौम्पोनॅन्टस के अनुसार करने की सलाह देते हैं बजाय उस संदर्भ में किया जाए जिसमें इसका उपयोग किया जा रहा है|
 
@@ -197,7 +198,7 @@ function Comment(props) {
 }
 ```
 
-अगला, हम एक निकालेंगे `UserInfo` कौम्पोनॅन्टस जो `Avatar` को यूजर'स नाम के पास रेंडर करता है:
+आगे, हम इसमें से एक `UserInfo` कौम्पोनॅन्टस निकालेंगे जो यूजर के नाम के पास `Avatar` को रेंडर करेगा:
 
 ```js{3-8}
 function UserInfo(props) {
@@ -212,7 +213,7 @@ function UserInfo(props) {
 }
 ```
 
-यह हमे `Comment` को और भी ज्यादा आसान बनाने देता है:
+यह हमे `Comment` को और भी ज्यादा आसान बनाने का मौका देता है:
 
 ```js{4}
 function Comment(props) {
@@ -232,7 +233,7 @@ function Comment(props) {
 
 [](codepen://components-and-props/extracting-components-continued)
 
-कौम्पोनॅन्टस निकालने के लिए पहली बार में ग्रंट का काम लग सकता है, लेकिन पुन: प्रयोज्य कौम्पोनॅन्टस के एक पैलेट होना बड़े ऐप्स में भुगतान करता है| यह एक अच्छा व्यवहार है की अगर आपके UI के पार्ट कई बार इस्तेमाल किये गए है (`Button`, `Panel`, `Avatar`), या अपने आप में काफी जटिल है (`App`, `FeedStory`, `Comment`), यह पुन: प्रयोज्य कौम्पोनॅन्ट होने के लिए एक अच्छा उम्मीदवार है|
+कौम्पोनॅन्टस निकालने के लिए पहली बार में असंतोषजनक काम लग सकता है, लेकिन पुन: प्रयोज्य कौम्पोनॅन्टस का एक पैलेट होना बड़े ऐप्स बनाने में सहायता करता है| यह एक अच्छी आदत है की अगर आपके UI के पार्ट कई बार इस्तेमाल किये गए है (`Button`, `Panel`, `Avatar`), या अपने आप में काफी जटिल है (`App`, `FeedStory`, `Comment`), तब इन परिस्तियों में यह पुन: प्रयोज्य कौम्पोनॅन्ट होने के लिए एक अच्छा उम्मीदवार है|
 
 ## Props केवल-पढ़ने के लिए हैं {#props-are-read-only}
 

From 3317190c0fa75b22c37317e9ed3222466313dfa6 Mon Sep 17 00:00:00 2001
From: helios1101 <harshit.singh1101@gmail.com>
Date: Fri, 12 Apr 2019 23:55:52 +0530
Subject: [PATCH 14/16] LastChanges

---
 content/docs/components-and-props.md | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index d6bee4d8b..b11cda5dc 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -155,7 +155,7 @@ function Comment(props) {
 
 यह `author` (एक ऑब्जेक्ट), `text` (एक string), और `date` (एक date) को props के द्वारा स्वीकार करता है, और सोशल मीडिया वेबसाइट पर एक टिप्पणी का वर्णन करता है|
 
-इस कौम्पोनॅन्टस की नेस्टिंग की वजह से बदलना मुश्किल हो सकता है, तथा इसके अकेले पार्ट्स का पुन: उपयोग करना भी कठिन है| चलिए इसमें से कुछ कौम्पोनॅन्टस निकलने की कोशिश करते हैं |
+इस कौम्पोनॅन्टस की नेस्टिंग की वजह से बदलना मुश्किल हो सकता है, तथा इसके अकेले पार्ट्स का पुन: उपयोग करना भी कठिन है| चलिए इसमें से कुछ कौम्पोनॅन्टस निकालने की कोशिश करते हैं |
 
 सबसे पहले, हम निकालेंगे `Avatar`:
 
@@ -173,7 +173,7 @@ function Avatar(props) {
 इस `Avatar` को जानने की जरूरत नहीं है कि यह एक `Comment` के अंदर रेंडर किया जा रहा है| इसलिए हमने इसके prop को `author` के बजाय एक ज्यादा
 सामान्य नाम `user` दिया है|
 
-Props का नामकरण हम कौम्पोनॅन्टस के अनुसार करने की सलाह देते हैं बजाय उस संदर्भ में किया जाए जिसमें इसका उपयोग किया जा रहा है|
+Props का नामकरण हम कौम्पोनॅन्टस के अनुसार करने की सलाह देते हैं बजाय जिसमें इसका उपयोग किया जा रहा है उसके अनुसार हो|
 
 हम अब `Comment` को थोड़ा सरल कर सकते हैं:
 
@@ -233,7 +233,7 @@ function Comment(props) {
 
 [](codepen://components-and-props/extracting-components-continued)
 
-कौम्पोनॅन्टस निकालने के लिए पहली बार में असंतोषजनक काम लग सकता है, लेकिन पुन: प्रयोज्य कौम्पोनॅन्टस का एक पैलेट होना बड़े ऐप्स बनाने में सहायता करता है| यह एक अच्छी आदत है की अगर आपके UI के पार्ट कई बार इस्तेमाल किये गए है (`Button`, `Panel`, `Avatar`), या अपने आप में काफी जटिल है (`App`, `FeedStory`, `Comment`), तब इन परिस्तियों में यह पुन: प्रयोज्य कौम्पोनॅन्ट होने के लिए एक अच्छा उम्मीदवार है|
+कौम्पोनॅन्टस निकालने के लिए पहली बार में असंतोषजनक काम लग सकता है, लेकिन पुन: प्रयोज्य कौम्पोनॅन्टस का एक पैलेट होना बड़े ऐप्स बनाने में सहायता करता है| यह एक अच्छी आदत है की अगर आपके UI के पार्ट कई बार इस्तेमाल किये गए हो (`Button`, `Panel`, `Avatar`), या अपने आप में काफी जटिल हो (`App`, `FeedStory`, `Comment`), तब इन परिस्तियों में यह पुन: प्रयोज्य कौम्पोनॅन्ट होने के लिए एक अच्छा उम्मीदवार होगा|
 
 ## Props केवल-पढ़ने के लिए हैं {#props-are-read-only}
 
@@ -245,9 +245,9 @@ function sum(a, b) {
 }
 ```
 
-ऐसे फंक्शन्स को हम कहते है ["pure"](https://en.wikipedia.org/wiki/Pure_function) क्योंकि वे अपने इनपुट को बदलने का प्रयास नहीं करते हैं, और हमेशा समान इनपुट के लिए समान परिणाम लौटाते हैं| 
+ऐसे फंक्शन्स को हम ["pure"](https://en.wikipedia.org/wiki/Pure_function कहते है क्योंकि वे अपने इनपुट को बदलने का प्रयास नहीं करते हैं, और हमेशा समान इनपुट के लिए समान परिणाम लौटाते हैं| 
 
-इसके विपरीत, यह फंक्शन्स impure है क्योंकि ऐसे अपना इनपुट खुद बदलता है:
+इसके विपरीत, यह फंक्शन्स impure है क्योंकि यह अपना इनपुट खुद बदलता है:
 
 ```js
 function withdraw(account, amount) {
@@ -257,7 +257,7 @@ function withdraw(account, amount) {
 
 React बहुत लचीला है, लेकिन इसमें एक सख्त नियम है:
 
-**सारे React कौम्पोनॅन्टस को pure फंक्शन्स की तरह कार्य करना चाहिए अपने props के अनुसार|**
+**सारे React कौम्पोनॅन्टस को अपने props के अनुसार pure फंक्शन्स की तरह कार्य करना चाहिए|**
 
 
-बेशक, अनुप्रयोग UI गतिशील हैं और समय के साथ बदलते हैं| अब [अगले सेक्शन](/docs/state-and-lifecycle.html) में, हम एक नई अवधारणा पेश करेंगे "state"| State React कौम्पोनॅन्टस को उपयोगकर्ता क्रियाओं के जवाब में समय के साथ अपने उत्पादन को बदलने के लिए अनुमति देता है, नेटवर्क प्रतिक्रियाएँ, और कुछ भी, इस नियम का उल्लंघन किए बिना|
+बेशक, एप्लीकेशन UI गतिशील हैं और समय के साथ बदलते रहते हैं| अब [अगले सेक्शन](/docs/state-and-lifecycle.html) में, हम एक नई अवधारणा "state" पेश करेंगे| State React कौम्पोनॅन्टस को उपयोगकर्ता क्रियाओं, नेटवर्क प्रतिक्रियाएँ या कुछ भी, के जवाब में समय के साथ अपने आउटपुट को बदलने के लिए अनुमति देता है, बिना नियम का उल्लंघन किए|

From fd9d5689893774d91bd714cc82c82b577c00a4dc Mon Sep 17 00:00:00 2001
From: Saransh Kataria <saransh@wisdomgeek.com>
Date: Tue, 16 Apr 2019 10:52:15 -0700
Subject: [PATCH 15/16] fixed missing parenthesis

---
 content/docs/components-and-props.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index b11cda5dc..2ed451638 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -245,7 +245,7 @@ function sum(a, b) {
 }
 ```
 
-ऐसे फंक्शन्स को हम ["pure"](https://en.wikipedia.org/wiki/Pure_function कहते है क्योंकि वे अपने इनपुट को बदलने का प्रयास नहीं करते हैं, और हमेशा समान इनपुट के लिए समान परिणाम लौटाते हैं| 
+ऐसे फंक्शन्स को हम ["pure"](https://en.wikipedia.org/wiki/Pure_function) कहते है क्योंकि वे अपने इनपुट को बदलने का प्रयास नहीं करते हैं, और हमेशा समान इनपुट के लिए समान परिणाम लौटाते हैं| 
 
 इसके विपरीत, यह फंक्शन्स impure है क्योंकि यह अपना इनपुट खुद बदलता है:
 

From 385b535897de923f3a36762494ce3f936ce2b563 Mon Sep 17 00:00:00 2001
From: Saransh Kataria <saransh@wisdomgeek.com>
Date: Tue, 16 Apr 2019 10:54:24 -0700
Subject: [PATCH 16/16] reworded last line

---
 content/docs/components-and-props.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index 2ed451638..3cb5988c3 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -260,4 +260,4 @@ React बहुत लचीला है, लेकिन इसमें ए
 **सारे React कौम्पोनॅन्टस को अपने props के अनुसार pure फंक्शन्स की तरह कार्य करना चाहिए|**
 
 
-बेशक, एप्लीकेशन UI गतिशील हैं और समय के साथ बदलते रहते हैं| अब [अगले सेक्शन](/docs/state-and-lifecycle.html) में, हम एक नई अवधारणा "state" पेश करेंगे| State React कौम्पोनॅन्टस को उपयोगकर्ता क्रियाओं, नेटवर्क प्रतिक्रियाएँ या कुछ भी, के जवाब में समय के साथ अपने आउटपुट को बदलने के लिए अनुमति देता है, बिना नियम का उल्लंघन किए|
+बेशक, एप्लीकेशन UI गतिशील हैं और समय के साथ बदलते रहते हैं| अब [अगले सेक्शन](/docs/state-and-lifecycle.html) में, हम एक नई अवधारणा "state" पेश करेंगे| State React कौम्पोनॅन्टस को उपयोगकर्ता क्रियाओं, नेटवर्क प्रतिक्रियाएँ या कुछ भी, के जवाब में समय के साथ अपने आउटपुट को बदलने के लिए अनुमति देता है, बिना इस नियम का उल्लंघन किए|