tranquyetdev/nextjs-spa

An example of combining NextJS SSR + SPA with nested layouts

NextJS-SPA

An POC of how to develop a Single Page Application in NextJS 13, using App Router.

• NextJS 13, App Router
• Route Groups:
  • (spa): A route group for mutiple SPAs that share the same layout
    • chat/[[...slug]]: Reserve all routes chat/* to the Chat SPA using Optional Catch-all Segments
      • Try out chat-engine.io
      • Try out chat-ui-kit-react
  • (ssr): A route group for all SSR pages (About, Contact)
• Navigate between SSR pages use next/link
• Navigate between chat/\* sub-pages use Link component from react-router-dom

Demo: https://nextjs-spa-nine.vercel.app