Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feature: add Turkish translation for useDebugValue #454

Merged
merged 2 commits into from May 20, 2023
Merged
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
40 changes: 20 additions & 20 deletions src/content/reference/react/useDebugValue.md
Expand Up @@ -4,7 +4,7 @@ title: useDebugValue

<Intro>

`useDebugValue` is a React Hook that lets you add a label to a custom Hook in [React DevTools.](/learn/react-developer-tools)
`useDebugValue`, [React Geliştirici Araçları](/learn/react-developer-tools) içindeki özel bir Hook'a etiket eklemenizi sağlayan bir React Hook'udur.

```js
useDebugValue(value, format?)
Expand All @@ -16,11 +16,11 @@ useDebugValue(value, format?)

---

## Reference {/*reference*/}
## Başvuru Dokümanı {/*reference*/}

### `useDebugValue(value, format?)` {/*usedebugvalue*/}

Call `useDebugValue` at the top level of your [custom Hook](/learn/reusing-logic-with-custom-hooks) to display a readable debug value:
Okunabilir bir hata ayıklama değeri göstermek için [özel hook](/learn/reusing-logic-with-custom-hooks)'unuzun üst düzeyinde `useDebugValue`'yi çağırın.

```js
import { useDebugValue } from 'react';
Expand All @@ -32,22 +32,22 @@ function useOnlineStatus() {
}
```

[See more examples below.](#usage)
[Daha fazla örnek için aşağıya bakınız.](#usage)

#### Parameters {/*parameters*/}
#### Parametreler {/*parameters*/}

* `value`: The value you want to display in React DevTools. It can have any type.
* **optional** `format`: A formatting function. When the component is inspected, React DevTools will call the formatting function with the `value` as the argument, and then display the returned formatted value (which may have any type). If you don't specify the formatting function, the original `value` itself will be displayed.
* `value`: React Geliştirici Araçları'nda görüntülemek istediğiniz değer. Herhangi bir tür olabilir.
buraksakalli marked this conversation as resolved.
Show resolved Hide resolved
* **isteğe bağlı** `format`: Biçimlendirme fonksiyonu. Bileşen denetlendiğinde, React Geliştirici Araçları, biçimlendirme fonksiyonunu `value` ile birlikte çağırır ve ardından döndürülen biçimlendirilmiş değeri (herhangi bir türde olabilir) görüntüler. Biçimlendirme fonksiyonunu belirtmezseniz, orijinal `value` kendisi görüntülenir.

#### Returns {/*returns*/}
#### Dönüş değerleri {/*returns*/}

`useDebugValue` does not return anything.
`useDebugValue` hiçbir değer döndürmez.

## Usage {/*usage*/}
## Kullanım {/*usage*/}

### Adding a label to a custom Hook {/*adding-a-label-to-a-custom-hook*/}
### Özel bir Hook'a bir etiket eklemek. {/*adding-a-label-to-a-custom-hook*/}

Call `useDebugValue` at the top level of your [custom Hook](/learn/reusing-logic-with-custom-hooks) to display a readable <CodeStep step={1}>debug value</CodeStep> for [React DevTools.](/learn/react-developer-tools)
Özel Hook'un üst düzeyinde `useDebugValue`'yi çağırarak, [React Geliştirici Araçları](/learn/react-developer-tools) için okunabilir bir hata ayıklama değeri gösterin.

```js [[1, 5, "isOnline ? 'Online' : 'Offline'"]]
import { useDebugValue } from 'react';
Expand All @@ -59,11 +59,11 @@ function useOnlineStatus() {
}
```

This gives components calling `useOnlineStatus` a label like `OnlineStatus: "Online"` when you inspect them:
Bu, `useOnlineStatus`'u çağıran bileşenlere denetlendiğinde `OnlineStatus: "Online"` gibi bir etiket verir:

![A screenshot of React DevTools showing the debug value](/images/docs/react-devtools-usedebugvalue.png)
![Hata ayıklama değerini gösteren React DevTools ekran görüntüsü](/images/docs/react-devtools-usedebugvalue.png)

Without the `useDebugValue` call, only the underlying data (in this example, `true`) would be displayed.
`useDebugValue` çağrısı olmadan, yalnızca temel veriler (bu örnekte `true`) görüntülenirdi.

<Sandpack>

Expand Down Expand Up @@ -103,20 +103,20 @@ function subscribe(callback) {

<Note>

Don't add debug values to every custom Hook. It's most valuable for custom Hooks that are part of shared libraries and that have a complex internal data structure that's difficult to inspect.
Her özel Hook'a hata ayıklama değeri eklemeyin. En değerli olanı, paylaşılan kütüphanelerde bulunan ve incelenmesi zor olan karmaşık bir iç veri yapısına sahip olan özel Hook'lar için geçerlidir.
buraksakalli marked this conversation as resolved.
Show resolved Hide resolved

</Note>

---

### Deferring formatting of a debug value {/*deferring-formatting-of-a-debug-value*/}
### Hata ayıklama değerinin biçimlendirmesini erteleme {/*deferring-formatting-of-a-debug-value*/}

You can also pass a formatting function as the second argument to `useDebugValue`:
`useDebugValue`'ye ikinci argüman olarak bir biçimlendirme fonksiyonu da geçirebilirsiniz:

```js [[1, 1, "date", 18], [2, 1, "date.toDateString()"]]
useDebugValue(date, date => date.toDateString());
```

Your formatting function will receive the <CodeStep step={1}>debug value</CodeStep> as a parameter and should return a <CodeStep step={2}>formatted display value</CodeStep>. When your component is inspected, React DevTools will call this function and display its result.
Biçimlendirme fonksiyonunuz, hata ayıklama değerini parametre olarak alacak ve biçimlendirilmiş görüntü değerini döndürmelidir. Bileşeniniz denetlendiğinde, React Geliştirici Araçları bu fonksiyonu çağırır ve sonucunu görüntüler.

This lets you avoid running potentially expensive formatting logic unless the component is actually inspected. For example, if `date` is a Date value, this avoids calling `toDateString()` on it for every render.
Bu, bileşen gerçekten denetlenmediği sürece, potansiyel olarak pahalı bir biçimlendirme mantığını çalıştırmaktan kaçınmanızı sağlar. Örneğin, `date` bir Date değeri ise, her render işlemi için `toDateString()` fonksiyonunu çağırmaktan kaçınılabilir.