feat: add links to legacy react@18 korean translation documentation

Author: lumirlumir

src/components/Layout/HomeContent.js

@@ -164,6 +164,14 @@ export function HomeContent() {
               label="API Reference">
               API 참고서
             </ButtonLink>
+            <ButtonLink
+              href={'https://ko-react-exy5xcwjj-fbopensource.vercel.app/'}
+              type="secondary"
+              size="lg"
+              className="w-full sm:w-auto justify-center"
+              label="API Reference">
+              React v18 한글
+            </ButtonLink>
           </div>
         </div>
 

src/components/Layout/TopNav/TopNav.tsx

@@ -35,6 +35,22 @@ declare global {
   }
 }
 
+const react18Icon = (
+  <svg
+    stroke="currentColor"
+    fill="none"
+    strokeWidth="2"
+    viewBox="0 0 24 24"
+    strokeLinecap="round"
+    strokeLinejoin="round"
+    height="200px"
+    width="200px"
+    xmlns="http://www.w3.org/2000/svg">
+    <path d="M8 8h1v8"></path>
+    <path d="M15 12h-1a1 1 0 0 1 -1 -1v-2a1 1 0 0 1 1 -1h2a1 1 0 0 1 1 1v2a1 1 0 0 1 -1 1zh-1a1 1 0 0 0 -1 1v2a1 1 0 0 0 1 1h2a1 1 0 0 0 1 -1v-2a1 1 0 0 0 -1 -1"></path>
+  </svg>
+);
+
 const darkIcon = (
   <svg
     xmlns="http://www.w3.org/2000/svg"
@@ -346,6 +362,14 @@ export default function TopNav({
                     <IconSearch className="w-5 h-5 align-middle" />
                   </button>
                 </div>
+                <div className="flex">
+                  <Link
+                    href="https://ko-react-exy5xcwjj-fbopensource.vercel.app/"
+                    aria-label="React version 18 Korean translation"
+                    className="active:scale-95 transition-transform flex w-12 h-12 rounded-full items-center justify-center hover:bg-primary/5 hover:dark:bg-primary-dark/5 outline-link">
+                    {react18Icon}
+                  </Link>
+                </div>
                 <div className="flex dark:hidden">
                   <button
                     type="button"

src/content/reference/react/components.md

@@ -14,8 +14,8 @@ React는 JSX에서 사용할 수 있는 몇 가지 내장 컴포넌트를 제공
 
 * [`<Fragment>`](/reference/react/Fragment) 또는 `<>...</>` 로 표기하며, 여러 JSX 노드를 함께 그룹화할 수 있습니다.
 * [`<Profiler>`](/reference/react/Profiler)를 통해 React 트리의 렌더링 성능을 프로그래밍 방식으로 측정할 수 있습니다.
-* [`<Suspense>`](/reference/react/Suspense)를 통해 자식 컴포넌트를 로딩하는 동안 Fallback을 표시할 수 있습니다.
 * [`<StrictMode>`](/reference/react/StrictMode)를 통해 초기에 버그를 찾는 데 도움이 되는 추가 개발 전용 검사를 사용할 수 있습니다.
+* [`<Suspense>`](/reference/react/Suspense)를 통해 자식 컴포넌트를 로딩하는 동안 Fallback을 표시할 수 있습니다.
 
 ---
 

src/content/versions.md

@@ -18,7 +18,7 @@ title: React 버전
 
 ## 이전 버전 {/*previous-versions*/}
 
-- [18.react.dev](https://18.react.dev) {/*docs-18*/}
+- [18.react.dev](https://18.react.dev) {/*docs-18*/} ([React v18 한글](https://ko-react-exy5xcwjj-fbopensource.vercel.app/))
 - [17.react.dev](https://17.react.dev) {/*docs-17*/}
 - [16.react.dev](https://16.react.dev) {/*docs-16*/}
 - [15.react.dev](https://15.react.dev) {/*docs-15*/}