Sync with react.dev @ abe931a8

.eslintrc

@@ -9,7 +9,8 @@
     "react-hooks/exhaustive-deps": "error",
     "react/no-unknown-property": ["error", {"ignore": ["meta"]}],
     "react-compiler/react-compiler": "error",
-    "local-rules/lint-markdown-code-blocks": "error"
+    "local-rules/lint-markdown-code-blocks": "error",
+    "no-trailing-spaces": "error"
   },
   "env": {
     "node": true,

next.config.js

@@ -22,10 +22,15 @@ const nextConfig = {
   async rewrites() {
     return {
       beforeFiles: [
+        // Explicit .md extension also serves markdown
+        {
+          source: '/:path*.md',
+          destination: '/api/md/:path*',
+        },
         // Serve markdown when Accept header prefers text/markdown
         // Useful for LLM agents - https://www.skeptrune.com/posts/use-the-accept-header-to-serve-markdown-instead-of-html-to-llms/
         {
-          source: '/:path((?!llms.txt).*)',
+          source: '/:path((?!llms\\.txt|api/md).*)',
           has: [
             {
               type: 'header',
@@ -35,11 +40,6 @@ const nextConfig = {
           ],
           destination: '/api/md/:path*',
         },
-        // Explicit .md extension also serves markdown
-        {
-          source: '/:path*.md',
-          destination: '/api/md/:path*',
-        },
       ],
     };
   },

src/content/blog/2024/02/15/react-labs-what-we-have-been-working-on-february-2024.md

@@ -49,19 +49,31 @@
 
 `action` 함수는 동기적 또는 비동기적으로 실행할 수 있습니다. 클라이언트 측에서 표준 자바스크립트를 사용하여 정의하거나, [`'use server'`](/reference/rsc/use-server)라는 지시어를 사용하여 서버에서 정의할 수 있습니다. 액션을 사용할 때, React는 [`useFormStatus`](/reference/react-dom/hooks/useFormStatus), [`useActionState`](/reference/react/useActionState)와 같은 Hook을 제공하여 데이터 제출의 생명주기를 관리하고 현재 폼의 State와 응답에 접근할 수 있습니다.
 
+<<<<<<< HEAD
 기본적으로 액션은 [트랜지션](/reference/react/useTransition) 내에서 제출되어 현재 페이지가 상호작용을 하는 동안 액션을 처리합니다. 액션은 비동기 함수를 지원하므로, 트랜지션 내에서 `async`/`await`을 사용할 수 있도록 추가했습니다. 이를 통해 `fetch`와 같은 비동기 요청이 시작되면 트랜지션의 `isPending` State를 사용하여 대기 중인 UI를 표시하고, 업데이트가 적용될 때까지 대기 중인 UI를 계속 보여줄 수 있습니다.
+=======
+By default, Actions are submitted within a [transition](/reference/react/useTransition), keeping the current page interactive while the action is processing. Since Actions support async functions, we've also added the ability to use `async/await` in transitions. This allows you to show pending UI with the `isPending` state of a transition when an async request like `fetch` starts, and show the pending UI all the way through the update being applied.
+>>>>>>> abe931a8cb3aee3e8b15ef7e187214789164162a
 
 액션과 함께, 낙관적 State 업데이트를 관리하기 위한 [`useOptimistic`](/reference/react/useOptimistic)이라는 기능을 소개합니다. 이 Hook을 사용하여 최종 State가 커밋되면 자동으로 되돌릴 수 있는 일시적인 업데이트를 적용할 수 있습니다. 액션의 경우, 제출이 성공적이라고 가정하고 클라이언트에서 데이터의 최종 State를 낙관적으로 업데이트할 수 있습니다. 그리고 서버에서 받은 데이터를 통해 값을 되돌릴 수 있습니다. 이는 일반적인 `async`/`await` 방식을 사용하여 작동하므로, 클라이언트에서 `fetch`를 사용하든 서버에서 서버 액션을 사용하든 동일하게 작동합니다.
 
 라이브러리 제작자는 각자의 컴포넌트에서 `useTransition`를 사용하여 사용자 지정 `action={fn}` Props를 구현할 수 있습니다. 우리의 의도는 라이브러리가 컴포넌트 API를 설계할 때 액션 패턴을 채택하여 React 개발자들에게 일관적인 경험을 제공하는 것입니다. 예를 들어, 라이브러리에서 `<Calendar onSelect={eventHandler}>`와 같은 컴포넌트를 제공하는 경우, `<Calendar selectAction={action}>`와 같은 API도 노출하는 것을 고려해 보세요.
 
+<<<<<<< HEAD
 우리는 처음에 서버 액션을 클라이언트-서버 사이 데이터 전송에 중점을 두었지만, React의 철학은 모둔 플랫폼과 환경에서 동일한 프로그래밍 모델을 제공하는 것입니다. 가능하다면 클라이언트의 기능을 소개한 경우 해당 기능이 서버에서도 작동하도록 하고, 그 반대의 경우도 마찬가지입니다. 이 철학을 통해 애플리케이션이 실행되는 위치와 관계없이 작동하는 단일 API 모음을 생성하여, 이후 다른 환경으로 업그레이드 하기 쉽게 만들 수 있습니다.
+=======
+While we initially focused on Server Actions for client-server data transfer, our philosophy for React is to provide the same programming model across all platforms and environments. When possible, if we introduce a feature on the client, we aim to make it also work on the server, and vice versa. This philosophy allows us to create a single set of APIs that work no matter where your app runs, making it easier to upgrade to different environments later.
+>>>>>>> abe931a8cb3aee3e8b15ef7e187214789164162a
 
 액션은 현재 실험적 채널에서 이용하실 수 있으며, React의 다음 배포에서 제공될 예정입니다.
 
 ## React Canary의 새로운 기능 {/*new-features-in-react-canary*/}
 
+<<<<<<< HEAD
 우리는 [React Canary](/blog/2023/05/03/react-canaries)에서 새로운 안정적 기능들이 최종 설계에 가까워질 때마다 각각을 선택적으로 채택할 수 있도록 소개했습니다. 그리고 이를 안정적인 시멘틱 버저닝으로 배포되기 이전에 사용할 수 있습니다.
+=======
+We introduced [React Canaries](/blog/2023/05/03/react-canaries) as an option to adopt individual new stable features as soon as their design is close to final, before they’re released in a stable semver version.
+>>>>>>> abe931a8cb3aee3e8b15ef7e187214789164162a
 
 Canary는 React의 개발 방식을 변경하는 것입니다. 이전에는 기능들이 비공개로 Meta 내부에서 연구되고 개발되었기 때문에 사용자는 그 결과물이 안정적인 버전으로 배포되었을 때만 볼 수 있었습니다. 이제 Canary와 함께 커뮤니티의 도움을 받아 React Labs 블로그 시리즈에서 공유하고 있는 기능을 완성하고자 공개적으로 개발하고 있습니다. 이는 여러분들이 새로운 기능이 완성된 이후가 아닌 완료되는 과정에서 곧바로 알 수 있다는 것을 의미합니다.
 
@@ -75,7 +87,11 @@
 
 - **액션**: 앞서 언급한 대로, 클라이언트에서 서버로 데이터를 전송하는 것을 관리하기 위해 액션을 추가했습니다. [`<form/>`](/reference/react-dom/components/form)과 같은 엘리먼트에 `action`을 추가할 수 있으며, [`useFormStatus`](/reference/react-dom/hooks/useFormStatus)를 사용하여 진행 상황에 접근하고, [`useActionState`](/reference/react/useActionState)를 사용하여 결과를 처리하며, [`useOptimistic`](/reference/react/useOptimistic)를 사용하여 UI를 낙관적으로 업데이트할 수 있습니다.
 
+<<<<<<< HEAD
 이러한 모든 기능은 함께 작동하기 때문에, 이들을 각각 안정적 채널에 배포하기는 어렵습니다. 폼 State에 접근하는 보조 Hook 없이 액션을 배포하는 것은 액션의 실제 유용성을 제한할 것입니다. 서버 액션을 통합하지 않으면서 React 서버 컴포넌트를 도입하면 서버에서 데이터를 수정하기에 복잡해질 것입니다.
+=======
+Since all of these features work together, it’s difficult to release them in the Stable channel individually. Releasing Actions without the complementary hooks for accessing form states would limit the practical usability of Actions. Introducing React Server Components without integrating Server Actions would complicate modifying data on the server.
+>>>>>>> abe931a8cb3aee3e8b15ef7e187214789164162a
 
 저희는 이러한 기능들을 안정적 채널에 배포하기 전에, 이들이 함께 작동하고 개발자가 프로덕션 단계에서 사용하기 위해 필요한 모든 것을 갖추었는지 보장해야 합니다. React Canary를 통해 개발자는 이런 기능을 개별적으로 개발하고, 전체 기능 목록이 완성되기 전까지 점진적으로 안정된 API를 배포할 수 있습니다.
 

src/content/blog/2024/04/25/react-19-upgrade-guide.md

@@ -20,7 +20,11 @@ React 19에 추가된 개선 사항들로 인해 일부 주요한 변경 사항<
 
 #### React 18.3도 함께 출시되었습니다 {/*react-18-3*/}
 
+<<<<<<< HEAD
 React 19으로의 업그레이드를 더 쉽게 돕기 위해 `react@18.3`을 출시했습니다. 이 버전은 18.2와 동일하지만, 더 이상 사용되지 않는 API 및 React 19에 필요한 변경 사항에 대한 경고를 추가했습니다.
+=======
+To help make the upgrade to React 19 easier, we've published a `react@18.3` release that is identical to 18.2 but adds warnings for deprecated APIs and other changes that are needed for React 19.
+>>>>>>> abe931a8cb3aee3e8b15ef7e187214789164162a
 
 React 19로 업그레이드하기 전에 먼저 React 18.3으로 업데이트하여 잠재적인 문제를 미리 파악하는 것을 권장합니다.
 
@@ -108,7 +112,11 @@ yarn add --exact @types/react@^19.0.0 @types/react-dom@^19.0.0
 npx codemod@latest react/19/migration-recipe
 ```
 
+<<<<<<< HEAD
 이 명령어를 실행하면 `react-codemod`에서 아래 Codemod가 실행됩니다.
+=======
+This will run the following codemods from `react-codemod`:
+>>>>>>> abe931a8cb3aee3e8b15ef7e187214789164162a
 - [`replace-reactdom-render`](https://github.com/reactjs/react-codemod?tab=readme-ov-file#replace-reactdom-render)
 - [`replace-string-ref`](https://github.com/reactjs/react-codemod?tab=readme-ov-file#replace-string-ref)
 - [`replace-act-import`](https://github.com/reactjs/react-codemod?tab=readme-ov-file#replace-act-import)
@@ -119,15 +127,23 @@ npx codemod@latest react/19/migration-recipe
 
 </Note>
 
+<<<<<<< HEAD
 Codemod가 포함된 변경 사항에는 아래와 같이 명령어가 함께 제공됩니다.
+=======
+Changes that include a codemod include the command below.
+>>>>>>> abe931a8cb3aee3e8b15ef7e187214789164162a
 
 사용할 수 있는 모든 Codemod 목록은 [`react-codemod` 저장소](https://github.com/reactjs/react-codemod)를 참고하세요.
 
 ## 주요한 변경 사항<sup>Breaking Changes</sup> {/*breaking-changes*/}
 
 ### 렌더링 중에 발생한 오류는 re-throw 하지 않음 {/*errors-in-render-are-not-re-thrown*/}
 
+<<<<<<< HEAD
 이전 버전의 React에서는 렌더링 중에 발생한 오류를 잡아서 re-throw 했습니다. 개발 모드<sup>DEV</sup>에서는 `console.error`로도 로그를 출력하여 오류 로그가 중복되는 문제가 있었습니다.
+=======
+In previous versions of React, errors thrown during render were caught and rethrown. In DEV, we would also log to `console.error`, resulting in duplicate error logs.
+>>>>>>> abe931a8cb3aee3e8b15ef7e187214789164162a
 
 React 19에서는 [오류 처리 방식을 개선하여](/blog/2024/04/25/react-19#error-handling) 더 이상 오류를 re-throw 하지 않음으로써 중복 로그를 줄였습니다.
 
@@ -348,7 +364,11 @@ npm install react-shallow-renderer --save-dev
 
 ##### Shallow 렌더링 재고 권장 {/*please-reconsider-shallow-rendering*/}
 
+<<<<<<< HEAD
 Shallow 렌더링은 React 내부 구현에 의존하며 향후 React 업그레이드를 방해할 수 있습니다. 테스트를 [@testing-library/react](https://testing-library.com/docs/react-testing-library/intro/) 또는 [@testing-library/react-native](https://testing-library.com/docs/react-native-testing-library/intro)로 마이그레이션하는 것을 권장합니다.
+=======
+Shallow rendering depends on React internals and can block you from future upgrades. We recommend migrating your tests to [@testing-library/react](https://testing-library.com/docs/react-testing-library/intro/) or [@testing-library/react-native](https://testing-library.com/docs/react-native-testing-library/intro).
+>>>>>>> abe931a8cb3aee3e8b15ef7e187214789164162a
 
 </Note>
 
@@ -465,7 +485,11 @@ npx codemod@latest react/19/replace-reactdom-render
 
 #### 제거됨: `ReactDOM.findDOMNode` {/*removed-reactdom-finddomnode*/}
 
+<<<<<<< HEAD
 `ReactDOM.findDOMNode`는 [2018년 10월 (v16.6.0)](https://legacy.reactjs.org/blog/2018/10/23/react-v-16-6.html#deprecations-in-strictmode)부터 더 이상 권장되지 않습니다.
+=======
+`ReactDOM.findDOMNode` was [deprecated in October 2018 (v16.6.0)](https://legacy.reactjs.org/blog/2018/10/23/react-v-16-6.html#deprecations-in-strictmode).
+>>>>>>> abe931a8cb3aee3e8b15ef7e187214789164162a
 
 `findDOMNode`는 레거시 코드의 해결책이었지만 실행 속도가 느리고 리팩토링에 취약하며 첫 번째 자식만 반환하는 등 많은 문제가 있어 제거됩니다 ([이곳](https://legacy.reactjs.org/docs/strict-mode.html#warning-about-deprecated-finddomnode-usage)에서 더 알아보기). `ReactDOM.findDOMNode` 대신 [DOM refs](/learn/manipulating-the-dom-with-refs)로 대체하여 사용할 수 있습니다.
 
@@ -551,7 +575,11 @@ React 19에서는 컴포넌트가 일시 중단되면 fallback을 먼저 반영
 
 ### UMD 빌드 제거됨 {/*umd-builds-removed*/}
 
+<<<<<<< HEAD
 과거에는 빌드 과정 없이도 React를 불러올 수 있는 편리한 방법으로 UMD가 널리 사용되었습니다. 하지만 이제는 HTML 문서에서 스크립트로 모듈을 불러올 수 있는 더 현대적인 대안이 존재합니다. React 19부터는 테스트 및 릴리스 과정의 복잡성을 줄이기 위해 UMD 빌드를 더 이상 제공하지 않습니다.
+=======
+UMD was widely used in the past as a convenient way to load React without a build step. Now, there are modern alternatives for loading modules as scripts in HTML documents. Starting with React 19, React will no longer produce UMD builds to reduce the complexity of its testing and release process.
+>>>>>>> abe931a8cb3aee3e8b15ef7e187214789164162a
 
 React 19를 script 태그로 불러오려면 [esm.sh](https://esm.sh/)와 같은 ESM 기반 CDN을 사용할 것을 권장합니다.
 
@@ -569,7 +597,11 @@ React 19를 script 태그로 불러오려면 [esm.sh](https://esm.sh/)와 같은
 
 [버전 관리 정책](https://react.dev/community/versioning-policy#what-counts-as-a-breaking-change)에 따라 이러한 업데이트는 중요 변경 사항으로 간주하지 않으며 어떻게 업그레이드해야 하는지에 대한 문서도 제공되지 않습니다. 권장 사항은 내부 구현에 의존하는 코드를 모두 제거하는 것입니다.
 
+<<<<<<< HEAD
 내부 구현 사용의 영향을 명확히 보여주기 위해 `SECRET_INTERNALS` 접미사<sup>Suffix</sup>를 다음과 같이 변경했습니다.
+=======
+To reflect the impact of using internals, we have renamed the `SECRET_INTERNALS` suffix to:
+>>>>>>> abe931a8cb3aee3e8b15ef7e187214789164162a
 
 `_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE`