https://github.com/nilshartmann/hello-nextjs-parallel

Next.js parallel route (failing) example
https://github.com/nilshartmann/hello-nextjs-parallel

Last synced: about 5 hours ago
JSON representation

Next.js parallel route (failing) example

• Host: GitHub
• URL: https://github.com/nilshartmann/hello-nextjs-parallel
• Owner: nilshartmann
• Created: 2023-09-25T19:52:22.000Z (about 1 year ago)
• Default Branch: main
• Last Pushed: 2023-09-25T19:52:33.000Z (about 1 year ago)
• Last Synced: 2024-05-15T15:40:26.452Z (6 months ago)
• Language: TypeScript
• Size: 44.9 KB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Parallel Routes example

- Motivation: in `/user/layout.tsx` I want to add a `header` component from `user/[userId]`

- While this approach in general seems to work, all routes in `user/[userId]` are rendered twice

  - (see build output when running `pnpm build`)

  - at runtime, you have to click on a link for the next user twice to make it work

    - clicking the link after that again it works correctly, probably because its coming from the cache then

  - `user` route is generated and rendered correctly (one time)

# Try out

* pnpm install

* pnpm build

* pnpm start

* App runs on http://localhost:4001

* Output `Header from /user/XXX` is inserted via parallel route/slot `@header` into `/user`-Layout component