Luis Alvarez D 57f72eac9e Add catch all routes example and a link to it in docs (#10202 )

* Added example

* Updated readme of the dynamic-routing example

* Updated catch all docs

* Simplified example

* Update examples/catch-all-routes/README.md

Co-Authored-By: Joe Haddad <joe.haddad@zeit.co>

Co-authored-by: Joe Haddad <timer150@gmail.com>

2020-01-27 13:29:05 -05:00

1.6 KiB

Raw Blame History

Catch All Routes Example

This example shows how to use Catch all routes in Next.js, which allows a dynamic route to catch all paths.

The catch all page is in pages/post/[...slug], it matches any path after /post, like the following:

/post/first-post,
/post/2020/first-post
/post/2020/first-post/with/catch/all/routes
Anything that matches the glob /post/**

You can use next/link as displayed in this example to route to these pages client side.

Deploy your own

Deploy the example using ZEIT Now:

How to use

Using `create-next-app`

Execute create-next-app with npm or Yarn to bootstrap the example:

npm init next-app --example catch-all-routes catch-all-routes-app
# or
yarn create next-app --example catch-all-routes catch-all-routes-app

Download manually

Download the example:

curl https://codeload.github.com/zeit/next.js/tar.gz/canary | tar -xz --strip=2 next.js-canary/examples/catch-all-routes
cd catch-all-routes

Install it and run:

npm install
npm run dev
# or
yarn
yarn dev

Deploy it to the cloud with Now (download):

now

1.6 KiB Raw Blame History