Skip to content

Commit 69b741a

Browse files
authored
Merge pull request #409 from halilatilla/translate-createContext
Translate `createContext`
2 parents ae53f8b + b53b13d commit 69b741a

File tree

1 file changed

+38
-36
lines changed

1 file changed

+38
-36
lines changed

src/content/reference/react/createContext.md

Lines changed: 38 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ title: createContext
44

55
<Intro>
66

7-
`createContext` lets you create a [context](/learn/passing-data-deeply-with-context) that components can provide or read.
7+
`createContext`, bileşenlerin sağlayabileceği veya okuyabileceği bir [context](/learn/passing-data-deeply-with-context) oluşturmanızı sağlar.
88

99
```js
1010
const SomeContext = createContext(defaultValue)
@@ -16,38 +16,38 @@ const SomeContext = createContext(defaultValue)
1616

1717
---
1818

19-
## Reference {/*reference*/}
19+
## Referans {/*reference*/}
2020

2121
### `createContext(defaultValue)` {/*createcontext*/}
2222

23-
Call `createContext` outside of any components to create a context.
23+
Bir context oluşturmak için bileşenlerin dışından `createContext`'i çağırın.
2424

2525
```js
2626
import { createContext } from 'react';
2727

2828
const ThemeContext = createContext('light');
2929
```
3030

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

33-
#### Parameters {/*parameters*/}
33+
#### Parametreler {/*parameters*/}
3434

35-
* `defaultValue`: The value that you want the context to have when there is no matching context provider in the tree above the component that reads context. If you don't have any meaningful default value, specify `null`. The default value is meant as a "last resort" fallback. It is static and never changes over time.
35+
* `defaultValue`: Context'i okuyan bileşenlerin üzerinde eşleşen bir context sağlayıcısı olmadığında contextin sahip olmasını istediğiniz değer. Anlamlı bir varsayılan değeriniz yoksa, `null` belirtin. Varsayılan değer, "son çare" olarak başvurulacak bir alternatif olarak düşünülür. Statiktir ve zamanla asla değişmez.
3636

37-
#### Returns {/*returns*/}
37+
#### Geri Dönüş Değeri {/*returns*/}
3838

39-
`createContext` returns a context object.
39+
`createContext` bir context nesnesi döndürür.
4040

41-
**The context object itself does not hold any information.** It represents _which_ context other components read or provide. Typically, you will use [`SomeContext.Provider`](#provider) in components above to specify the context value, and call [`useContext(SomeContext)`](/reference/react/useContext) in components below to read it. The context object has a few properties:
41+
**Context nesnesinin kendisi herhangi bir bilgi içermez.** Diğer bileşenlerin _hangi_ contexti okuyacağını veya sağlayacağını temsil eder. Genellikle, context değerini belirtmek için bileşenin üstünde [SomeContext.Provider](https://react.dev/reference/react/createContext#provider) kullanır ve bileşenin altında okumak için [useContext(SomeContext)](https://react.dev/reference/react/useContext) çağırırsınız. Context nesnesinin birkaç özelliği vardır:
4242

43-
* `SomeContext.Provider` lets you provide the context value to components.
44-
* `SomeContext.Consumer` is an alternative and rarely used way to read the context value.
43+
* `SomeContext.Provider` bilenşenlerin context değerini sağlamanıza olanak tanır.
44+
* `SomeContext.Consumer` context değerini okumak için nadiren kullanılan alternatif bir yöntemdir.
4545

4646
---
4747

4848
### `SomeContext.Provider` {/*provider*/}
4949

50-
Wrap your components into a context provider to specify the value of this context for all components inside:
50+
Bileşenlerinizi bir context sağlayıcısı ile sarmalayarak içindeki tüm bileşenler için bu contextin değerini belirtin:
5151

5252
```js
5353
function App() {
@@ -63,17 +63,18 @@ function App() {
6363

6464
#### Props {/*provider-props*/}
6565

66-
* `value`: The value that you want to pass to all the components reading this context inside this provider, no matter how deep. The context value can be of any type. A component calling [`useContext(SomeContext)`](/reference/react/useContext) inside of the provider receives the `value` of the innermost corresponding context provider above it.
66+
* `value`: Ne kadar derin olursa olsun, bu sağlayıcının içindeki contexti okuyan tüm bileşenlere aktarmak istediğiniz değer. Context değeri herhangi bir türde olabilir. Sağlayıcı içinde [`useContext(SomeContext)`](/reference/react/useContext) kullanan bir bileşen,
67+
üzerindeki en içte bulunan ilgili context sağlayıcısının `value` değerini alır.
6768

6869
---
6970

7071
### `SomeContext.Consumer` {/*consumer*/}
7172

72-
Before `useContext` existed, there was an older way to read context:
73+
`useContext` var olmadan önce, contexti okumak için daha eski bir yol vardı:
7374

7475
```js
7576
function Button() {
76-
// 🟡 Legacy way (not recommended)
77+
// 🟡 Eski yöntem (önerilmez)
7778
return (
7879
<ThemeContext.Consumer>
7980
{theme => (
@@ -84,29 +85,29 @@ function Button() {
8485
}
8586
```
8687

87-
Although this older way still works, but **newly written code should read context with [`useContext()`](/reference/react/useContext) instead:**
88+
Bu eski yöntem hala çalışıyor olsa da, **yeni yazılan kodun contextini [`useContext()`](/reference/react/useContext) ile okumak daha uygundur:**
8889

8990
```js
9091
function Button() {
91-
//Recommended way
92+
//Önerilen yöntem
9293
const theme = useContext(ThemeContext);
9394
return <button className={theme} />;
9495
}
9596
```
9697

9798
#### Props {/*consumer-props*/}
9899

99-
* `children`: A function. React will call the function you pass with the current context value determined by the same algorithm as [`useContext()`](/reference/react/useContext) does, and render the result you return from this function. React will also re-run this function and update the UI whenever the context from the parent components changes.
100+
* `children`: Bir fonksiyon. React, üst bileşenlerden gelen contextin güncel değerini [`useContext()`](/reference/react/useContext) ile aynı algoritmayı kullanarak belirleyecek ve bu fonksiyondan döndürdüğünüz sonucu render edecektir. Üst bileşenlerden gelen context değiştiğinde, React bu fonksiyonu tekrar çalıştırır ve UI'yi günceller.
100101

101102
---
102103

103-
## Usage {/*usage*/}
104+
## Kullanım {/*usage*/}
104105

105-
### Creating context {/*creating-context*/}
106+
### Context oluşturma {/*creating-context*/}
106107

107-
Context lets components [pass information deep down](/learn/passing-data-deeply-with-context) without explicitly passing props.
108+
Context, bileşenlerin [bilgiyi derinlemesine aktarmasına](/learn/passing-data-deeply-with-context) olanak tanır ve açıkça propları geçirmeden yapar.
108109

109-
Call `createContext` outside any components to create one or more contexts.
110+
Bir veya birden fazla context oluşturmak için bileşenlerin dışında `createContext`'i çağırın.
110111

111112
```js [[1, 3, "ThemeContext"], [1, 4, "AuthContext"], [3, 3, "'light'"], [3, 4, "null"]]
112113
import { createContext } from 'react';
@@ -115,7 +116,7 @@ const ThemeContext = createContext('light');
115116
const AuthContext = createContext(null);
116117
```
117118

118-
`createContext` returns a <CodeStep step={1}>context object</CodeStep>. Components can read context by passing it to [`useContext()`](/reference/react/useContext):
119+
`createContext` bir <CodeStep step={1}>context nesnesi</CodeStep> döndürür. Bileşenler okumak istediği contexti [useContext()](https://react.dev/reference/react/useContext)'e ileterek kullanabilir:
119120

120121
```js [[1, 2, "ThemeContext"], [1, 7, "AuthContext"]]
121122
function Button() {
@@ -129,9 +130,9 @@ function Profile() {
129130
}
130131
```
131132

132-
By default, the values they receive will be the <CodeStep step={3}>default values</CodeStep> you have specified when creating the contexts. However, by itself this isn't useful because the default values never change.
133+
Varsayılan olarak, aldıkları değerler contexti oluştururken belirttiğiniz <CodeStep step={3}>varsayılan değerler</CodeStep> olacaktır. Ancak, varsayılan değerlerin hiçbiri zamanla değişmediği için bu tek başına yararlı değildir.
133134

134-
Context is useful because you can **provide other, dynamic values from your components:**
135+
Context, **bileşenlerinizden diğer dinamik değerleri sağlayabileceğiniz** için kullanışlıdır:
135136

136137
```js {8-9,11-12}
137138
function App() {
@@ -150,15 +151,16 @@ function App() {
150151
}
151152
```
152153

153-
Now the `Page` component and any components inside it, no matter how deep, will "see" the passed context values. If the passed context values change, React will re-render the components reading the context as well.
154+
Şimdi `Page` bileşeni ve içindeki herhangi bir bileşen, ne kadar derin olursa olsun, iletilen context değerlerini "görecek" ve iletilen context değerleri değişirse, React contexti okuyan bileşenleri yeniden render edecektir.
154155

155-
[Read more about reading and providing context and see examples.](/reference/react/useContext)
156+
[Okuma ve sağlama contexti hakkında daha fazla bilgi edinin ve örnekleri görün.](/reference/react/useContext)
156157

157158
---
158159

159-
### Importing and exporting context from a file {/*importing-and-exporting-context-from-a-file*/}
160+
### Contexti bir dosyadan içe ve dışa aktarma {/*importing-and-exporting-context-from-a-file*/}
160161

161-
Often, components in different files will need access to the same context. This is why it's common to declare contexts in a separate file. Then you can use the [`export` statement](https://developer.mozilla.org/en-US/docs/web/javascript/reference/statements/export) to make context available for other files:
162+
163+
Çoğu zaman, farklı dosyalardaki bileşenlerin aynı contexte erişmesi gerekecektir. Bu nedenle, contextleri ayrı bir dosyada oluşturmak yaygındır. Ardından, diğer dosyalar için contexti kullanılabilir kılmak için [export ifadesini](https://developer.mozilla.org/en-US/docs/web/javascript/reference/statements/export) kullanabilirsiniz:
162164

163165
```js {4-5}
164166
// Contexts.js
@@ -168,7 +170,7 @@ export const ThemeContext = createContext('light');
168170
export const AuthContext = createContext(null);
169171
````
170172

171-
Components declared in other files can then use the [`import`](https://developer.mozilla.org/en-US/docs/web/javascript/reference/statements/import) statement to read or provide this context:
173+
Diğer dosyalarda tanımlanan bileşenler, bu contexti okumak veya sağlamak için [`import`](https://developer.mozilla.org/en-US/docs/web/javascript/reference/statements/import) ifadesini kullanabilir:
172174

173175
```js {2}
174176
// Button.js
@@ -196,22 +198,22 @@ function App() {
196198
}
197199
```
198200

199-
This works similar to [importing and exporting components.](/learn/importing-and-exporting-components)
201+
Bu, [bileşenleri içe ve dışa aktarma.](/learn/importing-and-exporting-components) işlemine benzer şekilde çalışır.
200202

201203
---
202204

203-
## Troubleshooting {/*troubleshooting*/}
205+
## Sorun Giderme {/*troubleshooting*/}
204206

205-
### I can't find a way to change the context value {/*i-cant-find-a-way-to-change-the-context-value*/}
207+
### Context değerini değiştirmenin bir yolunu bulamıyorum {/*i-cant-find-a-way-to-change-the-context-value*/}
206208

207209

208-
Code like this specifies the *default* context value:
210+
Böyle bir kod, *varsayılan* context değerini belirtir:
209211

210212
```js
211213
const ThemeContext = createContext('light');
212214
```
213215

214-
This value never changes. React only uses this value as a fallback if it can't find a matching provider above.
216+
Bu değer asla değişmez. React, yalnızca eşleşen bir sağlayıcı bulamazsa bu değeri bir geri dönüş olarak kullanır.
215217

216-
To make context change over time, [add state and wrap components in a context provider.](/reference/react/useContext#updating-data-passed-via-context)
218+
Contextin zaman içinde değişmesini sağlamak için, [state ekleyin ve bileşenleri context sağlayıcısıyla sarın.](/reference/react/useContext#updating-data-passed-via-context)
217219

0 commit comments

Comments
 (0)