Dynamic routes in Gatsby w/ Netlify

Specify client paths


npm i gatsby-plugin-create-client-paths

All urls that match /post/* will render the pages/post.js component.


resolve: `gatsby-plugin-create-client-paths`,
options: { prefixes: [`/post/*`] },

Setup Netlify redirect

This will work, however in production your 404 page will flash for a moment before the client side route takes over. To fix this, setup a redirect.

See this issue for further context.

In netlify.toml

from = "/post/*"
to = "/post"
status = 200
force = true


By specifying which routes should be client rendered, and setting up the appropriate redirects, Gatsby routing can be used in much the same way a traditional Single Page App would be.