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
2 changes: 1 addition & 1 deletion src/content/learn/start-a-new-react-project.md
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ title: নতুন প্রোজেক্ট শুরু করুন
npx create-next-app@latest
</TerminalBlock>

আপনি যদি Next.js এ নতুন হয়ে থাকেন তাহলে তাদের অফিসিয়াল [Next.js tutorial](https://nextjs.org/learn/foundations/about-nextjs) দেখতে পারেন
আপনি যদি Next.js এ নতুন হয়ে থাকেন তাহলে [learn Next.js course](https://nextjs.org/learn)-টা দেখে ফেলুন

Next.js এর রক্ষণাবেক্ষণের কাজ করে থাকে [Vercel](https://vercel.com/)। যেকোনো Node.js অথবা serverless হোস্টিং, অথবা আপনার নিজস্ব সার্ভারে [একটি Next.js অ্যাপ deploy](https://nextjs.org/docs/deployment) করতে পারবেন। Next.js সম্পূর্ণ [স্ট্যাটিক এক্সপোর্ট](https://nextjs.org/docs/pages/building-your-application/deploying/static-exports) সাপোর্ট করে যার কোন সার্ভারের প্রয়োজন নেই।

Expand Down
3 changes: 3 additions & 0 deletions src/content/reference/react-dom/server/renderToNodeStream.md
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,9 @@ stream.pipe(response);

* `reactNode`: একটা React নোড যেটা আপনি HTML এ রেন্ডার করতে চান। উদাহরণস্বরূপ, `<App />` এর মত একটি JSX এলিমেন্ট।

* **optional** `options`: সার্ভার রেন্ডারের জন্য একটি অবজেক্ট।
* **optional** `identifierPrefix`: [`useId`](/reference/react/useId) দিয়ে বানানো ID এর জন্য React যে স্ট্রিং প্রিফিক্স ব্যবহার করে। একই পেইজে একাধিক রুট ব্যবহার করলে কনফ্লিক্ট এড়াতে এটা কাজে লাগে। এটা আর [`hydrateRoot`](/reference/react-dom/client/hydrateRoot#parameters) এ pass করা প্রিফিক্স একই হতে হবে।

#### রিটার্ন {/*returns*/}

একটা [Node.js Readable Stream](https://nodejs.org/api/stream.html#readable-streams) যা একটি HTML স্ট্রিং আউটপুট হিসেবে দেয়।
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,8 @@ const html = renderToStaticMarkup(<Page />);
#### প্যারামিটার {/*parameters*/}

* `reactNode`: একটা React নোড যা আপনি HTML এ রেন্ডার করতে চান। উদাহরণস্বরূপ, `<Page />` এর মত একটি JSX নোড।
* **optional** `options`: সার্ভার রেন্ডারের জন্য একটি অবজেক্ট।
* **optional** `identifierPrefix`: [`useId`](/reference/react/useId) দিয়ে বানানো ID এর জন্য React যে স্ট্রিং প্রিফিক্স ব্যবহার করে। একই পেইজে একাধিক রুট ব্যবহার করলে কনফ্লিক্ট এড়াতে এটা কাজে লাগে।

#### রিটার্ন {/*returns*/}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,9 @@ stream.pipe(response);

* `reactNode`: একটা React নোড যেটা আপনি HTML এ রেন্ডার করতে চান। যেমন `<Page />` এর মত একটি JSX এলিমেন্ট।

* **optional** `options`: সার্ভার রেন্ডারের জন্য একটি অবজেক্ট।
* **optional** `identifierPrefix`: [`useId`](/reference/react/useId) দিয়ে বানানো ID এর জন্য React যে স্ট্রিং প্রিফিক্স ব্যবহার করে। একই পেইজে একাধিক রুট ব্যবহার করলে কনফ্লিক্ট এড়াতে এটা কাজে লাগে।

#### রিটার্ন {/*returns*/}

একটা [Node.js Readable Stream](https://nodejs.org/api/stream.html#readable-streams) যেটা একটা HTML স্ট্রিং আউটপুট দেয়। ফলাফলে যে HTML পাওয়া যায় সেটা ক্লায়েন্টে hydrate করা যায় না।
Expand Down
3 changes: 3 additions & 0 deletions src/content/reference/react-dom/server/renderToString.md
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,9 @@ On the client, call [`hydrateRoot`](/reference/react-dom/client/hydrateRoot) to

* `reactNode`: A React node you want to render to HTML. For example, a JSX node like `<App />`.

* **optional** `options`: An object for server render.
* **optional** `identifierPrefix`: A string prefix React uses for IDs generated by [`useId`.](/reference/react/useId) Useful to avoid conflicts when using multiple roots on the same page. Must be the same prefix as passed to [`hydrateRoot`.](/reference/react-dom/client/hydrateRoot#parameters)

#### Returns {/*returns*/}

An HTML string.
Expand Down
30 changes: 30 additions & 0 deletions src/content/reference/react/useId.md
Original file line number Diff line number Diff line change
Expand Up @@ -302,3 +302,33 @@ input { margin: 5px; }
```

</Sandpack>

---

### Using the same ID prefix on the client and the server {/*using-the-same-id-prefix-on-the-client-and-the-server*/}

If you [render multiple independent React apps on the same page](#specifying-a-shared-prefix-for-all-generated-ids), and some of these apps are server-rendered, make sure that the `identifierPrefix` you pass to the [`hydrateRoot`](/reference/react-dom/client/hydrateRoot) call on the client side is the same as the `identifierPrefix` you pass to the [server APIs](/reference/react-dom/server) such as [`renderToPipeableStream`.](/reference/react-dom/server/renderToPipeableStream)

```js
// Server
import { renderToPipeableStream } from 'react-dom/server';

const { pipe } = renderToPipeableStream(
<App />,
{ identifierPrefix: 'react-app1' }
);
```

```js
// Client
import { hydrateRoot } from 'react-dom/client';

const domNode = document.getElementById('root');
const root = hydrateRoot(
domNode,
reactNode,
{ identifierPrefix: 'react-app1' }
);
```

You do not need to pass `identifierPrefix` if you only have one React app on the page.