Merge branch 'main' into docs/ko-translation

Author: lumirlumir

.github/ISSUE_TEMPLATE/3-framework.yml

@@ -1 +1 @@
-**/*.md
+src/content/**/*.md

.prettierignore

@@ -0,0 +1,24 @@
+/* eslint-disable import/no-anonymous-default-export */
+import mark from 'eslint-plugin-mark';
+
+export default [
+  {
+    ignores: ['**/*.js', '**/*.mjs', '**/*.cjs'],
+  },
+  {
+    ...mark.configs.baseGfm,
+    files: ['src/content/**/*.md'],
+    rules: {
+      'mark/no-curly-quote': [
+        'error',
+        {leftSingleQuotationMark: false, rightSingleQuotationMark: false},
+      ],
+      'mark/no-double-space': 'error',
+      'mark/no-git-conflict-marker': ['error', {skipCode: false}],
+      'mark/no-irregular-whitespace': [
+        'error',
+        {skipCode: false, skipInlineCode: false},
+      ],
+    },
+  },
+];

eslint.config.mjs

@@ -23,7 +23,7 @@
     "lint-editorconfig": "yarn editorconfig-checker",
     "textlint-test": "yarn mocha ./textlint/tests/utils && yarn mocha ./textlint/tests/rules",
     "textlint-docs": "node ./textlint/generators/genTranslateGlossaryDocs.js && git add wiki/translate-glossary.md",
