Convert custom-routes-proxying example to TypeScript (#38974)

Converted `custom-routes-proxying` example to TypeScript to match Contribution docs.

## Documentation / Examples

- [X] Make sure the linting passes by running `pnpm lint`
- [X] The examples guidelines are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing.md#adding-examples)

examples/custom-routes-proxying/.gitignore

@@ -32,3 +32,6 @@ yarn-error.log*
 
 # vercel
 .vercel
+
+# typescript
+*.tsbuildinfo

examples/custom-routes-proxying/next-env.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="next" />
+/// <reference types="next/image-types/global" />
+
+// NOTE: This file should not be edited
+// see https://nextjs.org/docs/basic-features/typescript for more information.

examples/custom-routes-proxying/next.config.js

@@ -1,4 +1,9 @@
-module.exports = {
+// @ts-check
+
+/**
+ * @type {import('next').NextConfig}
+ **/
+const nextConfig = {
   async rewrites() {
     return {
       fallback: [
@@ -10,3 +15,5 @@ module.exports = {
     }
   },
 }
+
+module.exports = nextConfig

examples/custom-routes-proxying/package.json

@@ -7,7 +7,13 @@
   },
   "dependencies": {
     "next": "latest",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2"
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  },
+  "devDependencies": {
+    "@types/node": "^18.6.0",
+    "@types/react": "^18.0.15",
+    "@types/react-dom": "^18.0.6",
+    "typescript": "^4.7.4"
   }
 }

examples/custom-routes-proxying/pages/about.js → examples/custom-routes-proxying/pages/about.tsx

@@ -1,11 +1,10 @@
 import Link from 'next/link'
+
 export default function About() {
   return (
     <div>
       <h3>This is the /about page. </h3>
-      <Link href="/">
-        <a> &larr; Back home</a>
-      </Link>
+      <Link href="/">&larr; Back home</Link>
     </div>
   )
 }

examples/custom-routes-proxying/pages/hello/[slug].tsx

@@ -0,0 +1,13 @@
+import Link from 'next/link'
+import { useRouter } from 'next/router'
+
+export default function About() {
+  const router = useRouter()
+
+  return (
+    <div>
+      <h3>This is the `hello/[slug]` page. slug: {router.query.slug} </h3>
+      <Link href="/">&larr; Back home</Link>
+    </div>
+  )
+}

examples/custom-routes-proxying/pages/index.js → examples/custom-routes-proxying/pages/index.tsx

@@ -1,14 +1,13 @@
 import Link from 'next/link'
+
 export default function Home() {
   return (
     <div>
       <h3>Hello World.</h3>
-      <Link href="/about">
-        <a>About</a>
-      </Link>
+      <Link href="/about">About</Link>
       <br />
       <Link href="/hello/[slug]" as="/hello/world">
-        <a>Hello world</a>
+        Hello world
       </Link>
     </div>
   )

examples/custom-routes-proxying/tsconfig.json

@@ -0,0 +1,20 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "strict": false,
+    "forceConsistentCasingInFileNames": true,
+    "noEmit": true,
+    "esModuleInterop": true,
+    "module": "esnext",
+    "moduleResolution": "node",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "jsx": "preserve",
+    "incremental": true
+  },
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
+  "exclude": ["node_modules"]
+}