Skip to content

Commit 6476205

Browse files
authored
Merge pull request #250 from moshfiqrony/main
Fix conflict and build
2 parents 7136c11 + 7315ca3 commit 6476205

File tree

3 files changed

+8
-29
lines changed

3 files changed

+8
-29
lines changed

src/content/learn/synchronizing-with-effects.md

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -730,14 +730,9 @@ Effect এ `fetch` কল লেখা [ডেটা ফেচিংয়ের
730730
- **মূলত Effect এ সরাসরি ডেটা ফেচ করার মানে এই যে, আপনি ডেটা প্রিলোড বা ক্যাশ করতে পারবেন না।** উদাহরণস্বরূপ, যদি কম্পোনেন্টটি আনমাউন্ট হয় এবং পুনরায় মাউন্ট হয়, এটিকে পুনরায় ডাটা ফেচ করতে হবে।
731731
- **এটা খুব একটা ergonomic নয়।** ফেচ কল লেখার সময়, যাতে [রেস কন্ডিশন](https://maxrozen.com/race-conditions-fetching-data-react-with-useeffect) এর মতো বাগে suffer করতে না হয়, তার জন্য বেশ ভালো পরিমাণের বয়লারপ্লেট কোড লেখা লাগে।
732732
733-
<<<<<<< HEAD
734733
ডাউনসাইডের এই তালিকাটি React জন্য নির্দিষ্ট নয়। এটি যে কোনো লাইব্রেরির মাধ্যমে মাউন্টের সময় ডেটা ফেচের ক্ষেত্রে প্রযোজ্য। রাউটিংয়ের মতো, ডেটা ফেচিং ভালোভাবে করা সহজ নয়, তাই আমরা নিম্নলিখিত পদ্ধতির পরামর্শ দিই:
735-
=======
736-
- **If you use a [framework](/learn/creating-a-react-app#full-stack-frameworks), use its built-in data fetching mechanism.** Modern React frameworks have integrated data fetching mechanisms that are efficient and don't suffer from the above pitfalls.
737-
- **Otherwise, consider using or building a client-side cache.** Popular open source solutions include [TanStack Query](https://tanstack.com/query/latest), [useSWR](https://swr.vercel.app/), and [React Router 6.4+.](https://beta.reactrouter.com/en/main/start/overview) You can build your own solution too, in which case you would use Effects under the hood, but add logic for deduplicating requests, caching responses, and avoiding network waterfalls (by preloading data or hoisting data requirements to routes).
738-
>>>>>>> 1207ee36e1c7e3f2737d8f1022015473ffa99adf
739734
740-
- **আপনি যদি একটি [framework](/learn/start-a-new-react-project#full-stack-frameworks) ব্যবহার করেন, তার built-in ডেটা ফেচিং প্রক্রিয়া ব্যবহার করুন।** আধুনিক রিয়্যাক্ট ফ্রেমওয়ার্কগুলির মধ্যে integrated ডেটা ফেচিং প্রক্রিয়া রয়েছে যা কার্যকর এবং উপরের সমস্যা গুলো মুক্ত।
735+
- **আপনি যদি একটি [framework](/learn/creating-a-react-app#full-stack-frameworks) ব্যবহার করেন, তার built-in ডেটা ফেচিং প্রক্রিয়া ব্যবহার করুন।** আধুনিক রিয়্যাক্ট ফ্রেমওয়ার্কগুলির মধ্যে integrated ডেটা ফেচিং প্রক্রিয়া রয়েছে যা কার্যকর এবং উপরের সমস্যা গুলো মুক্ত।
741736
- **অন্যথায়, একটি ক্লায়েন্ট-সাইড ক্যাশ ইউজ করুন বা বিল্ড করুন।** জনপ্রিয় ওপেন সোর্স সমাধানের মধ্যে [React Query](https://tanstack.com/query/latest), [useSWR](https://swr.vercel.app/), এবং [React Router 6.4+.](https://beta.reactrouter.com/en/main/start/overview) রয়েছে। আপনি একটি নিজস্ব সমাধানো তৈরি করতে পারেন এই ক্ষেত্রে আপনি Effect গুলো আন্ডার দ্যা হুডে ব্যবহার করতে পারেন, তবে request ডিডুপ্লিকেট করাতে, response ক্যাশ করতে, এবং নেটওয়ার্ক ওয়াটারফল এড়াতে লজিক add করুন। (ডাটা প্রিলোডিং করে বা ডাটা requirement গুলো রাউটে hoisting করে)।
742737
743738
যদি এই পদক্ষেপগুলোর মধ্যে কোনটিই আপনার জন্য প্রযোজ্য না হয়, তবে সরাসরি Effect-এ ডেটা ফেচিং চালিয়ে যেতে পারেন।"

src/content/reference/react-dom/server/index.md

Lines changed: 3 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -8,16 +8,6 @@ title: Server React DOM API
88

99
</Intro>
1010

11-
---
12-
13-
## Node.js Stream জন্য Server API {/*server-apis-for-nodejs-streams*/}
14-
15-
[Node.js Streams](https://nodejs.org/api/stream.html) সহ এনভায়রনমেন্ট গুলোতে কেবল এই মেথডগুলো পাওয়া যাবেঃ
16-
17-
* [`renderToPipeableStream`](/reference/react-dom/server/renderToPipeableStream) একটা React ট্রি কে একটা pipeable [Node.js Stream](https://nodejs.org/api/stream.html) এ রেন্ডার করে।
18-
19-
---
20-
2111
## Web Stream এর জন্য Server APIs {/*server-apis-for-web-streams*/}
2212

2313
[Web Stream](https://developer.mozilla.org/en-US/docs/Web/API/Streams_API) সহ এনভায়রনমেন্ট গুলোতে (যার মধ্যে রয়েছে ব্রাউজার, Deno এবং কিছু আধুনিক Edge runtime) কেবল এই মেথডগুলো পাওয়া যাবেঃ
@@ -33,11 +23,11 @@ Node.js also includes these methods for compatibility, but they are not recommen
3323
</Note>
3424
---
3525

36-
## Server APIs for Node.js Streams {/*server-apis-for-nodejs-streams*/}
26+
## Node.js Stream জন্য Server API {/*server-apis-for-nodejs-streams*/}
3727

38-
These methods are only available in the environments with [Node.js Streams:](https://nodejs.org/api/stream.html)
28+
[Node.js Streams](https://nodejs.org/api/stream.html) সহ এনভায়রনমেন্ট গুলোতে কেবল এই মেথডগুলো পাওয়া যাবেঃ
3929

40-
* [`renderToPipeableStream`](/reference/react-dom/server/renderToPipeableStream) renders a React tree to a pipeable [Node.js Stream.](https://nodejs.org/api/stream.html)
30+
* [`renderToPipeableStream`](/reference/react-dom/server/renderToPipeableStream) একটা React ট্রি কে একটা pipeable [Node.js Stream](https://nodejs.org/api/stream.html) এ রেন্ডার করে।
4131
* [`resumeToPipeableStream`](/reference/react-dom/server/renderToPipeableStream) resumes [`prerenderToNodeStream`](/reference/react-dom/static/prerenderToNodeStream) to a pipeable [Node.js Stream.](https://nodejs.org/api/stream.html)
4232

4333
---

src/content/reference/react/useTransition.md

Lines changed: 4 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -95,11 +95,7 @@ function SubmitButton({ submitAction }) {
9595

9696
#### প্যারামিটারসমূহ {/*starttransition-parameters*/}
9797

98-
<<<<<<< HEAD
99-
* `action`: একটি ফাংশন যা এক বা একাধিক [`set` ফাংশন](/reference/react/useState#setstate) কল করে কিছু state আপডেট করে। React `action` কে কোনো প্যারামিটার ছাড়াই তাৎক্ষণিকভাবে কল করে এবং `action` ফাংশন কলের সময় সিনক্রোনাসভাবে নির্ধারিত সব state আপডেটকে ট্রানজিশন হিসাবে চিহ্নিত করে। `action` এ যে কোনো অ্যাসিনক কলকে await করা হলে তা ট্রানজিশনে অন্তর্ভুক্ত হবে, তবে বর্তমানে `await` এর পরে যেকোনো `set` ফাংশনকে একটি অতিরিক্ত `startTransition` এ মোড়ানোর প্রয়োজন ([সমস্যা সমাধান](#react-doesnt-treat-my-state-update-after-await-as-a-transition) দেখুন)। ট্রানজিশন হিসাবে চিহ্নিত state আপডেটগুলি [নন-ব্লকিং](#marking-a-state-update-as-a-non-blocking-transition) হবে এবং [অনাকাঙ্ক্ষিত লোডিং ইন্ডিকেটর প্রদর্শন করবে না।](#preventing-unwanted-loading-indicators)
100-
=======
101-
* `action`: A function that updates some state by calling one or more [`set` functions](/reference/react/useState#setstate). React calls `action` immediately with no parameters and marks all state updates scheduled synchronously during the `action` function call as Transitions. Any async calls that are awaited in the `action` will be included in the Transition, but currently require wrapping any `set` functions after the `await` in an additional `startTransition` (see [Troubleshooting](#react-doesnt-treat-my-state-update-after-await-as-a-transition)). State updates marked as Transitions will be [non-blocking](#perform-non-blocking-updates-with-actions) and [will not display unwanted loading indicators](#preventing-unwanted-loading-indicators).
102-
>>>>>>> 1207ee36e1c7e3f2737d8f1022015473ffa99adf
98+
* `action`: একটি ফাংশন যা এক বা একাধিক [`set` ফাংশন](/reference/react/useState#setstate) কল করে কিছু state আপডেট করে। React `action` কে কোনো প্যারামিটার ছাড়াই তাৎক্ষণিকভাবে কল করে এবং `action` ফাংশন কলের সময় সিনক্রোনাসভাবে নির্ধারিত সব state আপডেটকে ট্রানজিশন হিসাবে চিহ্নিত করে। `action` এ যে কোনো অ্যাসিনক কলকে await করা হলে তা ট্রানজিশনে অন্তর্ভুক্ত হবে, তবে বর্তমানে `await` এর পরে যেকোনো `set` ফাংশনকে একটি অতিরিক্ত `startTransition` এ মোড়ানোর প্রয়োজন ([সমস্যা সমাধান](#react-doesnt-treat-my-state-update-after-await-as-a-transition) দেখুন)। ট্রানজিশন হিসাবে চিহ্নিত state আপডেটগুলি [নন-ব্লকিং](#perform-non-blocking-updates-with-actions) হবে এবং [অনাকাঙ্ক্ষিত লোডিং ইন্ডিকেটর প্রদর্শন করবে না।](#preventing-unwanted-loading-indicators)
10399

104100
#### রিটার্নস {/*starttransition-returns*/}
105101

@@ -165,11 +161,9 @@ function CheckoutForm() {
165161
}
166162
```
167163

168-
<<<<<<< HEAD
169-
`startTransition` এ পাস করা ফাংশনটিকে "Action" বলা হয়। আপনি একটি Action এর মধ্যে state আপডেট করতে এবং (ঐচ্ছিকভাবে) side effects সম্পাদন করতে পারেন, এবং পৃষ্ঠায় ব্যবহারকারীর ইন্টারঅ্যাকশনগুলি ব্লক না করে এই কাজটি ব্যাকগ্রাউন্ডে করা হবে। একটি Transition একাধিক Actions অন্তর্ভুক্ত করতে পারে, এবং যখন একটি Transition চলমান থাকে, আপনার UI রেস্পন্সিভ থাকে। উদাহরণস্বরূপ, যদি ব্যবহারকারী একটি ট্যাবে ক্লিক করে কিন্তু তারপর তাদের মন পরিবর্তন করে এবং অন্য ট্যাবে ক্লিক করে, তাহলে প্রথম আপডেট শেষ হওয়ার জন্য অপেক্ষা না করে দ্বিতীয় ক্লিকটি তাৎক্ষণিকভাবে পরিচালনা করা হবে।
170-
=======
171-
The function passed to `startTransition` is called the "Action". You can update state and (optionally) perform side effects within an Action, and the work will be done in the background without blocking user interactions on the page. A Transition can include multiple Actions, and while a Transition is in progress, your UI stays responsive. For example, if the user clicks a tab but then changes their mind and clicks another tab, the second click will be immediately handled without waiting for the first update to finish.
172-
>>>>>>> 1207ee36e1c7e3f2737d8f1022015473ffa99adf
164+
startTransition-এ যে ফাংশনটি পাস করা হয়, তাকে "অ্যাকশন" (Action) বলা হয়। আপনি একটি অ্যাকশনের মধ্যে স্টেট (state) আপডেট করতে পারেন এবং (ঐচ্ছিকভবে) সাইড ইফেক্ট (side effects) সম্পন্ন করতে পারেন। এই কাজগুলো ব্যাকগ্রাউন্ডে সম্পন্ন হবে, ফলে পেজে ইউজারের ইন্টারঅ্যাকশন বা চলাফেরায় কোনো বাধা সৃষ্টি হবে না।
165+
166+
একটি ট্রানজিশনের (Transition) মধ্যে একাধিক অ্যাকশন থাকতে পারে এবং ট্রানজিশন চলাকালীন আপনার ইউজার ইন্টারফেস (UI) সবসময় রেসপনসিভ থাকে। উদাহরণস্বরূপ, যদি একজন ইউজার একটি ট্যাবে ক্লিক করার পর সিদ্ধান্ত পরিবর্তন করে অন্য একটি ট্যাবে ক্লিক করেন, তবে প্রথম আপডেটটি শেষ হওয়ার অপেক্ষা না করেই দ্বিতীয় ক্লিকটি তাৎক্ষণিকভাবে কার্যকর হবে।
173167

174168
চলমান Transitions সম্পর্কে ব্যবহারকারীকে ফিডব্যাক দিতে, `isPending` state `startTransition` এর প্রথম কল এ `true` হয়ে যায়, এবং সমস্ত Actions সম্পূর্ণ হওয়া এবং চূড়ান্ত state ব্যবহারকারীকে দেখানো পর্যন্ত `true` থাকে। Transitions [অবাঞ্ছিত লোডিং ইন্ডিকেটর প্রতিরোধ করতে](#preventing-unwanted-loading-indicators) Actions এর side effects ক্রমানুসারে সম্পূর্ণ করা নিশ্চিত করে, এবং আপনি `useOptimistic` দিয়ে Transition চলাকালীন তাৎক্ষণিক ফিডব্যাক প্রদান করতে পারেন।
175169

0 commit comments

Comments
 (0)