Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
34 changes: 24 additions & 10 deletions src/content/community/conferences.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,27 +10,41 @@ Do you know of a local React.js conference? Add it here! (Please keep the list c

## Upcoming Conferences {/*upcoming-conferences*/}

### React Paris 2026 {/*react-paris-2026*/}
March 26 - 27, 2026. In-person in Paris, France (hybrid event)
### ZurichJS Conf 2026 {/*zurichjs-conf-2026*/}
September 10-11, 2026. In-person in Zurich, Switzerland

[Website](https://react.paris/) - [Twitter](https://x.com/BeJS_)
[Website](https://conf.zurichjs.com?utm_campaign=ZurichJS_Conf&utm_source=referral&utm_content=reactjs_community_conferences) - [Twitter](https://x.com/zurichjs) - [LinkedIn](https://www.linkedin.com/company/zurichjs/)

### CityJS London 2026 {/*cityjs-london-2026*/}
April 14-17, 2026. In-person in London
### React Alicante 2026 {/*react-alicante-2026*/}
Sep 24 - 26, 2026. In-person in Alicante

[Website](https://india.cityjsconf.org/) - [Twitter](https://x.com/cityjsconf) - [Bluesky](https://bsky.app/profile/cityjsconf.bsky.social)
[Website](https://reactalicante.es//) - [Twitter](https://x.com/ReactAlicante)

### ZurichJS Conf 2026 {/*zurichjs-conf-2026*/}
September 10-11, 2026. In-person in Zurich, Switzerland
### CityJS Athens 2026 {/*cityjs-athens-2026*/}
October 21-23, 2026. In-person in Athens

[Website](https://athens.cityjsconf.org/) - [Twitter](https://x.com/cityjsconf) - [Bluesky](https://bsky.app/profile/cityjsconf.bsky.social)


## Past Conferences {/*past-conferences*/}

[Website](https://conf.zurichjs.com?utm_campaign=ZurichJS_Conf&utm_source=referral&utm_content=reactjs_community_conferences) - [Twitter](https://x.com/zurichjs) - [LinkedIn](https://www.linkedin.com/company/zurichjs/)

### React Conf Japan 2027 {/*react-conf-japan-2027*/}
April 24, 2027. In-person in Tokyo, Japan

[Website](https://reactconf.jp/) - [Twitter](https://x.com/reactconfjp)

## Past Conferences {/*past-conferences*/}
### CityJS London 2026 {/*cityjs-london-2026*/}
April 14-17, 2026. In-person in London

[Website](https://india.cityjsconf.org/) - [Twitter](https://x.com/cityjsconf) - [Bluesky](https://bsky.app/profile/cityjsconf.bsky.social)


### React Paris 2026 {/*react-paris-2026*/}
March 26 - 27, 2026. In-person in Paris, France (hybrid event)

[Website](https://react.paris/) - [Twitter](https://x.com/BeJS_)


### CityJS New Delhi 2026 {/*cityjs-newdelhi-2026*/}
February 12-13, 2026. In-person in New Delhi, India
Expand Down
13 changes: 1 addition & 12 deletions src/content/reference/react-dom/server/renderToPipeableStream.md
Original file line number Diff line number Diff line change
Expand Up @@ -49,27 +49,16 @@ const { pipe } = renderToPipeableStream(<App />, {
* `reactNode`: HTML'e render etmek istediğiniz React düğümüdür. Örneğin, `<App />` gibi bir JSX bileşeni. Belgenin tamamını temsil etmesi beklediğinden dolayı `App` bileşeni `<html>` etiketini render etmelidir.

* **optional** `options`: Streaming options içeren bir object.

* **optional** `bootstrapScriptContent`: Belirtilirse, bu string inline bir `<script>` tag’i içine yerleştirilir.

* **optional** `bootstrapScripts`: Sayfada emit edilecek `<script>` tag’leri için string URL’lerden oluşan bir array. [`hydrateRoot`](/reference/react-dom/client/hydrateRoot) çağıran `<script>`’i dahil etmek için bunu kullanın. Client tarafında React’i hiç çalıştırmak istemiyorsanız bunu atlayın.

* **optional** `bootstrapModules`: `bootstrapScripts` gibidir, ancak bunun yerine [`<script type="module">`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules) emit eder.

* **optional** `identifierPrefix`: React’in [`useId`](/reference/react/useId) tarafından oluşturulan ID’ler için kullandığı string prefix. Aynı sayfada birden fazla root kullanırken conflict’leri önlemek için kullanışlıdır. [`hydrateRoot`](/reference/react-dom/client/hydrateRoot#parameters)’a geçirilen prefix ile aynı olmalıdır.

* **optional** `namespaceURI`: Stream için root [namespace URI](https://developer.mozilla.org/en-US/docs/Web/API/Document/createElementNS#important_namespace_uris)’sini içeren bir string. Default olarak normal HTML’dir. SVG için `'http://www.w3.org/2000/svg'`, MathML için `'http://www.w3.org/1998/Math/MathML'` geçirin.

* **optional** `nonce`: [`script-src` Content-Security-Policy](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/script-src) için script’lere izin veren bir [`nonce`](http://developer.mozilla.org/en-US/docs/Web/HTML/Element/script#nonce) string’i.

* **optional** `onAllReady`: Hem [shell](#specifying-what-goes-into-the-shell) hem de tüm ek [content](#streaming-more-content-as-it-loads) dahil olmak üzere tüm rendering tamamlandığında tetiklenen bir callback. Bunu `onShellReady` yerine [crawler’lar ve static generation](#waiting-for-all-content-to-load-for-crawlers-and-static-generation) için kullanabilirsiniz. Burada streaming’i başlatırsanız progressive loading elde etmezsiniz. Stream final HTML’i içerir.

* **optional** `onError`: [Recoverable](#recovering-from-errors-outside-the-shell) olsun ya da [olmasın](#recovering-from-errors-inside-the-shell), server error olduğunda tetiklenen bir callback. Default olarak yalnızca `console.error` çağırır. [Crash report’ları loglamak](#logging-crashes-on-the-server) için override ederseniz, yine de `console.error` çağırdığınızdan emin olun. Shell emit edilmeden önce [status code’u ayarlamak](#setting-the-status-code) için de kullanabilirsiniz.

* **optional** `onShellReady`: [Initial shell](#specifying-what-goes-into-the-shell) render edildikten hemen sonra tetiklenen bir callback. Burada [status code’u ayarlayabilir](#setting-the-status-code) ve streaming’i başlatmak için `pipe` çağırabilirsiniz. React, shell’den sonra ek [content’i stream eder](#streaming-more-content-as-it-loads) ve HTML loading fallback’lerini content ile değiştiren inline `<script>` tag’lerini de beraberinde gönderir.

* **optional** `onShellError`: Initial shell render edilirken bir hata oluşursa tetiklenen bir callback. Error’ı argüman olarak alır. Stream’den henüz hiç byte emit edilmemiştir ve ne `onShellReady` ne de `onAllReady` çağrılır; bu yüzden [fallback HTML shell output edebilirsiniz](#recovering-from-errors-inside-the-shell).

* **optional** `onShellError`: Initial shell render edilirken bir error oluşursa tetiklenen bir callback. Error’ı argüman olarak alır. Stream’den henüz hiç byte emit edilmemiştir ve ne `onShellReady` ne de `onAllReady` çağrılır; bu yüzden [fallback HTML shell output edebilirsiniz](#recovering-from-errors-inside-the-shell).
* **optional** `progressiveChunkSize`: Bir chunk içindeki byte sayısı. [Default heuristic hakkında daha fazla okuyun.](https://github.com/react/react/blob/14c2be8dac2d5482fda8a0906a31d239df8551fc/packages/react-server/src/ReactFizzServer.js#L210-L225)


Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -50,23 +50,14 @@ Client tarafında, server tarafından oluşturulan HTML’i interaktif hale geti
* `reactNode`: HTML’e render etmek istediğiniz bir React node. Örneğin `<App />` gibi bir JSX element’i. Bunun tüm dokümanı temsil etmesi beklenir, bu yüzden `App` component’i `<html>` etiketini render etmelidir.

* **optional** `options`: Streaming options içeren bir object.

* **optional** `bootstrapScriptContent`: Belirtilirse, bu string inline bir `<script>` tag’i içine yerleştirilir.

* **optional** `bootstrapScripts`: Sayfada emit edilecek `<script>` tag’leri için string URL’lerden oluşan bir array. [`hydrateRoot`](/reference/react-dom/client/hydrateRoot) çağıran `<script>`’i dahil etmek için bunu kullanın. Client tarafında React’i hiç çalıştırmak istemiyorsanız bunu atlayın.

* **optional** `bootstrapModules`: `bootstrapScripts` gibidir, ancak bunun yerine [`<script type="module">`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules) emit eder.

* **optional** `identifierPrefix`: React’in [`useId`](/reference/react/useId) tarafından oluşturulan ID’ler için kullandığı string prefix. Aynı sayfada birden fazla root kullanırken conflict’leri önlemek için kullanışlıdır. [`hydrateRoot`](/reference/react-dom/client/hydrateRoot#parameters)’a geçirilen prefix ile aynı olmalıdır.

* **optional** `namespaceURI`: Stream için root [namespace URI](https://developer.mozilla.org/en-US/docs/Web/API/Document/createElementNS#important_namespace_uris)’sini içeren bir string. Default olarak normal HTML’dir. SVG için `'http://www.w3.org/2000/svg'`, MathML için `'http://www.w3.org/1998/Math/MathML'` geçirin.

* **optional** `nonce`: [`script-src` Content-Security-Policy](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/script-src) için script’lere izin veren bir [`nonce`](http://developer.mozilla.org/en-US/docs/Web/HTML/Element/script#nonce) string’i.

* **optional** `onError`: [Recoverable](#recovering-from-errors-outside-the-shell) olsun ya da [olmasın](#recovering-from-errors-inside-the-shell), server error olduğunda tetiklenen bir callback. Default olarak yalnızca `console.error` çağırır. [Crash report’ları loglamak](#logging-crashes-on-the-server) için override ederseniz, yine de `console.error` çağırdığınızdan emin olun. Shell emit edilmeden önce [status code’u ayarlamak](#setting-the-status-code) için de kullanabilirsiniz.

* **optional** `progressiveChunkSize`: Bir chunk içindeki byte sayısı. [Default heuristic hakkında daha fazla okuyun.](https://github.com/react/react/blob/14c2be8dac2d5482fda8a0906a31d239df8551fc/packages/react-server/src/ReactFizzServer.js#L210-L225)

* **optional** `signal`: [Server rendering’i abort etmek](#aborting-server-rendering) ve geri kalanını client’ta render etmek için kullanabileceğiniz bir [abort signal](https://developer.mozilla.org/en-US/docs/Web/API/AbortSignal).


Expand Down
26 changes: 6 additions & 20 deletions src/content/reference/react/Suspense.md
Original file line number Diff line number Diff line change
Expand Up @@ -25,25 +25,16 @@ title: <Suspense>

#### Props {/*props*/}
* `children`: Render etmek istediğiniz gerçek UI. Eğer `children` rendering sırasında suspend olursa, Suspense boundary `fallback` render etmeye geçer.

* `fallback`: Gerçek UI henüz yüklenmeyi bitirmediyse, onun yerine render edilecek alternatif UI. Herhangi bir geçerli React node kabul edilir; ancak pratikte fallback genellikle loading spinner veya skeleton gibi hafif bir placeholder view’dur. `children` suspend olduğunda Suspense otomatik olarak `fallback`’e geçer, data hazır olduğunda tekrar `children`’a döner. Eğer `fallback` rendering sırasında suspend olursa, en yakın parent Suspense boundary’yi aktive eder.

* `fallback`: Gerçek UI henüz yüklenmeyi bitirmediyse, onun yerine render edilecek alternatif UI. Herhangi bir geçerli React node kabul edilir; ancak pratikte fallback genellikle loading spinner veya skeleton gibi hafif bir placeholder view’dur. Suspense, `children` suspend olduğunda otomatik olarak `fallback`’e geçer ve data hazır olduğunda tekrar `children`’a döner. Eğer `fallback` rendering sırasında suspend olursa, en yakın parent Suspense boundary’yi aktive eder.
* <ExperimentalBadge /> **optional** `defer`: Bir boolean. `true` olduğunda, içlerinde hiçbir şey suspend olmasa bile React önce `fallback`’i gösterebilir ve `children`’ı daha sonra render veya stream edebilir. Render edilmesi pahalı olan content için kullanın. Default değeri `false`’tur.

#### Uyarılar {/*caveats*/}

- Suspense, data’nın bir Effect veya event handler içinde fetch edildiğini detect etmez. Yalnızca [aşağıda listelenen durumlarda](#what-activates-a-suspense-boundary) aktive olur.

- React, ilk kez mount olamadan önce suspend olan render’lar için hiçbir state’i preserve etmez. Component yüklendiğinde, React suspended tree’yi sıfırdan yeniden render etmeyi dener.

- Suspense tree için content gösteriyorken tree tekrar suspend olursa, buna neden olan update [`startTransition`](/reference/react/startTransition) veya [`useDeferredValue`](/reference/react/useDeferredValue) tarafından oluşturulmadığı sürece `fallback` tekrar gösterilir.

- React, suspended content’i son reveal’dan itibaren ölçülen en fazla 300ms’de bir reveal eder. Bu pencere içinde ready olan boundary’ler tek tek değil, [birlikte reveal edilir](/blog/2025/10/01/react-19-2#batching-suspense-boundaries-for-ssr).

- React, tekrar suspend olduğu için zaten visible olan content’i hide etmek zorunda kalırsa, content tree içindeki [layout Effects](/reference/react/useLayoutEffect)’leri cleanup eder. Content tekrar gösterilmeye hazır olduğunda, React layout Effects’i tekrar çalıştırır. Bu, DOM layout’unu ölçen Effects’in content hidden durumdayken bunu yapmaya çalışmamasını sağlar.

- React, Suspense ile entegre olan **Streaming Server Rendering** ve **Selective Hydration** gibi under-the-hood optimizasyonlar içerir. Daha fazla bilgi edinmek için [mimari overview](https://github.com/reactwg/react-18/discussions/37) okuyun ve [teknik konuşmayı](https://www.youtube.com/watch?v=pj5N-Khihgc) izleyin.

- React, Suspense ile entegre olan **Streaming Server Rendering** ve **Selective Hydration** gibi under-the-hood optimizasyonlar içerir. Daha fazla bilgi edinmek için [mimari overview](https://github.com/reactwg/react-18/discussions/37) okuyun ve [teknik konuşmayı](https://www.youtube.com/watch?v=pj5N-Khihgc) izleyin.

---
Expand All @@ -53,26 +44,21 @@ title: <Suspense>
Bir Suspense boundary, content’ini reveal etmeden önce onun hazır olmasını bekler. Aşağıdakilerden herhangi biri, bir boundary’nin content’ini reveal etmesini engeller:

- [`lazy`](/reference/react/lazy) ile component code’unu lazy-load etmek.

- [Server Components](/reference/rsc/server-components)’tan stream edilen veya [Suspense-enabled framework](#suspense-enabled-frameworks) üzerinden yüklenen data dahil olmak üzere, [`use`](/reference/react/use) ile bir Promise okumak.

- [`<link rel="stylesheet">` ve bir `precedence` prop’u](/reference/react-dom/components/link#special-rendering-behavior) ile render edilen bir stylesheet’i yüklemek. React, stylesheet yüklenene kadar, bir timeout’a kadar boundary’yi block eder. [Aşağıdaki örneğe bakın.](#waiting-for-a-stylesheet-to-load)

- Streaming server rendering sırasında büyük bir boundary’nin HTML’inin gelmesini beklemek. HTML göndermek zaman alır; bu yüzden yeterince content içeren bir boundary, içinde hiçbir şey suspend olmasa bile aktive olur. React, HTML geldikçe content’i reveal eder.

- <CanaryBadge /> Font yüklemek. Suspense default olarak font’ları beklemez, ancak bir [`<ViewTransition>`](/reference/react/ViewTransition) update’i, text’in fallback font ile flash etmemesi için yeni font’ların yüklenmesini bir timeout’a kadar bekler. [Aşağıdaki örneğe bakın.](#waiting-for-a-font-to-load)

- <CanaryBadge /> Image yüklemek. Suspense default olarak image’ları beklemez, ancak bir [`<ViewTransition>`](/reference/react/ViewTransition) update’i sırasında React, image yüklenene kadar, bir timeout’a kadar boundary’yi block eder. `onLoad` handler eklemek belirli bir image’ı bu davranışın dışına çıkarır. [Aşağıdaki örneğe bakın.](#waiting-for-an-image-to-load)

- <ExperimentalBadge /> Bir [`<Suspense defer>`](#props) boundary’si içinde CPU-bound render work gerçekleştirmek.

<Note>

#### Suspense-enabled framework’ler {/*suspense-enabled-frameworks*/}
#### Suspense-enabled frameworks {/*suspense-enabled-frameworks*/}

Bir **Suspense-enabled framework**, component’inizde data’yı en yakın Suspense boundary’yi aktive edecek şekilde okumanız için bir yol sağlar. Data’nızı tam olarak nasıl load edeceğiniz framework’ünüze bağlıdır ve detayları onun documentation’ında bulursunuz. Under the hood, Suspense-enabled bir framework Promise’lerden oluşan bir cache tutar ve bir Promise üzerinde suspend olmak için [`use`](/reference/react/use) çağırır.
A *Suspense-enabled framework* gives you a way to read data in your component in a way that activates the closest Suspense boundary. The exact way you load your data depends on your framework, and you'll find the details in its documentation. Under the hood, a Suspense-enabled framework maintains a cache of Promises and calls [`use`](/reference/react/use) to suspend on a Promise.

Framework olmadan, Promise [render’lar arasında aynı instance yeniden kullanılacak şekilde cache’lendiği](/reference/react/use#caching-promises-for-client-components) sürece doğrudan `use` ile bir Promise okuyabilirsiniz.
Without a framework, you can read a Promise with `use` directly, as long as the Promise is [cached so the same instance is reused across renders.](/reference/react/use#caching-promises-for-client-components)

</Note>

Expand Down Expand Up @@ -245,7 +231,7 @@ async function getAlbums() {

</Sandpack>

Buna karşılık, bir Effect içinde olduğu gibi `use` dışında data fetch eden code, boundary’yi aktive etmez:
By contrast, code that fetches data outside of `use`, such as inside an Effect, does not activate the boundary:

<Sandpack>

Expand Down Expand Up @@ -2386,7 +2372,7 @@ Sunucu HTML'i yükleniyor çarkını içerecektir. İstemci tarafında yükleniy

---

### Waiting for a stylesheet to load {/*waiting-for-a-stylesheet-to-load*/}
### Stylesheet’in yüklenmesini bekleme {/*waiting-for-a-stylesheet-to-load*/}

[`<link rel="stylesheet">` ve bir `precedence` prop’u](/reference/react-dom/components/link#special-rendering-behavior) ile render edilen bir stylesheet, content’in unstyled görünmemesi için stylesheet yüklenene kadar, bir timeout’a kadar Suspense boundary’yi block eder.

Expand Down
Loading
Loading