Difference of dynamic routing in Nextjs

Case: posts/[id].js

When you are calling /posts/1099 - your page will be triggered (value of id variable is 1099.

Example:

/posts - the system will trigger an error (id is not defined) or possible issue depending on your code.

/posts/1099 - OK

/posts/1011/info - the system will trigger 404.

Case: posts/[...id].js

When you are calling /posts/1099 your page will be triggered (value of id variable is 1099. If you call /posts/1011/info - the system will run your code with no error. (catching all paths by adding three dots), more info in nextjs documentation.

/posts - the system will trigger an error (id is not defined) or possible issue depending on your code.

/posts/1099 - OK

/posts/1011/info - OK (for all "nested routes", for example posts/a/b/c/d/e etc.).

Case: posts/[[...id]].js

Same as [...id].js but root path is included. (nextjs documentation)

/posts - OK.

/posts/1099 - OK

/posts/1011/info - OK.