-    "textlint-lint": "yarn textlint ./src/content --rulesdir ./textlint/rules -f pretty-error"
+    "textlint-lint": "yarn textlint ./src/content --rulesdir ./textlint/rules -f pretty-error && npx --yes eslint@9 -c eslint.config.mjs"
   },
   "dependencies": {
     "@codesandbox/sandpack-react": "2.13.5",
@@ -64,14 +64,15 @@
     "asyncro": "^3.0.0",
     "autoprefixer": "^10.4.2",
     "babel-eslint": "10.x",
-    "editorconfig-checker": "^6.0.1",
     "babel-plugin-react-compiler": "19.0.0-beta-e552027-20250112",
+    "editorconfig-checker": "^6.0.1",
     "eslint": "7.x",
     "eslint-config-next": "12.0.3",
     "eslint-config-react-app": "^5.2.1",
     "eslint-plugin-flowtype": "4.x",
     "eslint-plugin-import": "2.x",
     "eslint-plugin-jsx-a11y": "6.x",
+    "eslint-plugin-mark": "^0.1.0-canary.2",
     "eslint-plugin-react": "7.x",
     "eslint-plugin-react-compiler": "^19.0.0-beta-e552027-20250112",
     "eslint-plugin-react-hooks": "^0.0.0-experimental-fabef7a6b-20221215",

package.json

@@ -196,7 +196,7 @@ export function HomeContent() {
             <Para>
               혼자서 작업하든, 수천 명의 다른 개발자와 함께 작업하든, React를
               사용하는 느낌은 동일합니다. 개인, 팀, 조직에서 작성한 컴포넌트를
-              원활하게 결합할 수 있도록 설계되었습니다.
+              원활하게 결합할 수 있도록 설계하였습니다.
             </Para>
           </Center>
         </Section>
@@ -325,7 +325,7 @@ export function HomeContent() {
                         React를 사용하면 데이터를 가져오는 동안 HTML을
                         스트리밍하여 자바스크립트 코드가 로드되기 전에 남은
                         내용을 점진적으로 채울 수 있습니다. 클라이언트에서
-                        React는 표준 웹 API를 사용하여 렌더링 중에도 UI를
+                        React는 표준 웹 API를 사용하여 렌더링 중에도 UI가
                         반응하도록 유지할 수 있습니다.
                       </p>
                     </div>

src/components/Layout/HomeContent.js

@@ -69,7 +69,7 @@ function parseQueryString(search: string): Array<string | undefined> {
 }
 
 export default function ErrorDecoder() {
-  const {errorMessage} = useErrorDecoderParams();
+  const {errorMessage, errorCode} = useErrorDecoderParams();
   /** error messages that contain %s require reading location.search */
   const hasParams = errorMessage?.includes('%s');
   const [message, setMessage] = useState<React.ReactNode | null>(() =>
@@ -82,23 +82,28 @@ export default function ErrorDecoder() {
     if (errorMessage == null || !hasParams) {
       return;
     }
+    const args = parseQueryString(window.location.search);
+    let message = errorMessage;
+    if (errorCode === '418') {
+      // Hydration errors have a %s for the diff, but we don't add that to the args for security reasons.
+      message = message.replace(/%s$/, '');
 
-    setMessage(
-      urlify(
-        replaceArgs(
-          errorMessage,
-          parseQueryString(window.location.search),
-          '[missing argument]'
-        )
-      )
-    );
+      // Before React 19.1, the error message didn't have an arg, and was always HTML.
+      if (args.length === 0) {
+        args.push('HTML');
+      } else if (args.length === 1 && args[0] === '') {
+        args[0] = 'HTML';
+      }
+    }
+
+    setMessage(urlify(replaceArgs(message, args, '[missing argument]')));
     setIsReady(true);
-  }, [hasParams, errorMessage]);
+  }, [errorCode, hasParams, errorMessage]);
 
   return (
     <code
       className={cn(
-        'block bg-red-100 text-red-600 py-4 px-6 mt-5 rounded-lg',
+        'whitespace-pre-line block bg-red-100 text-red-600 py-4 px-6 mt-5 rounded-lg',
         isReady ? 'opacity-100' : 'opacity-0'
       )}>
       <b>{message}</b>

src/components/MDX/ErrorDecoder.tsx

@@ -28,8 +28,8 @@ root.render(
           eject: 'react-scripts eject',
         },
         dependencies: {
-          react: '19.0.0-rc-3edc000d-20240926',
-          'react-dom': '19.0.0-rc-3edc000d-20240926',
+          react: '^19.1.0',
+          'react-dom': '^19.1.0',
           'react-scripts': '^5.0.0',
         },
       },

src/components/MDX/Sandpack/template.ts

@@ -272,11 +272,11 @@ React 18의 Strict 모드에서는 개발 모드에서 컴포넌트를 마운트
 * Add `useSyncExternalStore` to help external store libraries integrate with React. ([#15022](https://github.com/facebook/react/pull/15022), [#18000](https://github.com/facebook/react/pull/18000), [#18771](https://github.com/facebook/react/pull/18771), [#22211](https://github.com/facebook/react/pull/22211), [#22292](https://github.com/facebook/react/pull/22292), [#22239](https://github.com/facebook/react/pull/22239), [#22347](https://github.com/facebook/react/pull/22347), [#23150](https://github.com/facebook/react/pull/23150) by [@acdlite](https://github.com/acdlite), [@bvaughn](https://github.com/bvaughn), and [@drarmstr](https://github.com/drarmstr))
 * Add `startTransition` as a version of `useTransition` without pending feedback. ([#19696](https://github.com/facebook/react/pull/19696)  by [@rickhanlonii](https://github.com/rickhanlonii))
 * Add `useInsertionEffect` for CSS-in-JS libraries. ([#21913](https://github.com/facebook/react/pull/21913)  by [@rickhanlonii](https://github.com/rickhanlonii))
-* Make Suspense remount layout effects when content reappears.  ([#19322](https://github.com/facebook/react/pull/19322), [#19374](https://github.com/facebook/react/pull/19374), [#19523](https://github.com/facebook/react/pull/19523), [#20625](https://github.com/facebook/react/pull/20625), [#21079](https://github.com/facebook/react/pull/21079) by [@acdlite](https://github.com/acdlite), [@bvaughn](https://github.com/bvaughn), and [@lunaruan](https://github.com/lunaruan))
+* Make Suspense remount layout effects when content reappears. ([#19322](https://github.com/facebook/react/pull/19322), [#19374](https://github.com/facebook/react/pull/19374), [#19523](https://github.com/facebook/react/pull/19523), [#20625](https://github.com/facebook/react/pull/20625), [#21079](https://github.com/facebook/react/pull/21079) by [@acdlite](https://github.com/acdlite), [@bvaughn](https://github.com/bvaughn), and [@lunaruan](https://github.com/lunaruan))
 * Make `<StrictMode>` re-run effects to check for restorable state. ([#19523](https://github.com/facebook/react/pull/19523) , [#21418](https://github.com/facebook/react/pull/21418)  by [@bvaughn](https://github.com/bvaughn) and [@lunaruan](https://github.com/lunaruan))
 * Assume Symbols are always available. ([#23348](https://github.com/facebook/react/pull/23348)  by [@sebmarkbage](https://github.com/sebmarkbage))
 * Remove `object-assign` polyfill. ([#23351](https://github.com/facebook/react/pull/23351)  by [@sebmarkbage](https://github.com/sebmarkbage))
-* Remove unsupported `unstable_changedBits` API.  ([#20953](https://github.com/facebook/react/pull/20953)  by [@acdlite](https://github.com/acdlite))
+* Remove unsupported `unstable_changedBits` API. ([#20953](https://github.com/facebook/react/pull/20953)  by [@acdlite](https://github.com/acdlite))
 * Allow components to render undefined. ([#21869](https://github.com/facebook/react/pull/21869)  by [@rickhanlonii](https://github.com/rickhanlonii))
 * Flush `useEffect` resulting from discrete events like clicks synchronously. ([#21150](https://github.com/facebook/react/pull/21150)  by [@acdlite](https://github.com/acdlite))
 * Suspense `fallback={undefined}` now behaves the same as `null` and isn't ignored. ([#21854](https://github.com/facebook/react/pull/21854)  by [@rickhanlonii](https://github.com/rickhanlonii))
@@ -291,7 +291,7 @@ React 18의 Strict 모드에서는 개발 모드에서 컴포넌트를 마운트
 * Fix a crash when rendering `ZonedDateTime` in the tree. ([#20617](https://github.com/facebook/react/pull/20617)  by [@dimaqq](https://github.com/dimaqq))
 * Fix a crash when document is set to `null` in tests. ([#22695](https://github.com/facebook/react/pull/22695)  by [@SimenB](https://github.com/SimenB))
 * Fix `onLoad` not triggering when concurrent features are on. ([#23316](https://github.com/facebook/react/pull/23316)  by [@gnoff](https://github.com/gnoff))
-* Fix a warning when a selector returns `NaN`.  ([#23333](https://github.com/facebook/react/pull/23333)  by [@hachibeeDI](https://github.com/hachibeeDI))
+* Fix a warning when a selector returns `NaN`. ([#23333](https://github.com/facebook/react/pull/23333)  by [@hachibeeDI](https://github.com/hachibeeDI))
 * Fix a crash when document is set to `null` in tests. ([#22695](https://github.com/facebook/react/pull/22695) by [@SimenB](https://github.com/SimenB))
 * Fix the generated license header. ([#23004](https://github.com/facebook/react/pull/23004)  by [@vitaliemiron](https://github.com/vitaliemiron))
 * Add `package.json` as one of the entry points. ([#22954](https://github.com/facebook/react/pull/22954)  by [@Jack](https://github.com/Jack-Works))
@@ -305,7 +305,7 @@ React 18의 Strict 모드에서는 개발 모드에서 컴포넌트를 마운트
 * Add `aria-description` to the list of known ARIA attributes. ([#22142](https://github.com/facebook/react/pull/22142)  by [@mahyareb](https://github.com/mahyareb))
 * Add `onResize` event to video elements. ([#21973](https://github.com/facebook/react/pull/21973)  by [@rileyjshaw](https://github.com/rileyjshaw))
 * Add `imageSizes` and `imageSrcSet` to known props. ([#22550](https://github.com/facebook/react/pull/22550)  by [@eps1lon](https://github.com/eps1lon))
-* Allow non-string `<option>` children if `value` is provided.  ([#21431](https://github.com/facebook/react/pull/21431)  by [@sebmarkbage](https://github.com/sebmarkbage))
+* Allow non-string `<option>` children if `value` is provided. ([#21431](https://github.com/facebook/react/pull/21431)  by [@sebmarkbage](https://github.com/sebmarkbage))
 * Fix `aspectRatio` style not being applied. ([#21100](https://github.com/facebook/react/pull/21100)  by [@gaearon](https://github.com/gaearon))
 * Warn if `renderSubtreeIntoContainer` is called. ([#23355](https://github.com/facebook/react/pull/23355)  by [@acdlite](https://github.com/acdlite))
 

src/content/blog/2022/03/29/react-v18.md

@@ -1,6 +1,6 @@
 ---
 title: "React Labs: 그동안의 작업 – 2022년 6월"
-author:  Andrew Clark, Dan Abramov, Jan Kassens, Joseph Savona, Josh Story, Lauren Tan, Luna Ruan, Mengdi Chen, Rick Hanlon, Robert Zhang, Sathya Gunasekaran, Sebastian Markbage, and Xuan Huang
+author: Andrew Clark, Dan Abramov, Jan Kassens, Joseph Savona, Josh Story, Lauren Tan, Luna Ruan, Mengdi Chen, Rick Hanlon, Robert Zhang, Sathya Gunasekaran, Sebastian Markbage, and Xuan Huang
 date: 2022/06/15
 description: React 18 은 수년간의 준비 끝에 탄생한 버전으로 React 팀에게 귀중한 교훈을 가져다주었습니다. 수년간의 연구와 다양한 경로를 모색한 끝에 출시된 제품입니다. 그 경로 중 일부는 성공적이었지만 더 많은 경로가 막다른 골목에서 새로운 인사이트로 이어졌습니다. 우리가 얻은 한 가지 교훈은 우리가 탐색하고 있는 경로에 대한 인사이트를 공유받지 못한 채 새로운 기능을 기다리는 것은 커뮤니티에 실망감을 준다는 것입니다.
 ---

src/content/blog/2022/06/15/react-labs-what-we-have-been-working-on-june-2022.md

@@ -50,7 +50,7 @@ You can watch [Sathya Gunasekaran's](https://twitter.com/_gsathya) talk at React
 
 ## We recommend everyone use the React Compiler linter today {/*we-recommend-everyone-use-the-react-compiler-linter-today*/}
 
-React Compiler’s ESLint plugin helps developers proactively identify and correct [Rules of React](/reference/rules) violations. **We strongly recommend everyone use the linter today**. The linter does not require that you have the compiler installed, so you can use it independently, even if you are not ready to try out the compiler.
+React Compiler's ESLint plugin helps developers proactively identify and correct [Rules of React](/reference/rules) violations. **We strongly recommend everyone use the linter today**. The linter does not require that you have the compiler installed, so you can use it independently, even if you are not ready to try out the compiler.
 
 To install the linter only: