Suggest `npx` over `npm init` (#13637)

This updates old examples to the more universal `npx` command.

Fixes https://github.com/vercel/next.js/discussions/12103

contributing.md

@@ -143,7 +143,7 @@ Deploy the example using [Vercel](https://vercel.com/now):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example DIRECTORY_NAME DIRECTORY_NAME-app
+npx create-next-app --example DIRECTORY_NAME DIRECTORY_NAME-app
 # or
 yarn create next-app --example DIRECTORY_NAME DIRECTORY_NAME-app
 ```

examples/active-class-name/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example active-class-name active-class-name-app
+npx create-next-app --example active-class-name active-class-name-app
 # or
 yarn create next-app --example active-class-name active-class-name-app
 ```

examples/amp-first/README.md

@@ -20,7 +20,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example amp-first amp-first-app
+npx create-next-app --example amp-first amp-first-app
 # or
 yarn create next-app --example amp-first amp-first-app
 ```

examples/amp-story/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example amp-story amp-app
+npx create-next-app --example amp-story amp-app
 # or
 yarn create next-app --example amp-story amp-app
 ```

examples/amp/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example amp amp-app
+npx create-next-app --example amp amp-app
 # or
 yarn create next-app --example amp amp-app
 ```

examples/analyze-bundles/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example analyze-bundles analyze-bundles-app
+npx create-next-app --example analyze-bundles analyze-bundles-app
 # or
 yarn create next-app --example analyze-bundles analyze-bundles-app
 ```

examples/api-routes-apollo-server-and-client/README.md

@@ -16,7 +16,7 @@ https://www.apollographql.com/docs/react/api/react-ssr/#getdatafromtree
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example api-routes-apollo-server-and-client api-routes-apollo-server-and-client-app
+npx create-next-app --example api-routes-apollo-server-and-client api-routes-apollo-server-and-client-app
 # or
 yarn create next-app --example api-routes-apollo-server-and-client api-routes-apollo-server-and-client-app
 ```

examples/api-routes-apollo-server/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example api-routes-apollo-server api-routes-apollo-server-app
+npx create-next-app --example api-routes-apollo-server api-routes-apollo-server-app
 # or
 yarn create next-app --example api-routes-apollo-server api-routes-apollo-server-app
 ```

examples/api-routes-cors/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example api-routes-cors api-routes-cors-app
+npx create-next-app --example api-routes-cors api-routes-cors-app
 # or
 yarn create next-app --example api-routes-cors api-routes-cors-app
 ```

examples/api-routes-graphql/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example api-routes-graphql api-routes-graphql-app
+npx create-next-app --example api-routes-graphql api-routes-graphql-app
 # or
 yarn create next-app --example api-routes-graphql api-routes-graphql-app
 ```

examples/api-routes-middleware/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example api-routes-middleware api-routes-middleware-app
+npx create-next-app --example api-routes-middleware api-routes-middleware-app
 # or
 yarn create next-app --example api-routes-middleware api-routes-middleware-app
 ```

examples/api-routes-rest/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example api-routes-rest api-routes-rest-app
+npx create-next-app --example api-routes-rest api-routes-rest-app
 # or
 yarn create next-app --example api-routes-rest api-routes-rest-app
 ```

examples/api-routes/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example api-routes api-routes-app
+npx create-next-app --example api-routes api-routes-app
 # or
 yarn create next-app --example api-routes api-routes-app
 ```

examples/auth0/README.md

@@ -9,7 +9,7 @@ Read more: [https://auth0.com/blog/ultimate-guide-nextjs-authentication-auth0/](
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example auth0 auth0
+npx create-next-app --example auth0 auth0
 # or
 yarn create next-app --example auth0 auth0
 ```

examples/basic-css/README.md

@@ -17,7 +17,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example basic-css basic-css-app
+npx create-next-app --example basic-css basic-css-app
 # or
 yarn create next-app --example basic-css basic-css-app
 ```

examples/basic-export/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example basic-export basic-export-app
+npx create-next-app --example basic-export basic-export-app
 # or
 yarn create next-app --example basic-export basic-export-app
 ```

examples/blog-starter-typescript/README.md

@@ -15,7 +15,7 @@ To create the blog posts we use [`remark`](https://github.com/remarkjs/remark) a
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example blog-starter-typescript blog-starter-typescript-app
+npx create-next-app --example blog-starter-typescript blog-starter-typescript-app
 # or
 yarn create next-app --example blog-starter-typescript blog-starter-typescript-app
 ```

examples/blog-starter/README.md

@@ -25,7 +25,7 @@ To create the blog posts we use [`remark`](https://github.com/remarkjs/remark) a
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example blog-starter blog-starter-app
+npx create-next-app --example blog-starter blog-starter-app
 # or
 yarn create next-app --example blog-starter blog-starter-app
 ```

examples/catch-all-routes/README.md

@@ -24,7 +24,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example catch-all-routes catch-all-routes-app
+npx create-next-app --example catch-all-routes catch-all-routes-app
 # or
 yarn create next-app --example catch-all-routes catch-all-routes-app
 ```

examples/cms-contentful/README.md

@@ -19,7 +19,7 @@ This example showcases Next.js's [Static Generation](/docs/basic-features/pages.
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example cms-contentful cms-contentful-app
+npx create-next-app --example cms-contentful cms-contentful-app
 # or
 yarn create next-app --example cms-contentful cms-contentful-app
 ```

examples/cms-datocms/README.md

@@ -20,7 +20,7 @@ This example showcases Next.js's [Static Generation](https://nextjs.org/docs/bas
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example cms-datocms cms-datocms-app
+npx create-next-app --example cms-datocms cms-datocms-app
 # or
 yarn create next-app --example cms-datocms cms-datocms-app
 ```

examples/cms-prismic/README.md

@@ -21,7 +21,7 @@ This example showcases Next.js's [Static Generation](/docs/basic-features/pages.
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example cms-prismic cms-prismic-app
+npx create-next-app --example cms-prismic cms-prismic-app
 # or
 yarn create next-app --example cms-prismic cms-prismic-app
 ```

examples/cms-sanity/README.md

@@ -21,7 +21,7 @@ This example showcases Next.js's [Static Generation](https://nextjs.org/docs/bas
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example cms-sanity cms-sanity-app
+npx create-next-app --example cms-sanity cms-sanity-app
 # or
 yarn create next-app --example cms-sanity cms-sanity-app
 ```

examples/cms-takeshape/README.md

@@ -21,7 +21,7 @@ This example showcases Next.js's [Static Generation](https://nextjs.org/docs/bas
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example cms-takeshape cms-takeshape-app
+npx create-next-app --example cms-takeshape cms-takeshape-app
 # or
 yarn create next-app --example cms-takeshape cms-takeshape-app
 ```

examples/custom-server-actionhero/README.md

@@ -12,7 +12,7 @@ A more detailed example showcasing how to use fetch and web sockets to interact
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example custom-server-actionhero custom-server-actionhero-app
+npx create-next-app --example custom-server-actionhero custom-server-actionhero-app
 # or
 yarn create next-app --example custom-server-actionhero custom-server-actionhero-app
 ```

examples/custom-server-express/README.md

@@ -13,7 +13,7 @@ The example shows a server that serves the component living in `pages/a.js` when
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example custom-server-express custom-server-express-app
+npx create-next-app --example custom-server-express custom-server-express-app
 # or
 yarn create next-app --example custom-server-express custom-server-express-app
 ```

examples/custom-server-fastify/README.md

@@ -13,7 +13,7 @@ The example shows a server that serves the component living in `pages/a.js` when
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example custom-server-fastify custom-server-fastify-app
+npx create-next-app --example custom-server-fastify custom-server-fastify-app
 # or
 yarn create next-app --example custom-server-fastify custom-server-fastify-app
 ```

examples/custom-server-hapi/README.md

@@ -13,7 +13,7 @@ The example shows a server that serves the component living in `pages/a.js` when
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example custom-server-hapi custom-server-hapi-app
+npx create-next-app --example custom-server-hapi custom-server-hapi-app
 # or
 yarn create next-app --example custom-server-hapi custom-server-hapi-app
 ```

examples/custom-server-koa/README.md

@@ -13,7 +13,7 @@ The example shows a server that serves the component living in `pages/a.js` when
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example custom-server-koa custom-server-koa-app
+npx create-next-app --example custom-server-koa custom-server-koa-app
 # or
 yarn create next-app --example custom-server-koa custom-server-koa-app
 ```

examples/custom-server-polka/README.md

@@ -13,7 +13,7 @@ The example shows a server that serves the component living in `pages/a.js` when
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example custom-server-polka custom-server-polka-app
+npx create-next-app --example custom-server-polka custom-server-polka-app
 # or
 yarn create next-app --example custom-server-polka custom-server-polka-app
 ```

examples/custom-server-typescript/README.md

@@ -12,7 +12,7 @@ The second directory should be added to `.gitignore`.
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example custom-server-typescript custom-server-typescript-app
+npx create-next-app --example custom-server-typescript custom-server-typescript-app
 # or
 yarn create next-app --example custom-server-typescript custom-server-typescript-app
 ```

examples/custom-server/README.md

@@ -11,7 +11,7 @@ The example shows a server that serves the component living in `pages/a.js` when
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example custom-server custom-server-app
+npx create-next-app --example custom-server custom-server-app
 # or
 yarn create next-app --example custom-server custom-server-app
 ```

examples/data-fetch/README.md

@@ -18,7 +18,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example data-fetch data-fetch-app
+npx create-next-app --example data-fetch data-fetch-app
 # or
 yarn create next-app --example data-fetch data-fetch-app
 ```

examples/dynamic-routing/README.md

@@ -23,7 +23,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example dynamic-routing dynamic-routing-app
+npx create-next-app --example dynamic-routing dynamic-routing-app
 # or
 yarn create next-app --example dynamic-routing dynamic-routing-app
 ```

examples/gh-pages/README.md

@@ -9,7 +9,7 @@ This example shows the most basic idea behind Next. We have 2 pages: `pages/inde
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example gh-pages gh-pages-app
+npx create-next-app --example gh-pages gh-pages-app
 # or
 yarn create next-app --example gh-pages gh-pages-app
 ```

examples/head-elements/README.md

@@ -17,7 +17,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example head-elements head-elements-app
+npx create-next-app --example head-elements head-elements-app
 # or
 yarn create next-app --example head-elements head-elements-app
 ```

examples/hello-world/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example hello-world hello-world-app
+npx create-next-app --example hello-world hello-world-app
 # or
 yarn create next-app --example hello-world hello-world-app
 ```

examples/layout-component/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example layout-component layout-component-app
+npx create-next-app --example layout-component layout-component-app
 # or
 yarn create next-app --example layout-component layout-component-app
 ```

examples/nested-components/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example nested-components nested-components-app
+npx create-next-app --example nested-components nested-components-app
 # or
 yarn create next-app --example nested-components nested-components-app
 ```

examples/progressive-render/README.md

@@ -29,7 +29,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example progressive-render progressive-render-app
+npx create-next-app --example progressive-render progressive-render-app
 # or
 yarn create next-app --example progressive-render progressive-render-app
 ```

examples/ssr-caching/README.md

@@ -12,7 +12,7 @@ This app uses Next's [custom server and routing](https://github.com/vercel/next.
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example ssr-caching ssr-caching-app
+npx create-next-app --example ssr-caching ssr-caching-app
 # or
 yarn create next-app --example ssr-caching ssr-caching-app
 ```

examples/svg-components/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example svg-components svg-components-app
+npx create-next-app --example svg-components svg-components-app
 # or
 yarn create next-app --example svg-components svg-components-app
 ```

examples/using-preact/README.md

@@ -9,7 +9,7 @@ This example uses [Preact](https://github.com/preactjs/preact) instead of React.
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example using-preact using-preact-app
+npx create-next-app --example using-preact using-preact-app
 # or
 yarn create next-app --example using-preact using-preact-app
 ```

examples/using-router/README.md

@@ -18,7 +18,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example using-router using-router-app
+npx create-next-app --example using-router using-router-app
 # or
 yarn create next-app --example using-router using-router-app
 ```

examples/with-absolute-imports/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-absolute-imports with-absolute-imports-app
+npx create-next-app --example with-absolute-imports with-absolute-imports-app
 # or
 yarn create next-app --example with-absolute-imports with-absolute-imports-app
 ```

examples/with-algolia-react-instantsearch/README.md

@@ -9,7 +9,7 @@ The goal of this example is to illustrate how you can use [Algolia React Instant
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-algolia-react-instantsearch with-algolia-react-instantsearch-app
+npx create-next-app --example with-algolia-react-instantsearch with-algolia-react-instantsearch-app
 # or
 yarn create next-app --example with-algolia-react-instantsearch with-algolia-react-instantsearch-app
 ```

examples/with-ant-design-less/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-ant-design-less with-ant-design-app
+npx create-next-app --example with-ant-design-less with-ant-design-app
 # or
 yarn create next-app --example with-ant-design-less with-ant-design-app
 ```

examples/with-ant-design-mobile/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-ant-design-mobile with-ant-design-mobile-app
+npx create-next-app --example with-ant-design-mobile with-ant-design-mobile-app
 # or
 yarn create next-app --example with-ant-design-mobile with-ant-design-mobile-app
 ```

examples/with-ant-design-pro-layout-less/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-ant-design-pro-layout-less with-ant-design-app
+npx create-next-app --example with-ant-design-pro-layout-less with-ant-design-app
 # or
 yarn create next-app --example with-ant-design-pro-layout-less with-ant-design-app
 ```

examples/with-ant-design/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-ant-design with-ant-design-app
+npx create-next-app --example with-ant-design with-ant-design-app
 # or
 yarn create next-app --example with-ant-design with-ant-design-app
 ```

examples/with-aphrodite/README.md

@@ -17,7 +17,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-aphrodite with-aphrodite-app
+npx create-next-app --example with-aphrodite with-aphrodite-app
 # or
 yarn create next-app --example with-aphrodite with-aphrodite-app
 ```

examples/with-apollo-and-redux/README.md

@@ -17,7 +17,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-apollo-and-redux with-apollo-and-redux-app
+npx create-next-app --example with-apollo-and-redux with-apollo-and-redux-app
 # or
 yarn create next-app --example with-apollo-and-redux with-apollo-and-redux-app
 ```

examples/with-apollo/README.md

@@ -26,7 +26,7 @@ _Live Example: https://next-with-apollo.now.sh_
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-apollo with-apollo-app
+npx create-next-app --example with-apollo with-apollo-app
 # or
 yarn create next-app --example with-apollo with-apollo-app
 ```

examples/with-app-layout/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-app-layout with-app-layout-app
+npx create-next-app --example with-app-layout with-app-layout-app
 # or
 yarn create next-app --example with-app-layout with-app-layout-app
 ```

examples/with-astroturf/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-astroturf with-astroturf-app
+npx create-next-app --example with-astroturf with-astroturf-app
 # or
 yarn create next-app --example with-astroturf with-astroturf-app
 ```

examples/with-aws-amplify-typescript/README.md

@@ -17,7 +17,7 @@ Two routes are implemented :
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-aws-amplify-typescript nextjs-aws-amplify-typescript-app
+npx create-next-app --example with-aws-amplify-typescript nextjs-aws-amplify-typescript-app
 # or
 yarn create next-app --example with-aws-amplify-typescript nextjs-aws-amplify-typescript-app
 ```

examples/with-aws-amplify/README.md

@@ -16,7 +16,7 @@ Two routes are implemented :
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-aws-amplify nextjs-aws-amplify-app
+npx create-next-app --example with-aws-amplify nextjs-aws-amplify-app
 # or
 yarn create next-app --example with-aws-amplify nextjs-aws-amplify-app
 ```

examples/with-babel-macros/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-babel-macros with-babel-macros-app
+npx create-next-app --example with-babel-macros with-babel-macros-app
 # or
 yarn create next-app --example with-babel-macros with-babel-macros-app
 ```

examples/with-carbon-components/README.md

@@ -17,7 +17,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-carbon-components with-carbon-components-app
+npx create-next-app --example with-carbon-components with-carbon-components-app
 # or
 yarn create next-app --example with-carbon-components with-carbon-components-app
 ```

examples/with-cerebral/README.md

@@ -47,7 +47,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-cerebral with-cerebral-app
+npx create-next-app --example with-cerebral with-cerebral-app
 # or
 yarn create next-app --example with-cerebral with-cerebral-app
 ```

examples/with-chakra-ui/README.md

@@ -17,7 +17,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-chakra-ui with-chakra-ui-app
+npx create-next-app --example with-chakra-ui with-chakra-ui-app
 # or
 yarn create next-app --example with-chakra-ui with-chakra-ui-app
 ```

examples/with-context-api/README.md

@@ -23,7 +23,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-context-api with-context-api-app
+npx create-next-app --example with-context-api with-context-api-app
 # or
 yarn create next-app --example with-context-api with-context-api-app
 ```

examples/with-cookie-auth-fauna/README.md

@@ -17,7 +17,7 @@ The helper function `auth` helps to retrieve the token across pages and redirect
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-cookie-auth-fauna with-cookie-auth-fauna-app
+npx create-next-app --example with-cookie-auth-fauna with-cookie-auth-fauna-app
 # or
 yarn create next-app --example with-cookie-auth-fauna with-cookie-auth-fauna-app
 ```

examples/with-custom-babel-config/README.md

@@ -21,7 +21,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-custom-babel-config with-custom-babel-config-app
+npx create-next-app --example with-custom-babel-config with-custom-babel-config-app
 # or
 yarn create next-app --example with-custom-babel-config with-custom-babel-config-app
 ```

examples/with-custom-reverse-proxy/README.md

@@ -14,7 +14,7 @@ Sorry for the extra packages. I belong to the minority camp of writing ES6 code
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-custom-reverse-proxy with-custom-reverse-proxy-app
+npx create-next-app --example with-custom-reverse-proxy with-custom-reverse-proxy-app
 # or
 yarn create next-app --example with-custom-reverse-proxy with-custom-reverse-proxy-app
 ```

examples/with-cxs/README.md

@@ -17,7 +17,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-cxs with-cxs-app
+npx create-next-app --example with-cxs with-cxs-app
 # or
 yarn create next-app --example with-cxs with-cxs-app
 ```

examples/with-docker/README.md

@@ -13,7 +13,7 @@ You can check the [Example Dockerfile for your own Node.js project](https://gith
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-docker with-docker-app
+npx create-next-app --example with-docker with-docker-app
 # or
 yarn create next-app --example with-docker with-docker-app
 ```

examples/with-dotenv/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-dotenv with-dotenv-app
+npx create-next-app --example with-dotenv with-dotenv-app
 # or
 yarn create next-app --example with-dotenv with-dotenv-app
 ```

examples/with-draft-js/README.md

@@ -17,7 +17,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-draft-js
+npx create-next-app --example with-draft-js
 # or
 yarn create next-app --example with-draft-js with-draft-js-app
 ```

examples/with-dynamic-app-layout/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-dynamic-app-layout with-dynamic-app-layout-app
+npx create-next-app --example with-dynamic-app-layout with-dynamic-app-layout-app
 # or
 yarn create next-app --example with-dynamic-app-layout with-dynamic-app-layout-app
 ```

examples/with-dynamic-import/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-dynamic-import with-dynamic-import-app
+npx create-next-app --example with-dynamic-import with-dynamic-import-app
 # or
 yarn create next-app --example with-dynamic-import with-dynamic-import-app
 ```

examples/with-electron-typescript/README.md

@@ -19,7 +19,7 @@ For development it's going to run a HTTP server and let Next.js handle routing.
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-electron-typescript with-electron-typescript-app
+npx create-next-app --example with-electron-typescript with-electron-typescript-app
 # or
 yarn create next-app --example with-electron-typescript with-electron-typescript-app
 ```

examples/with-electron/README.md

@@ -13,7 +13,7 @@ For development it's going to run a HTTP server and let Next.js handle routing.
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-electron with-electron-app
+npx create-next-app --example with-electron with-electron-app
 # or
 yarn create next-app --example with-electron with-electron-app
 ```

examples/with-emotion-11/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-emotion-11 with-emotion-11-app
+npx create-next-app --example with-emotion-11 with-emotion-11-app
 # or
 yarn create next-app --example with-emotion-11 with-emotion-11-app
 ```

examples/with-emotion/README.md

@@ -19,7 +19,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-emotion-10 with-emotion-10-app
+npx create-next-app --example with-emotion-10 with-emotion-10-app
 # or
 yarn create next-app --example with-emotion-10 with-emotion-10-app
 ```

examples/with-env-from-next-config-js/README.md

@@ -25,7 +25,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-env-from-next-config-js
+npx create-next-app --example with-env-from-next-config-js
 # or
 yarn create next-app --example with-env-from-next-config-js
 ```

examples/with-fela/README.md

@@ -17,7 +17,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-fela with-fela-app
+npx create-next-app --example with-fela with-fela-app
 # or
 yarn create next-app --example with-fela with-fela-app
 ```

examples/with-firebase-cloud-messaging/README.md

@@ -9,7 +9,7 @@ To demo how to implement firebase cloud messaging to send web push notification
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-firebase-cloud-messaging with-firebase-cloud-messaging-app
+npx create-next-app --example with-firebase-cloud-messaging with-firebase-cloud-messaging-app
 # or
 yarn create next-app --example with-firebase-cloud-messaging with-firebase-cloud-messaging-app
 ```

examples/with-firebase-hosting/README.md

@@ -20,7 +20,7 @@ If you are having issues, feel free to tag @jthegedus in the [issue you create o
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-firebase-hosting with-firebase-hosting-app
+npx create-next-app --example with-firebase-hosting with-firebase-hosting-app
 # or
 yarn create next-app --example with-firebase-hosting with-firebase-hosting-app
 ```

examples/with-flow/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-flow with-flow-app
+npx create-next-app --example with-flow with-flow-app
 # or
 yarn create next-app --example with-flow with-flow-app
 ```

examples/with-framer-motion/README.md

@@ -17,7 +17,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-framer-motion with-framer-motion
+npx create-next-app --example with-framer-motion with-framer-motion
 # or
 yarn create next-app --example with-framer-motion with-framer-motion
 ```

examples/with-glamor/README.md

@@ -19,7 +19,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-glamor with-glamor-app
+npx create-next-app --example with-glamor with-glamor-app
 # or
 yarn create next-app --example with-glamor with-glamor-app
 ```

examples/with-google-analytics-amp/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example::
 
 ```bash
-npm init next-app --example with-google-analytics-amp with-google-analytics-amp-app
+npx create-next-app --example with-google-analytics-amp with-google-analytics-amp-app
 # or
 yarn create next-app --example with-google-analytics-amp with-google-analytics-amp-app
 ```

examples/with-google-analytics/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example::
 
 ```bash
-npm init next-app --example with-google-analytics with-google-analytics-app
+npx create-next-app --example with-google-analytics with-google-analytics-app
 # or
 yarn create next-app --example with-google-analytics with-google-analytics-app
 ```

examples/with-graphql-faunadb/README.md

@@ -37,7 +37,7 @@ At the end, the newly generated client token will be printed and should be used
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```
-npm init next-app --example with-graphql-faunadb with-graphql-faunadb
+npx create-next-app --example with-graphql-faunadb with-graphql-faunadb
 # or
 yarn create next-app --example with-graphql-faunadb with-graphql-faunadb
 ```

examples/with-graphql-hooks/README.md

@@ -21,7 +21,7 @@ _Live Example: https://next-with-graphql-hooks.now.sh_
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-graphql-hooks with-graphql-hooks-app
+npx create-next-app --example with-graphql-hooks with-graphql-hooks-app
 # or
 yarn create next-app --example with-graphql-hooks with-graphql-hooks-app
 ```

examples/with-graphql-react/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-graphql-react with-graphql-react-app
+npx create-next-app --example with-graphql-react with-graphql-react-app
 # or
 yarn create next-app --example with-graphql-react with-graphql-react-app
 ```

examples/with-grommet/README.md

@@ -17,7 +17,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-grommet with-grommet-app
+npx create-next-app --example with-grommet with-grommet-app
 # or
 yarn create next-app --example with-grommet with-grommet-app
 ```

examples/with-hls-js/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com/now):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-hls-js with-hls-js-app
+npx create-next-app --example with-hls-js with-hls-js-app
 # or
 yarn create next-app --example with-hls-js with-hls-js-app
 ```

examples/with-http2/README.md

@@ -9,7 +9,7 @@ This example shows the most basic example using an HTTP2 server. We have 2 pages
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-http2 with-http2-app
+npx create-next-app --example with-http2 with-http2-app
 # or
 yarn create next-app --example with-http2 with-http2-app
 ```

examples/with-i18n-rosetta/README.md

@@ -17,7 +17,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-i18n-rosetta with-i18n-rosetta
+npx create-next-app --example with-i18n-rosetta with-i18n-rosetta
 # or
 yarn create next-app --example with-i18n-rosetta with-i18n-rosetta
 ```

examples/with-kea/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-kea with-kea-app
+npx create-next-app --example with-kea with-kea-app
 # or
 yarn create next-app --example with-kea with-kea-app
 ```

examples/with-linaria/README.md

@@ -17,7 +17,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-linaria with-linaria-app
+npx create-next-app --example with-linaria with-linaria-app
 # or
 yarn create next-app --example with-linaria with-linaria-app
 ```

examples/with-lingui/README.md

@@ -19,7 +19,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-lingui with-lingui-app
+npx create-next-app --example with-lingui with-lingui-app
 # or
 yarn create next-app --example with-lingui with-lingui-app
 ```

examples/with-loading/README.md

@@ -23,7 +23,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-loading with-loading-app
+npx create-next-app --example with-loading with-loading-app
 # or
 yarn create next-app --example with-loading with-loading-app
 ```

examples/with-magic/README.md

@@ -21,7 +21,7 @@ Deploy the example using [Vercel Now](https://vercel.com/docs/now-cli#commands/o
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-magic with-magic-app
+npx create-next-app --example with-magic with-magic-app
 # or
 yarn create next-app --example with-magic with-magic-app
 ```

examples/with-mdx/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-mdx with-mdx-app
+npx create-next-app --example with-mdx with-mdx-app
 # or
 yarn create next-app --example with-mdx with-mdx-app
 ```

examples/with-mobx-react-lite/README.md

@@ -21,7 +21,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-mobx-react-lite with-mobx-react-lite-app
+npx create-next-app --example with-mobx-react-lite with-mobx-react-lite-app
 # or
 yarn create next-app --example with-mobx-react-lite with-mobx-react-lite-app
 ```

examples/with-mobx-state-tree-typescript/README.md

@@ -23,7 +23,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-mobx-state-tree-typescript with-mobx-state-tree-typescript-app
+npx create-next-app --example with-mobx-state-tree-typescript with-mobx-state-tree-typescript-app
 # or
 yarn create next-app --example with-mobx-state-tree-typescript with-mobx-state-tree-typescript-app
 ```

examples/with-mobx-state-tree/README.md

@@ -23,7 +23,7 @@ Deploy the example using [Vercel](https://vercel.com):
 Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
 
 ```bash
-npm init next-app --example with-mobx-state-tree with-mobx-state-tree-app
+npx create-next-app --example with-mobx-state-tree with-mobx-state-tree-app
 # or
 yarn create next-app --example with-mobx-state-tree with-mobx-state-tree-app
 ```