examples: update with-mdx-remote example to utilize the App Router

[JamBalaya56562]

Description

This PR updates the with-mdx-remote example to use the App Router and TypeScript. Here are the changes that have been made:

1. Renamed the pages folder to the app folder.
2. Converted JavaScript to TypeScript files and created tsconfig.json.
3. Created a new global.css and layout.tsx files in the app directory.
4. Used CSS module instead of styled-jsx.
5. Removed next-remote-watch due to incompatibility and no maintenance.
6. Removed gray-matter and implement front-matter parser as well.
7. Updated the .gitignore, package.json and README.md files.

The new app looks and works much the same as the old one.

Adding or Updating Examples

• The "examples guidelines" are followed from our contributing doc https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md
• Make sure the linting passes by running pnpm build && pnpm lint. See https://github.com/vercel/next.js/blob/canary/contributing/repository/linting.md

[ijjk]

Allow CI Workflow Run

• approve CI run for commit: 872d222

Note: this should only be enabled once the PR is ready to go and can only be enabled by a maintainer

[socket-security]

New and removed dependencies detected. Learn more about Socket for GitHub ↗︎

Package	New capabilities	Transitives	Size	Publisher
npm/next-mdx-remote@5.0.0	environment	+36	1.17 MB	hashibot-web

🚮 Removed packages: npm/next-mdx-remote@3.0.8, npm/next-remote-watch@1.0.0

View full report↗︎

[samcx]

Thank you for submitting a PR!