Skip to content

Upgrade data-driven-dependencies to Next.js 16, App Router, and TypeScript#349

Merged
captbaritone merged 2 commits into
relayjs:mainfrom
captbaritone:data-driven-deps-app-router
Jun 16, 2026
Merged

Upgrade data-driven-dependencies to Next.js 16, App Router, and TypeScript#349
captbaritone merged 2 commits into
relayjs:mainfrom
captbaritone:data-driven-deps-app-router

Conversation

@captbaritone

Copy link
Copy Markdown
Contributor

Summary

  • Upgrade Next.js to 16, React to 19, and other dependencies to current versions
  • Migrate from Pages Router to App Router (pages/app/)
  • Migrate all source files from JavaScript to TypeScript
  • Simplify Relay integration: replace getServerSideProps + manual PreloadedQuery hydration with useLazyLoadQuery
  • Remove deprecated Next.js config (experimental.runtime, serverRuntimeConfig, webpack React alias)
  • Fix allBlogPosts to respect the first argument
  • Fix deprecated <Link><a> nesting pattern

Test plan

  • yarn dev starts without errors
  • Home page loads and displays blog posts
  • "Load More" paginates correctly
  • Refreshing after pagination resets to initial first count
  • Post detail pages render with data-driven @module components
  • About page renders
  • CI passes

Migrate from Pages Router to App Router, upgrade Next.js to 16 and
React to 19, and simplify the Relay integration.

- Replace getServerSideProps + manual PreloadedQuery with useLazyLoadQuery
- Replace pages/ with app/ directory (layout, providers, route handler)
- Remove deprecated experimental flags, serverRuntimeConfig, webpack alias
- Fix deprecated Link child <a> pattern
- Bump dependency versions (next, react, prettier, concurrently, etc.)
Rename all source files from .js/.mjs to .tsx/.ts, add type annotations,
and configure Relay compiler for TypeScript output.

- Add typescript, tsx, @types/react, @types/react-dom, @types/node
- Update relay.config.json: language typescript, eagerEsModules true
- Add Relay fragment key types to component props
- Type ErrorBoundary, moduleLoader, network, and LayoutComponents
- Use tsx for schema generation script
- Fix allBlogPosts to respect the `first` argument
@meta-cla meta-cla Bot added the CLA Signed label Jun 16, 2026
@captbaritone captbaritone merged commit ef4af00 into relayjs:main Jun 16, 2026
3 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant