Enhance recipes app, add App Router path to validate that flow

The recipes app right now is using the pages router in next, it'd be nice to validate the App Router works as expected as well.

Figure we could:

- Add an `/app-router` route (via `app/layout.js`, `app/app-router/page.js`)
- Have it take a pokemon name via a query param, e.g. `?name=Pikachu`
- Fetch from the GQL endpoint in a server component

Basically the same as the `getServerSideProps` demo already there

Start by reading the existing recipes app and its getServerSideProps demo to understand the current Pages Router flow and GraphQL endpoint. Then inspect the planned app/layout.js and app/app-router/page.js entry points. Done means an /app-router route accepts a name query parameter and fetches the corresponding recipe data from a server component.

Written by the indexing model from the issue text.