feat: add Turkish translation for render

Author: buraksakalli

src/content/reference/react-dom/render.md

@@ -4,15 +4,15 @@ title: render
 
 <Deprecated>
 
-This API will be removed in a future major version of React.
+Bu API, React'in gelecekteki bir ana sürümünde kaldırılacaktır.
 
-In React 18, `render` was replaced by [`createRoot`.](/reference/react-dom/client/createRoot) Using `render` in React 18 will warn that your app will behave as if it’s running React 17. Learn more [here.](/blog/2022/03/08/react-18-upgrade-guide#updates-to-client-rendering-apis)
+React 18'de `render` [`createRoot`.](/reference/react-dom/client/createRoot) ile değiştirildi. React 18'de `render` kullanmak, uygulamanızın React 17 gibi davranacağı uyarısını verecektir. Daha fazla bilgi için [buraya](/blog/2022/03/08/react-18-upgrade-guide#updates-to-client-rendering-apis) bakın.
 
 </Deprecated>
 
 <Intro>
 
-`render` renders a piece of [JSX](/learn/writing-markup-with-jsx) ("React node") into a browser DOM node.
+`render` bir [JSX](/learn/writing-markup-with-jsx) ("React düğümü") parçasını tarayıcı DOM düğümüne işler.
 
 ```js
 render(reactNode, domNode, callback?)
@@ -24,11 +24,11 @@ render(reactNode, domNode, callback?)
 
 ---
 
-## Reference {/*reference*/}
+## Başvuru dokümanı {/*reference*/}
 
 ### `render(reactNode, domNode, callback?)` {/*render*/}
 
-Call `render` to display a React component inside a browser DOM element.
+Bir React bileşenini tarayıcı DOM düğümüne işlemek için `render`'ı çağırın.
 
 ```js
 import { render } from 'react-dom';
@@ -39,38 +39,43 @@ render(<App />, domNode);
 
 React will display `<App />` in the `domNode`, and take over managing the DOM inside it.
 
-An app fully built with React will usually only have one `render` call with its root component.  A page that uses "sprinkles" of React for parts of the page may have as many `render` calls as needed.
+React `<App />`'i `domNode` içinde görüntüleyecek ve içindeki DOM'u yönetmeye başlayacaktır.
 
-[See more examples below.](#usage)
+Tamamen React ile oluşturulmuş bir uygulama genellikle kök(root) bileşeni ile yalnızca bir `render` çağrısına sahip olacaktır. Sayfanın bazı bölümleri için React "sprinkles" kullanan bir sayfada, gerektiği kadar çok `render` çağrısına sahip olabilir.
 
-#### Parameters {/*parameters*/}
+[Daha fazla örnek için aşağıya bakın.](#usage)
+
+#### Parametreler {/*parameters*/}
 
 * `reactNode`: A *React node* that you want to display. This will usually be a piece of JSX like `<App />`, but you can also pass a React element constructed with [`createElement()`](/reference/react/createElement), a string, a number, `null`, or `undefined`. 
 
-* `domNode`: A [DOM element.](https://developer.mozilla.org/en-US/docs/Web/API/Element) React will display the `reactNode` you pass inside this DOM element. From this moment, React will manage the DOM inside the `domNode` and update it when your React tree changes.
+* `reactNode`: Görüntülemek istediğiniz *React düğümü*. Bu genellikle `<App />` gibi bir JSX parçası olacaktır, ancak [`createElement()`](/reference/react/createElement) ile oluşturulmuş bir React elemanına, bir dize, bir sayı, `null` veya `undefined` da geçirebilirsiniz.
 
-* **optional** `callback`: A function. If passed, React will call it after your component is placed into the DOM.
+* `domNode`: [DOM elemanı.](https://developer.mozilla.org/en-US/docs/Web/API/Element) React, geçtiğiniz `reactNode`'u bu DOM elemanının içinde görüntüleyecektir. Bu andan itibaren, React `domNode` içindeki DOM'u yönetecek ve React ağacınız değiştiğinde güncelleyecektir.
 
+* **optional** `callback`: Fonksiyon. Geçilirse, React bileşeniniz DOM'a yerleştirildikten sonra onu çağıracaktır.
 
-#### Returns {/*returns*/}
+#### Dönüş değerleri {/*returns*/}
 
 `render` usually returns `null`. However, if the `reactNode` you pass is a *class component*, then it will return an instance of that component.
 
-#### Caveats {/*caveats*/}
+`render` genellikle `null` döndürür. Ancak, geçtiğiniz `reactNode` bir *sınıf bileşeni* ise, o zaman bileşenin bir örneğini döndürecektir.
+
+#### Dikkat edilmesi gerekenler {/*caveats*/}
 
-* In React 18, `render` was replaced by [`createRoot`.](/reference/react-dom/client/createRoot) Please use `createRoot` for React 18 and beyond.
+* React 18'de `render` [`createRoot`.](/reference/react-dom/client/createRoot) ile değiştirildi. Lütfen React 18 ve sonrası için `createRoot` kullanın.
 
-* The first time you call `render`, React will clear all the existing HTML content inside the `domNode` before rendering the React component into it. If your `domNode` contains HTML generated by React on the server or during the build, use [`hydrate()`](/reference/react-dom/hydrate) instead, which attaches the event handlers to the existing HTML.
+* İlk `render` çağrısında, React, React bileşenini render etmek için `domNode` içindeki tüm mevcut HTML içeriğini temizleyecektir. `domNode`'unuz, sunucu veya derleme sırasında React tarafından oluşturulan HTML içeriyorsa, bunun yerine var olan HTML'e olay işleyicilerini ekleyen [`hydrate()`](/reference/react-dom/hydrate) kullanın.
 
-* If you call `render` on the same `domNode` more than once, React will update the DOM as necessary to reflect the latest JSX you passed. React will decide which parts of the DOM can be reused and which need to be recreated by ["matching it up"](/learn/preserving-and-resetting-state) with the previously rendered tree. Calling `render` on the same `domNode` again is similar to calling the [`set` function](/reference/react/useState#setstate) on the root component: React avoids unnecessary DOM updates.
+* Eğer aynı `domNode` üzerinde birden fazla `render` çağrısı yaparsanız, React, geçtiğiniz son JSX'i yansıtmak için gerektiğinde DOM'u güncelleyecektir. React, DOM'un hangi kısımlarının yeniden kullanılabileceğine ve hangilerinin önceki ağaçla(tree) ["eşleştirilerek"](/learn/preserving-and-resetting-state) yeniden oluşturulması gerektiğine karar verecektir. Aynı `domNode` üzerinde `render` çağrısı yapmak, kök bileşen (root component) üzerinde [`set` fonksiyonunu](/reference/react/useState#setstate) çağırmaya benzer: React gereksiz DOM güncellemelerinden kaçınır.
 
-* If your app is fully built with React, you'll likely have only one `render` call in your app. (If you use a framework, it might do this call for you.) When you want to render a piece of JSX in a different part of the DOM tree that isn't a child of your component (for example, a modal or a tooltip), use [`createPortal`](/reference/react-dom/createPortal) instead of `render`.
+* Eğer uygulamanız tamamen React ile oluşturulmuşsa, uygulamanızda muhtemelen yalnızca bir `render` çağrısı olacaktır. (Bir çatı(framework) kullanıyorsanız, bunu sizin için yapabilir.) JSX'in bir parçasını bileşeninizin bir alt öğesi olmayan DOM ağacının farklı bir yerinde görüntülemek istediğinizde (örneğin, bir modal veya bir tooltip), `render` yerine [`createPortal`](/reference/react-dom/createPortal) kullanın.
 
 ---
 
-## Usage {/*usage*/}
+## Kullanım {/*usage*/}
 
-Call `render` to display a <CodeStep step={1}>React component</CodeStep> inside a <CodeStep step={2}>browser DOM node</CodeStep>.
+Bir <CodeStep step={1}>React bileşenini</CodeStep> bir <CodeStep step={2}>tarayıcı DOM düğümünde</CodeStep> görüntülemek için `render`'ı çağırın.
 
 ```js [[1, 4, "<App />"], [2, 4, "document.getElementById('root')"]]
 import { render } from 'react-dom';
@@ -79,10 +84,12 @@ import App from './App.js';
 render(<App />, document.getElementById('root'));
 ```
 
-### Rendering the root component {/*rendering-the-root-component*/}
+### Kök bileşeni render etmek {/*rendering-the-root-component*/}
 
 In apps fully built with React, **you will usually only do this once at startup**--to render the "root" component.
 
+Tamamen React ile oluşturulmuş uygulamalarda, **genellikle bunu yalnızca başlangıçta bir kez yapacaksınız** - "kök" bileşenini render etmek için.
+
 <Sandpack>
 
 ```js index.js active
@@ -95,26 +102,26 @@ render(<App />, document.getElementById('root'));
 
 ```js App.js
 export default function App() {
-  return <h1>Hello, world!</h1>;
+  return <h1>Merhaba Dünya!</h1>;
 }
 ```
 
 </Sandpack>
 
-Usually you shouldn't need to call `render` again or to call it in more places. From this point on, React will be managing the DOM of your application. To update the UI, your components will [use state.](/reference/react/useState)
+Genellikle `render`'ı tekrar çağırmanıza veya daha fazla yere çağırmanıza gerek yoktur. Bu noktadan itibaren, React uygulamanızın DOM'unu yönetmeye başlayacaktır. Kullanıcı arayüzünü güncellemek için bileşenleriniz [state](/reference/react/useState) kullanacak.
 
 ---
 
-### Rendering multiple roots {/*rendering-multiple-roots*/}
+### Birden çok kök oluşturma {/*rendering-multiple-roots*/}
 
-If your page [isn't fully built with React](/learn/add-react-to-an-existing-project#using-react-for-a-part-of-your-existing-page), call `render` for each top-level piece of UI managed by React.
+Eğer sayfanız [tamamen React ile oluşturulmamışsa](/learn/add-react-to-an-existing-project#using-react-for-a-part-of-your-existing-page), React tarafından yönetilen her bir üst düzey UI parçası için `render`'ı çağırın.
 
 <Sandpack>
 
 ```html public/index.html
 <nav id="navigation"></nav>
 <main>
-  <p>This paragraph is not rendered by React (open index.html to verify).</p>
+  <p>Bu paragraf React tarafından render edilmiyor (doğrulamak için index.html'i açın).</p>
   <section id="comments"></section>
 </main>
 ```
@@ -139,8 +146,8 @@ render(
 export function Navigation() {
   return (
     <ul>
-      <NavLink href="/">Home</NavLink>
-      <NavLink href="/about">About</NavLink>
+      <NavLink href="/">Anasayfa</NavLink>
+      <NavLink href="/about">Hakkında</NavLink>
     </ul>
   );
 }
@@ -157,8 +164,8 @@ export function Comments() {
   return (
     <>
       <h2>Comments</h2>
-      <Comment text="Hello!" author="Sophie" />
-      <Comment text="How are you?" author="Sunil" />
+      <Comment text="Merhaba!" author="Sophie" />
+      <Comment text="Nasılsın?" author="Sunil" />
     </>
   );
 }
@@ -177,14 +184,16 @@ nav ul li { display: inline-block; margin-right: 20px; }
 
 </Sandpack>
 
-You can destroy the rendered trees with [`unmountComponentAtNode()`.](/reference/react-dom/unmountComponentAtNode)
+[`unmountComponentAtNode()`](/reference/react-dom/unmountComponentAtNode) ile render edilmiş ağaçları(trees) yok edebilirsiniz.
 
 ---
 
-### Updating the rendered tree {/*updating-the-rendered-tree*/}
+### Render edilmiş ağaçları güncelleme {/*updating-the-rendered-tree*/}
 
 You can call `render` more than once on the same DOM node. As long as the component tree structure matches up with what was previously rendered, React will [preserve the state.](/learn/preserving-and-resetting-state) Notice how you can type in the input, which means that the updates from repeated `render` calls every second are not destructive:
 
+Aynı DOM düğümü üzerinde `render`'ı birden fazla kez çağırabilirsiniz. Bileşen ağacı yapısı önceki render edilmiş olanla eşleştiği sürece, React [durumu koruyacaktır.](/learn/preserving-and-resetting-state) Tekrarlanan `render` çağrılarından her saniye gelen güncellemelerin yıkıcı olmadığını gösteren girişe yazı yazabileceğinize dikkat edin:
+
 <Sandpack>
 
 ```js index.js active
@@ -206,13 +215,13 @@ setInterval(() => {
 export default function App({counter}) {
   return (
     <>
-      <h1>Hello, world! {counter}</h1>
-      <input placeholder="Type something here" />
+      <h1>Merhaba Dünya! {counter}</h1>
+      <input placeholder="Buraya bir şey yazın" />
     </>
   );
 }
 ```
 
 </Sandpack>
 
-It is uncommon to call `render` multiple times. Usually, you'll [update state](/reference/react/useState) inside your components instead.
+Bu şekilde birden fazla kez `render` çağırmak nadirdir. Genellikle, bunun yerine bileşenlerinizin içinde [state'i güncellersiniz.](/reference/react/useState)