diff --git a/src/content/blog/2023/03/16/introducing-react-dev.md b/src/content/blog/2023/03/16/introducing-react-dev.md
index d27673d90..d2e11fded 100644
--- a/src/content/blog/2023/03/16/introducing-react-dev.md
+++ b/src/content/blog/2023/03/16/introducing-react-dev.md
@@ -428,7 +428,7 @@ export default function PackingList() {
Note that you must write `importance > 0 && ...` rather than `importance && ...` so that if the `importance` is `0`, `0` isn't rendered as the result!
-In this solution, two separate conditions are used to insert a space between then name and the importance label. Alternatively, you could use a fragment with a leading space: `importance > 0 && <> ...` or add a space immediately inside the ``: `importance > 0 && ...`.
+In this solution, two separate conditions are used to insert a space between then name and the importance label. Alternatively, you could use a Fragment with a leading space: `importance > 0 && <> ...` or add a space immediately inside the ``: `importance > 0 && ...`.
@@ -643,4 +643,3 @@ On the development front, thanks to [Jared Palmer](https://twitter.com/jaredpalm
Huge thanks to the folks who volunteered their time to participate in the alpha and beta testing program. Your enthusiasm and invaluable feedback helped us shape these docs. A special shout out to our beta tester, [Debbie O'Brien](https://twitter.com/debs_obrien), who gave a talk about her experience using the React docs at React Conf 2021.
Finally, thanks to the React community for being the inspiration behind this effort. You are the reason we do this, and we hope that the new docs will help you use React to build any user interface that you want.
-
diff --git a/src/content/community/versioning-policy.md b/src/content/community/versioning-policy.md
index 68d5b8eb1..eb38f8c29 100644
--- a/src/content/community/versioning-policy.md
+++ b/src/content/community/versioning-policy.md
@@ -46,7 +46,7 @@ In general, we *don't* bump the major version number for changes to:
* **Development warnings.** Since these don't affect production behavior, we may add new warnings or modify existing warnings in between major versions. In fact, this is what allows us to reliably warn about upcoming breaking changes.
* **APIs starting with `unstable_`.** These are provided as experimental features whose APIs we are not yet confident in. By releasing these with an `unstable_` prefix, we can iterate faster and get to a stable API sooner.
-* **Alpha and canary versions of React.** We provide alpha versions of React as a way to test new features early, but we need the flexibility to make changes based on what we learn in the alpha period. If you use these versions, note that APIs may change before the stable release.
+* **Alpha and Canary versions of React.** We provide alpha versions of React as a way to test new features early, but we need the flexibility to make changes based on what we learn in the alpha period. If you use these versions, note that APIs may change before the stable release.
* **Undocumented APIs and internal data structures.** If you access internal property names like `__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED` or `__reactInternalInstance$uk43rzhitjg`, there is no warranty. You are on your own.
This policy is designed to be pragmatic: certainly, we don't want to cause headaches for you. If we bumped the major version for all of these changes, we would end up releasing more major versions and ultimately causing more versioning pain for the community. It would also mean that we can't make progress in improving React as fast as we'd like.
diff --git a/src/content/learn/conditional-rendering.md b/src/content/learn/conditional-rendering.md
index ce025c057..583873cc0 100644
--- a/src/content/learn/conditional-rendering.md
+++ b/src/content/learn/conditional-rendering.md
@@ -626,7 +626,11 @@ export default function PackingList() {
要注意的是你必須寫成 `importance > 0 && ...` 而不是 `importance && ...` ，這樣如果 `importance` 的值為 `0` 時，才不會把 `0` 做為結果 render 出來。
+<<<<<<< HEAD
解答中為了在 name 和 importance 標籤之間插入一個空格，使用了兩段不同的條件。你也可以使用帶有空格前綴的 fragment： `importance > 0 && <> ...`，或是直接在 `` 內部增加一個空格： `importance > 0 && ...`。
+=======
+In this solution, two separate conditions are used to insert a space between the name and the importance label. Alternatively, you could use a Fragment with a leading space: `importance > 0 && <> ...` or add a space immediately inside the ``: `importance > 0 && ...`.
+>>>>>>> af54fc873819892f6050340df236f33a18ba5fb8
diff --git a/src/content/learn/describing-the-ui.md b/src/content/learn/describing-the-ui.md
index f5c936b6e..3fc65ed34 100644
--- a/src/content/learn/describing-the-ui.md
+++ b/src/content/learn/describing-the-ui.md
@@ -538,12 +538,27 @@ React 使用 tree 來建模 component 和 module 之間的關係。
React render tree 是 component 之間父子關係的表示。
+<<<<<<< HEAD
+=======
+
+An example React render tree.
+
+
+>>>>>>> af54fc873819892f6050340df236f33a18ba5fb8
一個 React render tree 範例。
+<<<<<<< HEAD
靠近 tree 頂部、靠近 root component 的 component 被視為 top-level component。沒有 child component 的 component 是 leaf component。這種 component 分類對於理解 data flow 和 rendering 效能很有用。
+=======
+
+
+An example module dependency tree.
+
+
+>>>>>>> af54fc873819892f6050340df236f33a18ba5fb8
對 JavaScript module 之間的關係進行建模是了解應用程式的另一種有用方法。 我們稱之為 module dependency tree。
diff --git a/src/content/learn/rendering-lists.md b/src/content/learn/rendering-lists.md
index 2260ee0be..416429c66 100644
--- a/src/content/learn/rendering-lists.md
+++ b/src/content/learn/rendering-lists.md
@@ -1145,7 +1145,11 @@ hr {
+<<<<<<< HEAD
你可以嘗試把原本的 `map` 改成手動循環，或著嘗試使用 fragment 語法。
+=======
+You'll either need to convert `map` to a manual loop, or use a Fragment.
+>>>>>>> af54fc873819892f6050340df236f33a18ba5fb8
@@ -1208,7 +1212,11 @@ hr {
原本使用詩句索引值作為 `key` 的方法已經行不通了，因爲現在 array 裡同時包含了分隔線和詩句。但是，你可以用加入後綴的方式給它們賦予獨一無二的 `key` 值，像是 `key={i + '-text'}` 這樣。
+<<<<<<< HEAD
或著，你可以生產一個 fragment 包含 `` 和 `
...
`，但因為 fragment 簡寫 `<>...` 不支援設定 `key`，所以你需要寫成 `` 形式。
+=======
+Alternatively, you could render a collection of Fragments which contain `` and `
...
`. However, the `<>...` shorthand syntax doesn't support passing keys, so you'd have to write `` explicitly:
+>>>>>>> af54fc873819892f6050340df236f33a18ba5fb8
@@ -1254,7 +1262,11 @@ hr {
+<<<<<<< HEAD
記住，使用 fragment 語法 (通常寫作 `<> `) 來包覆 JSX nodes 可避免引入額外的 `div`！
+=======
+Remember, Fragments (often written as `<> `) let you group JSX nodes without adding extra `
`s!
+>>>>>>> af54fc873819892f6050340df236f33a18ba5fb8
diff --git a/src/content/learn/start-a-new-react-project.md b/src/content/learn/start-a-new-react-project.md
index 79c4ecebb..41aeed1d8 100644
--- a/src/content/learn/start-a-new-react-project.md
+++ b/src/content/learn/start-a-new-react-project.md
@@ -24,7 +24,11 @@ title: 開始一個新的 React 專案
npx create-next-app@latest
+<<<<<<< HEAD
如果你是第一次使用 Next.js，請參考 [Next.js 教學](https://nextjs.org/learn/foundations/about-nextjs)。
+=======
+If you're new to Next.js, check out the [learn Next.js course.](https://nextjs.org/learn)
+>>>>>>> af54fc873819892f6050340df236f33a18ba5fb8
Next.js 是由 [Vercel](https://vercel.com/) 維護。你可以將 [Next.js 應用程式部署](https://nextjs.org/docs/app/building-your-application/deploying)到任何 Node.js 或 serverless 主機，或是你自己的伺服器上。Next.js 也支援 [static export](https://nextjs.org/docs/pages/building-your-application/deploying/static-exports)，它不需要伺服器。
diff --git a/src/content/learn/tutorial-tic-tac-toe.md b/src/content/learn/tutorial-tic-tac-toe.md
index eca388a88..b40a90572 100644
--- a/src/content/learn/tutorial-tic-tac-toe.md
+++ b/src/content/learn/tutorial-tic-tac-toe.md
@@ -362,11 +362,11 @@ You'll get this error:
-/src/App.js: Adjacent JSX elements must be wrapped in an enclosing tag. Did you want a JSX fragment `<>...`?
+/src/App.js: Adjacent JSX elements must be wrapped in an enclosing tag. Did you want a JSX Fragment `<>...`?
-React components need to return a single JSX element and not multiple adjacent JSX elements like two buttons. To fix this you can use *fragments* (`<>` and ``) to wrap multiple adjacent JSX elements like this:
+React components need to return a single JSX element and not multiple adjacent JSX elements like two buttons. To fix this you can use *Fragments* (`<>` and ``) to wrap multiple adjacent JSX elements like this:
```js {3-6}
export default function Square() {
diff --git a/src/content/reference/react-dom/components/input.md b/src/content/reference/react-dom/components/input.md
index 7328fddc9..3d86d744f 100644
--- a/src/content/reference/react-dom/components/input.md
+++ b/src/content/reference/react-dom/components/input.md
@@ -34,7 +34,11 @@ To display an input, render the [built-in browser ``](https://developer.m
+<<<<<<< HEAD
React's extensions to the `formAction` prop are currently only available in React's canary and experimental channels. In stable releases of React `formAction` works only as a [built-in browser HTML component](https://react.dev/reference/react-dom/components#all-html-components). Learn more about [React's release channels here](/community/versioning-policy#all-release-channels).
+=======
+React's extensions to the `formAction` prop are currently only available in React's Canary and experimental channels. In stable releases of React `formAction` works only as a [built-in browser HTML component](https://react.dev/reference/react-dom/components#all-html-components). Learn more about [React's release channels here](/community/versioning-policy#all-release-channels).
+>>>>>>> af54fc873819892f6050340df236f33a18ba5fb8
[`formAction`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#formaction): A string or function. Overrides the parent `
+=======
+export default function App() {
+ return (
+
+ );
+>>>>>>> af54fc873819892f6050340df236f33a18ba5fb8
}
```
diff --git a/src/content/reference/react/use.md b/src/content/reference/react/use.md
index b726e67db..bb2fb6d5d 100644
--- a/src/content/reference/react/use.md
+++ b/src/content/reference/react/use.md
@@ -5,7 +5,7 @@ canary: true
-The `use` Hook is currently only available in React's canary and experimental channels. Learn more about [React's release channels here](/community/versioning-policy#all-release-channels).
+The `use` Hook is currently only available in React's Canary and experimental channels. Learn more about [React's release channels here](/community/versioning-policy#all-release-channels).
diff --git a/src/content/reference/react/useId.md b/src/content/reference/react/useId.md
index 96a5e25a2..3f315b053 100644
--- a/src/content/reference/react/useId.md
+++ b/src/content/reference/react/useId.md
@@ -302,3 +302,36 @@ input { margin: 5px; }
```
+<<<<<<< HEAD
+=======
+
+---
+
+### 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(
+ ,
+ { 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.
+>>>>>>> af54fc873819892f6050340df236f33a18ba5fb8
diff --git a/src/content/reference/react/useOptimistic.md b/src/content/reference/react/useOptimistic.md
index 47593a0ae..24a536cd4 100644
--- a/src/content/reference/react/useOptimistic.md
+++ b/src/content/reference/react/useOptimistic.md
@@ -5,7 +5,11 @@ canary: true
+<<<<<<< HEAD
The `useOptimistic` Hook is currently only available in React's canary and experimental channels. Learn more about [React's release channels here](/community/versioning-policy#all-release-channels).
+=======
+The `useOptimistic` Hook is currently only available in React's Canary and experimental channels. Learn more about [React's release channels here](/community/versioning-policy#all-release-channels).
+>>>>>>> af54fc873819892f6050340df236f33a18ba5fb8
@@ -27,7 +31,11 @@ The `useOptimistic` Hook is currently only available in React's canary and exper
### `useOptimistic(state, updateFn)` {/*use*/}
+<<<<<<< HEAD
`useOptimistic` is a React hook that lets you show a different state while an async action is underway. It accepts some state as an argument and returns a copy of that state that can be different during the duration of an async action such as a network request. You provide a function that takes the current state and the input to the action, and returns the optimistic state to be used while the action is pending.
+=======
+`useOptimistic` is a React Hook that lets you show a different state while an async action is underway. It accepts some state as an argument and returns a copy of that state that can be different during the duration of an async action such as a network request. You provide a function that takes the current state and the input to the action, and returns the optimistic state to be used while the action is pending.
+>>>>>>> af54fc873819892f6050340df236f33a18ba5fb8
This state is called the "optimistic" state because it is usually used to immediately present the user with the result of performing an action, even though the action actually takes time to complete.
diff --git a/src/content/reference/react/useSyncExternalStore.md b/src/content/reference/react/useSyncExternalStore.md
index cda2ec3fa..c557eb90e 100644
--- a/src/content/reference/react/useSyncExternalStore.md
+++ b/src/content/reference/react/useSyncExternalStore.md
@@ -57,7 +57,7 @@ The current snapshot of the store which you can use in your rendering logic.
* If a different `subscribe` function is passed during a re-render, React will re-subscribe to the store using the newly passed `subscribe` function. You can prevent this by declaring `subscribe` outside the component.
-* If the store is mutated during a [non-blocking transition update](/reference/react/useTransition), React will fall back to performing that update as blocking. Specifically, React will call `getSnapshot` a second time just before applying changes to the DOM. If it returns a different value than when it was called originally, React will restart the transition update from scratch, this time applying it as a blocking update, to ensure that every component on screen is reflecting the same version of the store.
+* If the store is mutated during a [non-blocking transition update](/reference/react/useTransition), React will fall back to performing that update as blocking. Specifically, for every transition update, React will call `getSnapshot` a second time just before applying changes to the DOM. If it returns a different value than when it was called originally, React will restart the update from scratch, this time applying it as a blocking update, to ensure that every component on screen is reflecting the same version of the store.
* It's not recommended to _suspend_ a render based on a store value returned by `useSyncExternalStore`. The reason is that mutations to the external store cannot be [marked as non-blocking transition updates](/reference/react/useTransition), so they will trigger the nearest [`Suspense` fallback](/reference/react/Suspense), replacing already-rendered content on screen with a loading spinner, which typically makes a poor UX.