diff --git a/examples/api-routes-apollo-server-and-client-auth/README.md b/examples/api-routes-apollo-server-and-client-auth/README.md index 5a543e9792c018..947cb4ba9b3644 100644 --- a/examples/api-routes-apollo-server-and-client-auth/README.md +++ b/examples/api-routes-apollo-server-and-client-auth/README.md @@ -12,7 +12,7 @@ Deploy the example using [Vercel](https://vercel.com?utm_source=github&utm_mediu ## How to use -Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) or [npx](https://github.com/zkat/npx#readme) to bootstrap the example: +Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example: ```bash npx create-next-app --example api-routes-apollo-server-and-client-auth api-routes-apollo-server-and-client-auth-app diff --git a/examples/cache-handler-redis/README.md b/examples/cache-handler-redis/README.md index 35b426a9697010..ba099358ef24cd 100644 --- a/examples/cache-handler-redis/README.md +++ b/examples/cache-handler-redis/README.md @@ -9,7 +9,6 @@ Check out this [repository](https://github.com/ezeparziale/nextjs-k8s) that cont Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example: ```bash - npx create-next-app --example cache-handler-redis cache-handler-redis-app ``` diff --git a/examples/cms-prepr/README.md b/examples/cms-prepr/README.md index 1c860e3896c5a0..6d19e516907cc9 100644 --- a/examples/cms-prepr/README.md +++ b/examples/cms-prepr/README.md @@ -11,7 +11,7 @@ Check out our Blog page example: ## How to use -Run one of the following [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) commands using [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to create a new Next.js app and connect it to Prepr: +Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example: ```bash npx create-next-app --example cms-prepr cms-prepr-app diff --git a/examples/cms-sitecore-xmcloud/README.md b/examples/cms-sitecore-xmcloud/README.md index 317783e4eb6a72..404df3bf1a0bb3 100644 --- a/examples/cms-sitecore-xmcloud/README.md +++ b/examples/cms-sitecore-xmcloud/README.md @@ -52,11 +52,11 @@ npx create-next-app --example cms-sitecore-xmcloud cms-sitecore-xmcloud-app ``` ```bash -yarn create-next-app --example cms-sitecore-xmcloud cms-sitecore-xmcloud-app +yarn create next-app --example cms-sitecore-xmcloud cms-sitecore-xmcloud-app ``` ```bash -pnpm create-next-app --example cms-sitecore-xmcloud cms-sitecore-xmcloud-app +pnpm create next-app --example cms-sitecore-xmcloud cms-sitecore-xmcloud-app ``` ## Configuration diff --git a/examples/environment-variables/readme.md b/examples/environment-variables/README.md similarity index 100% rename from examples/environment-variables/readme.md rename to examples/environment-variables/README.md diff --git a/examples/github-pages/README.md b/examples/github-pages/README.md index ac413d4ef46fa7..8427f8813301a6 100644 --- a/examples/github-pages/README.md +++ b/examples/github-pages/README.md @@ -9,11 +9,15 @@ The `out` directory should not be ignored by version control. Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example: ```bash -npx create-next-app --example github-pages nextjs-github-pages -# or -yarn create next-app --example github-pages nextjs-github-pages -# or -pnpm create next-app --example github-pages nextjs-github-pages +npx create-next-app --example github-pages github-pages-app +``` + +```bash +yarn create next-app --example github-pages github-pages-app +``` + +```bash +pnpm create next-app --example github-pages github-pages-app ``` ### Deploy to GitHub Pages diff --git a/examples/server-actions-upload/README.md b/examples/server-actions-upload/README.md index d09f9c2af6b017..cd2fbe87f6a51b 100644 --- a/examples/server-actions-upload/README.md +++ b/examples/server-actions-upload/README.md @@ -11,15 +11,15 @@ This example shows how you can build upload forms with Next.js and Server Action Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example: ```bash -npx create-next-app --example server-actions-upload next-upload-app +npx create-next-app --example server-actions-upload server-actions-upload-app ``` ```bash -yarn create next-app --example server-actions-upload next-upload-app +yarn create next-app --example server-actions-upload server-actions-upload-app ``` ```bash -pnpm create next-app --example server-actions-upload next-upload-app +pnpm create next-app --example server-actions-upload server-actions-upload-app ``` Deploy it to the cloud with [Vercel](https://vercel.com/new?utm_source=github&utm_medium=readme&utm_campaign=next-example) ([Documentation](https://nextjs.org/docs/deployment)). diff --git a/examples/with-algolia-react-instantsearch/README.md b/examples/with-algolia-react-instantsearch/README.md index ac60157e8ec696..d15f2c77ef80f1 100644 --- a/examples/with-algolia-react-instantsearch/README.md +++ b/examples/with-algolia-react-instantsearch/README.md @@ -25,7 +25,7 @@ pnpm create next-app --example with-algolia-react-instantsearch with-algolia-rea ``` ```bash -bun create next-app --example with-algolia-react-instantsearch with-algolia-react-instantsearch-app +bunx create-next-app --example with-algolia-react-instantsearch with-algolia-react-instantsearch-app ``` This example is already configured with an e-commerce index, but you can easily customize it by: diff --git a/examples/with-apivideo/README.md b/examples/with-apivideo/README.md index f71da89c0f4427..14253e1085d85b 100644 --- a/examples/with-apivideo/README.md +++ b/examples/with-apivideo/README.md @@ -17,15 +17,15 @@ Deploy the example using [Vercel](https://vercel.com?utm_source=github&utm_mediu Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example: ```bash -npx create-next-app --example with-apivideo +npx create-next-app --example with-apivideo with-apivideo-app ``` ```bash -yarn create next-app --example with-apivideo +yarn create next-app --example with-apivideo with-apivideo-app ``` ```bash -pnpm create next-app --example with-apivideo +pnpm create next-app --example with-apivideo with-apivideo-app ``` Deploy it to the cloud with [Vercel](https://vercel.com/new?utm_source=github&utm_medium=readme&utm_campaign=next-example) ([Documentation](https://nextjs.org/docs/deployment)). diff --git a/examples/with-axiom/README.md b/examples/with-axiom/README.md index 37dfbf4556b35a..ca9e6f31874abc 100644 --- a/examples/with-axiom/README.md +++ b/examples/with-axiom/README.md @@ -12,7 +12,7 @@ Check out our [Next.js deployment documentation](https://nextjs.org/docs/deploym ## How to use -Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example:: +Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example: ```bash npx create-next-app --example with-axiom with-axiom-app diff --git a/examples/with-cloudinary/README.md b/examples/with-cloudinary/README.md index 02adea17724b6a..ce0aa450eb456d 100644 --- a/examples/with-cloudinary/README.md +++ b/examples/with-cloudinary/README.md @@ -12,18 +12,18 @@ Check out our [Next.js deployment documentation](https://nextjs.org/docs/deploym ## How to use -Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example:: +Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example: ```bash - npx create-next-app --example with-cloudinary nextjs-image-gallery +npx create-next-app --example with-cloudinary with-cloudinary-app ``` ```bash -yarn create next-app --example with-cloudinary nextjs-image-gallery +yarn create next-app --example with-cloudinary with-cloudinary-app ``` ```bash -pnpm create next-app --example with-cloudinary nextjs-image-gallery +pnpm create next-app --example with-cloudinary with-cloudinary-app ``` ## References diff --git a/examples/with-fauna/README.md b/examples/with-fauna/README.md index 651367bfe66600..a85a6b0aecbba8 100644 --- a/examples/with-fauna/README.md +++ b/examples/with-fauna/README.md @@ -12,15 +12,17 @@ Deploy the example using [Vercel](https://vercel.com?utm_source=github&utm_mediu Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example: -``` +```bash npx create-next-app --example with-fauna with-fauna-app -# or +``` + +```bash yarn create next-app --example with-fauna with-fauna-app -# or -pnpm create next-app --example with-fauna with-fauna-app ``` -You can start with this template [using `create-next-app`](#using-create-next-app) or by [downloading the repository manually](#download-manually). +```bash +pnpm create next-app --example with-fauna with-fauna-app +``` ### Setting Up Your Fauna Database diff --git a/examples/with-i18n-next-intl/README.md b/examples/with-i18n-next-intl/README.md index b441bf3352b685..a78baebcc643cd 100644 --- a/examples/with-i18n-next-intl/README.md +++ b/examples/with-i18n-next-intl/README.md @@ -21,11 +21,15 @@ Deploy the example using [Vercel](https://vercel.com) or preview live with [Stac Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example: ```bash -npx create-next-app --example with-i18n-next-intl -# or -yarn create next-app --example with-i18n-next-intl -# or -pnpm create next-app --example with-i18n-next-intl +npx create-next-app --example with-i18n-next-intl with-i18n-next-intl-app +``` + +```bash +yarn create next-app --example with-i18n-next-intl with-i18n-next-intl-app +``` + +```bash +pnpm create next-app --example with-i18n-next-intl with-i18n-next-intl-app ``` Deploy it to the cloud with [Vercel](https://vercel.com/import?filter=next.js&utm_source=github&utm_medium=readme&utm_campaign=next-example) ([Documentation](https://nextjs.org/docs/deployment)). diff --git a/examples/with-ionic-typescript/README.md b/examples/with-ionic-typescript/README.md index 2f20af70102edf..0ec8f6b5be0dc9 100644 --- a/examples/with-ionic-typescript/README.md +++ b/examples/with-ionic-typescript/README.md @@ -10,7 +10,7 @@ Deploy the example using [Vercel](https://vercel.com?utm_source=github&utm_mediu ## How to use -Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) or [npx](https://github.com/zkat/npx#readme) to bootstrap the example: +Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example: ```bash npx create-next-app --example with-ionic-typescript with-ionic-typescript-app diff --git a/examples/with-jest-babel/README.md b/examples/with-jest-babel/README.md index 817c604e0abc4c..1f6ee48ef85e33 100644 --- a/examples/with-jest-babel/README.md +++ b/examples/with-jest-babel/README.md @@ -6,9 +6,7 @@ This includes Next.js' built-in support for Global CSS, CSS Modules and TypeScri ## How to Use -Quickly get started using [Create Next App](https://github.com/vercel/next.js/tree/canary/packages/create-next-app#readme)! - -In your terminal, run the following command: +Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example: ```bash npx create-next-app --example with-jest-babel with-jest-babel-app @@ -27,3 +25,13 @@ pnpm create next-app --example with-jest-babel with-jest-babel-app ```bash npm test ``` + +```bash +yarn test +``` + +```bash +pnpm test +``` + +Deploy it to the cloud with [Vercel](https://vercel.com/new?utm_source=github&utm_medium=readme&utm_campaign=next-example) ([Documentation](https://nextjs.org/docs/deployment)). \ No newline at end of file diff --git a/examples/with-jest/README.md b/examples/with-jest/README.md index 9eb09468833f95..e0f6c95c1b14df 100644 --- a/examples/with-jest/README.md +++ b/examples/with-jest/README.md @@ -12,9 +12,7 @@ This includes Next.js' built-in support for Global CSS, CSS Modules and TypeScri ## How to Use -Quickly get started using [Create Next App](https://github.com/vercel/next.js/tree/canary/packages/create-next-app#readme)! - -In your terminal, run the following command: +Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example: ```bash npx create-next-app --example with-jest with-jest-app @@ -33,3 +31,13 @@ pnpm create next-app --example with-jest with-jest-app ```bash npm test ``` + +```bash +yarn test +``` + +```bash +pnpm test +``` + +Deploy it to the cloud with [Vercel](https://vercel.com/new?utm_source=github&utm_medium=readme&utm_campaign=next-example) ([Documentation](https://nextjs.org/docs/deployment)). \ No newline at end of file diff --git a/examples/with-knex/README.md b/examples/with-knex/README.md index 3aa5f7a60d7212..205f9c81b4bc2e 100644 --- a/examples/with-knex/README.md +++ b/examples/with-knex/README.md @@ -32,6 +32,8 @@ pnpm create next-app --example with-knex with-knex-app npm install # or yarn +# or +pnpm install ``` ### Set up a Postgres database @@ -56,6 +58,8 @@ You can create, apply and rollback migrations using the scripts in `package.json npm run migrate:latest # or yarn migrate:latest +# or +pnpm migrate:latest ``` ### Start Next.js in development mode @@ -64,6 +68,8 @@ yarn migrate:latest npm run dev # or yarn dev +# or +pnpm dev ``` Your app should now be up and running on [http://localhost:3000](http://localhost:3000)! If it doesn't work, post on [GitHub discussions](https://github.com/vercel/next.js/discussions). diff --git a/examples/with-magic/README.md b/examples/with-magic/README.md index 40359e1e809cec..29dc42afeb20f9 100644 --- a/examples/with-magic/README.md +++ b/examples/with-magic/README.md @@ -54,6 +54,8 @@ Now, run Next.js in development mode npm run dev # or yarn dev +# or +pnpm dev ``` Your app should be up and running on [http://localhost:3000](http://localhost:3000)! If it doesn't work, post on [GitHub discussions](https://github.com/vercel/next.js/discussions). diff --git a/examples/with-mocha/README.md b/examples/with-mocha/README.md index 122989f6a2dcbe..0620b707d2a3ee 100644 --- a/examples/with-mocha/README.md +++ b/examples/with-mocha/README.md @@ -30,6 +30,8 @@ pnpm create next-app --example with-mocha with-mocha-app npm run test # or yarn test +# or +pnpm test ``` > A very important part of this example is the `.babelrc` file which configures the `test` environment to use `babel-preset-env` and configures it to transpile modules to `commonjs`). [Learn more](https://github.com/vercel/next.js/issues/2895). diff --git a/examples/with-mongodb-mongoose/README.md b/examples/with-mongodb-mongoose/README.md index 2e7bcd41f52e3f..105b60ed407580 100644 --- a/examples/with-mongodb-mongoose/README.md +++ b/examples/with-mongodb-mongoose/README.md @@ -55,11 +55,12 @@ Then set each variable on `.env.local`: ```bash npm install npm run dev - # or - yarn install yarn dev +# or +pnpm install +pnpm dev ``` Your app should be up and running on [http://localhost:3000](http://localhost:3000)! If it doesn't work, post on [GitHub discussions](https://github.com/vercel/next.js/discussions). diff --git a/examples/with-mongodb/README.md b/examples/with-mongodb/README.md index ab5d7efaccb3a5..183ca9ab87b942 100644 --- a/examples/with-mongodb/README.md +++ b/examples/with-mongodb/README.md @@ -52,11 +52,12 @@ Set each variable on `.env.local`: ```bash npm install npm run dev - # or - yarn install yarn dev +# or +pnpm install +pnpm dev ``` Your app should be up and running on [http://localhost:3000](http://localhost:3000)! If it doesn't work, post on [GitHub discussions](https://github.com/vercel/next.js/discussions). diff --git a/examples/with-msw/README.md b/examples/with-msw/README.md index 669fc850f05ace..8276517878d2f1 100644 --- a/examples/with-msw/README.md +++ b/examples/with-msw/README.md @@ -16,6 +16,14 @@ The service worker file will automatically be generated in `public/mockServiceWo npx msw init public/ ``` +```bash +yarn msw init public/ +``` + +```bash +pnpm msw init public/ +``` + More information on this setup step can be found in the MSW documentation [here](https://mswjs.io/docs/getting-started/integrate/browser#setup). ## Deploy your own diff --git a/examples/with-mux-video/README.md b/examples/with-mux-video/README.md index ad184d22d29897..51caadd15b6306 100644 --- a/examples/with-mux-video/README.md +++ b/examples/with-mux-video/README.md @@ -17,7 +17,7 @@ Deploy the example using [Vercel](https://vercel.com/home): ### Step 1. Create a Next app with this example -Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example: +Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), [pnpm](https://pnpm.io), or [Bun](https://bun.sh/docs/cli/bunx) to bootstrap the example: ```bash npx create-next-app --example with-mux-video with-mux-video-app diff --git a/examples/with-mysql/README.md b/examples/with-mysql/README.md index dbd749c3c27c89..2e9c12f712374a 100644 --- a/examples/with-mysql/README.md +++ b/examples/with-mysql/README.md @@ -73,17 +73,47 @@ mysql://:@/?sslac Push the database schema to your PlanetScale database using Prisma. -`npx prisma db push` +```bash +npx prisma db push +``` + +```bash +yarn prisma db push +``` + +```bash +pnpm prisma +``` Run the seed script to populate your database with `Product` and `Category` data. -`npm run seed` +```bash +npm run seed +``` + +```bash +yarn seed +``` + +```bash +pnpm seed +``` ## Run the App Run the app with following command: -`npm run dev` +```bash +npm run dev +``` + +```bash +yarn dev +``` + +```bash +pnpm dev +``` Open your browser at [localhost:3000](localhost:3000) to see the running application. diff --git a/examples/with-next-sass/README.md b/examples/with-next-sass/README.md index 02a509cc69b049..8428d171d29988 100644 --- a/examples/with-next-sass/README.md +++ b/examples/with-next-sass/README.md @@ -32,6 +32,9 @@ npm run start # or yarn build yarn start +# or +pnpm build +pnpm start ``` Deploy it to the cloud with [Vercel](https://vercel.com/new?utm_source=github&utm_medium=readme&utm_campaign=next-example) ([Documentation](https://nextjs.org/docs/deployment)). diff --git a/examples/with-nhost-auth-realtime-graphql/README.md b/examples/with-nhost-auth-realtime-graphql/README.md index a0ab27f8404267..f6f00c0d623950 100644 --- a/examples/with-nhost-auth-realtime-graphql/README.md +++ b/examples/with-nhost-auth-realtime-graphql/README.md @@ -49,11 +49,12 @@ Copy `.env.local.example` to `.env.local` and update the two URLs with your Nhos ```bash npm install npm run dev - # or - yarn install yarn dev +# or +pnpm install +pnpm dev ``` Your app should be up and running on [http://localhost:3000](http://localhost:3000)! If it doesn't work, post on [GitHub discussions](https://github.com/vercel/next.js/discussions). diff --git a/examples/with-plausible/README.md b/examples/with-plausible/README.md index a0e677a09cf7d1..435f24c52ed6f0 100644 --- a/examples/with-plausible/README.md +++ b/examples/with-plausible/README.md @@ -10,7 +10,7 @@ Deploy the example using [Vercel](https://vercel.com?utm_source=github&utm_mediu ## How to use -Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example:: +Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example: ```bash npx create-next-app --example with-plausible with-plausible-app diff --git a/examples/with-relay-modern/README.md b/examples/with-relay-modern/README.md index 4c7b33bf9eeb4b..17af683d3b161b 100644 --- a/examples/with-relay-modern/README.md +++ b/examples/with-relay-modern/README.md @@ -32,6 +32,8 @@ Download schema introspection data from configured Relay endpoint npm run schema # or yarn schema +# or +pnpm schema ``` Run Relay ahead-of-time compilation (should be re-run after any edits to components that query data with Relay) @@ -40,6 +42,8 @@ Run Relay ahead-of-time compilation (should be re-run after any edits to compone npm run relay # or yarn relay +# or +pnpm relay ``` Run the project @@ -48,6 +52,8 @@ Run the project npm run dev # or yarn dev +# or +pnpm dev ``` Deploy it to the cloud with [Vercel](https://vercel.com/new?utm_source=github&utm_medium=readme&utm_campaign=next-example) ([Documentation](https://nextjs.org/docs/deployment)). diff --git a/examples/with-rematch/README.md b/examples/with-rematch/README.md index 07eab6458c0601..0df950b76e9529 100644 --- a/examples/with-rematch/README.md +++ b/examples/with-rematch/README.md @@ -12,7 +12,7 @@ Deploy the example using [Vercel](https://vercel.com?utm_source=github&utm_mediu ## How to use -Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example:: +Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example: ```bash npx create-next-app --example with-rematch with-rematch-app diff --git a/examples/with-sfcc/README.md b/examples/with-sfcc/README.md index 302f036265d9be..41f9b6df18902d 100644 --- a/examples/with-sfcc/README.md +++ b/examples/with-sfcc/README.md @@ -12,7 +12,7 @@ Check out our [Next.js deployment documentation](https://nextjs.org/docs/deploym ## How to use -Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example:: +Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example: ```bash npx create-next-app --example with-sfcc nextjs-sfcc-app diff --git a/examples/with-slate/README.md b/examples/with-slate/README.md index 5e7e7549538803..73e1241bb68116 100644 --- a/examples/with-slate/README.md +++ b/examples/with-slate/README.md @@ -10,7 +10,7 @@ Deploy the example using [Vercel](https://vercel.com?utm_source=github&utm_mediu ## How to use -Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example:: +Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example: ```bash npx create-next-app --example with-slate with-slate-app diff --git a/examples/with-stencil/README.md b/examples/with-stencil/README.md index 8c6957e8077756..011f4b7fdcf67f 100644 --- a/examples/with-stencil/README.md +++ b/examples/with-stencil/README.md @@ -8,7 +8,7 @@ Deploy the example using [Vercel](https://vercel.com?utm_source=github&utm_mediu ## How to use -Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) or [npx](https://github.com/zkat/npx#readme) to bootstrap the example: +Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example: ```bash npx create-next-app --example with-stencil with-stencil-app diff --git a/examples/with-stitches/README.md b/examples/with-stitches/README.md index e7336716a22ea2..59b6fd4f33a5f1 100644 --- a/examples/with-stitches/README.md +++ b/examples/with-stitches/README.md @@ -10,7 +10,7 @@ Deploy the example using [Vercel](https://vercel.com?utm_source=github&utm_mediu ## How to use -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: +Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example: ```bash npx create-next-app --example with-stitches with-stitches-app diff --git a/examples/with-storybook-styled-jsx-scss/README.md b/examples/with-storybook-styled-jsx-scss/README.md index 1a26fb5e27ce25..86785597b2b24e 100644 --- a/examples/with-storybook-styled-jsx-scss/README.md +++ b/examples/with-storybook-styled-jsx-scss/README.md @@ -30,6 +30,8 @@ pnpm create next-app --example with-storybook-styled-jsx-scss with-storybook-sty npm run storybook # or yarn storybook +# or +pnpm storybook ``` ### Build Static Storybook @@ -38,6 +40,8 @@ yarn storybook npm run build-storybook # or yarn build-storybook +# or +pnpm build-storybook ``` You can use [Vercel](https://vercel.com/new?utm_source=github&utm_medium=readme&utm_campaign=next-example) to deploy Storybook. Specify `storybook-static` as the output directory. diff --git a/examples/with-storybook/README.md b/examples/with-storybook/README.md index c946e740cb7352..ed68401d63d7e8 100644 --- a/examples/with-storybook/README.md +++ b/examples/with-storybook/README.md @@ -34,6 +34,8 @@ pnpm create next-app --example with-storybook with-storybook-app npm run storybook # or yarn storybook +# or +pnpm storybook ``` ### Build Static Storybook @@ -42,6 +44,8 @@ yarn storybook npm run build-storybook # or yarn build-storybook +# or +pnpm build-storybook ``` You can use [Vercel](https://vercel.com/new?utm_source=github&utm_medium=readme&utm_campaign=next-example) to deploy Storybook. Specify `storybook-static` as the output directory. diff --git a/examples/with-stripe-typescript/README.md b/examples/with-stripe-typescript/README.md index 03daf75c95090a..19807d7fac4b58 100644 --- a/examples/with-stripe-typescript/README.md +++ b/examples/with-stripe-typescript/README.md @@ -88,6 +88,9 @@ npm run dev # or yarn yarn dev +# or +pnpm install +pnpm dev ``` ### Forward webhooks to your local dev server diff --git a/examples/with-supertokens/README.md b/examples/with-supertokens/README.md index 938e2039c60ba3..faed4279e79c97 100644 --- a/examples/with-supertokens/README.md +++ b/examples/with-supertokens/README.md @@ -20,10 +20,6 @@ yarn create next-app --example with-supertokens with-supertokens-app pnpm create next-app --example with-supertokens with-supertokens-app ``` -- Run `yarn install` - -- Run `npm run dev` to start the application on `http://localhost:3000`. - ### Using `create-supertokens-app` - Run the following command @@ -32,6 +28,14 @@ pnpm create next-app --example with-supertokens with-supertokens-app npx create-supertokens-app@latest --frontend=next ``` +```bash +yarn create-supertokens-app@latest --frontend=next +``` + +```bash +pnpm create-supertokens-app@latest --frontend=next +``` + - Select the option to use the app directory Follow the instructions after `create-supertokens-app` has finished diff --git a/examples/with-turso/README.md b/examples/with-turso/README.md index e816390c961d07..27a37495ee62eb 100644 --- a/examples/with-turso/README.md +++ b/examples/with-turso/README.md @@ -41,7 +41,7 @@ yarn install yarn dev # or -# + pnpm install pnpm dev ``` diff --git a/examples/with-typescript/README.md b/examples/with-typescript/README.md index ab836853ea56a6..34802439100597 100644 --- a/examples/with-typescript/README.md +++ b/examples/with-typescript/README.md @@ -30,16 +30,32 @@ Deploy it to the cloud with [Vercel](https://vercel.com/new?utm_source=github&ut This example shows how to integrate the TypeScript type system into Next.js. Since TypeScript is supported out of the box with Next.js, all we have to do is to install TypeScript. -``` +```shell npm install --save-dev typescript ``` -To enable TypeScript's features, we install the type declarations for React and Node. +```shell +yarn install --save-dev typescript +``` +```shell +pnpm install --save-dev typescript ``` + +To enable TypeScript's features, we install the type declarations for React and Node. + +```shell npm install --save-dev @types/react @types/react-dom @types/node ``` +```shell +yarn install --save-dev @types/react @types/react-dom @types/node +``` + +```shell +pnpm install --save-dev @types/react @types/react-dom @types/node +``` + When we run `next dev` the next time, Next.js will start looking for any `.ts` or `.tsx` files in our project and builds it. It even automatically creates a `tsconfig.json` file for our project with the recommended settings. Next.js has built-in TypeScript declarations, so we'll get autocompletion for Next.js' modules straight away. diff --git a/examples/with-unsplash/README.md b/examples/with-unsplash/README.md index a6344c1c678b17..6f99b3cb9274a1 100644 --- a/examples/with-unsplash/README.md +++ b/examples/with-unsplash/README.md @@ -64,11 +64,12 @@ Then set each variable on `.env.local`: ```bash npm install npm run dev - # or - yarn install yarn dev +# or +pnpm install +pnpm dev ``` Your app should be up and running on [http://localhost:3000](http://localhost:3000)! If it doesn't work, post on [GitHub discussions](https://github.com/vercel/next.js/discussions). diff --git a/examples/with-userbase/README.md b/examples/with-userbase/README.md index beae878b3c868f..7802ee9c9c38a3 100644 --- a/examples/with-userbase/README.md +++ b/examples/with-userbase/README.md @@ -53,11 +53,12 @@ NEXT_PUBLIC_USERBASE_APP_ID=... ```bash npm install npm run dev - # or - yarn install yarn dev +# or +pnpm install +pnpm dev ``` Your todo app should be up and running on [http://localhost:3000](http://localhost:3000)! If it doesn't work, post on [GitHub discussions](https://github.com/vercel/next.js/discussions). diff --git a/examples/with-videojs/README.md b/examples/with-videojs/README.md index ff4786bfaee763..6a8487589039ac 100644 --- a/examples/with-videojs/README.md +++ b/examples/with-videojs/README.md @@ -10,7 +10,7 @@ Deploy the example using [Vercel](https://vercel.com?utm_source=github&utm_mediu ## How to use -Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example:: +Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example: ```bash npx create-next-app --example with-videojs with-videojs-app diff --git a/examples/with-vitest/README.md b/examples/with-vitest/README.md index d1715cea057b0b..ec6da46cc027b0 100644 --- a/examples/with-vitest/README.md +++ b/examples/with-vitest/README.md @@ -33,3 +33,13 @@ Deploy it to the cloud with [Vercel](https://vercel.com/new?utm_source=github&ut ```bash npm test ``` + +```bash +yarn test +``` + +```bash +pnpm test +``` + +Deploy it to the cloud with [Vercel](https://vercel.com/new?utm_source=github&utm_medium=readme&utm_campaign=next-example) ([Documentation](https://nextjs.org/docs/deployment)). diff --git a/examples/with-xstate/README.md b/examples/with-xstate/README.md index 73e59cb5929028..57f661c2c099d7 100644 --- a/examples/with-xstate/README.md +++ b/examples/with-xstate/README.md @@ -34,6 +34,8 @@ You could use the inspection tools for XState: ([`@xstate/inspect`](https://xsta npm install @xstate/inspect # or yarn add @xstate/inspect +# or +pnpm add @xstate/inspect ``` #### Import it at the top of the project diff --git a/examples/with-zones/README.md b/examples/with-zones/README.md index 798fec5c1a0fdf..7bf4a4f42bcc24 100644 --- a/examples/with-zones/README.md +++ b/examples/with-zones/README.md @@ -41,6 +41,9 @@ npm install && npm run dev # or cd home yarn && yarn dev +# or +cd home +pnpm install && pnpm dev ``` The `/home` app should be up and running in [http://localhost:3000](http://localhost:3000)! @@ -53,6 +56,9 @@ npm install && npm run dev # or cd blog yarn && yarn dev +# or +cd blog +pnpm install && pnpm dev ``` The `blog` app should be up and running in [http://localhost:4000/blog](http://localhost:4000/blog)!