commerce
Next.js Commerce
File Explorer
- launch.json
- settings.json
- layout.tsx
- opengraph-image.tsx
- page.tsx
- route.ts
- page.tsx
- opengraph-image.tsx
- page.tsx
- children-wrapper.tsx
- layout.tsx
- loading.tsx
- page.tsx
- error.tsx
- favicon.ico
- globals.css
- layout.tsx
- opengraph-image.tsx
- page.tsx
- robots.ts
- sitemap.ts
- actions.ts
- add-to-cart.tsx
- cart-context.tsx
- delete-item-button.tsx
- edit-item-quantity-button.tsx
- modal.tsx
- open-cart.tsx
- index.tsx
- three-items.tsx
- tile.tsx
- logo.tsx
- index.tsx
- mobile-menu.tsx
- search.tsx
- dropdown.tsx
- index.tsx
- item.tsx
- collections.tsx
- footer-menu.tsx
- footer.tsx
- product-grid-items.tsx
- gallery.tsx
- product-description.tsx
- variant-selector.tsx
- carousel.tsx
- label.tsx
- loading-dots.tsx
- logo-square.tsx
- opengraph-image.tsx
- price.tsx
- prose.tsx
- welcome-toast.tsx
- Inter-Bold.ttf
- cart.ts
- image.ts
- product.ts
- seo.ts
- cart.ts
- cart.ts
- collection.ts
- menu.ts
- page.ts
- product.ts
- index.ts
- types.ts
- constants.ts
- type-guards.ts
- utils.ts
- .env.example
- .gitignore
- license.md
- next.config.ts
- package.json
- pnpm-lock.yaml
- postcss.config.mjs
- README.md
- tsconfig.json
# Installation Guide
node- Node.js >=18.0.0
- pnpm >=8.0.0
- Vercel CLI latest
Setup Steps
npm i -g vercel
Install Vercel CLI globally.
vercel link
Link the local project with Vercel and GitHub accounts.
vercel env pull
Download environment variables from Vercel.
pnpm install
Install project dependencies.
pnpm dev
Run the development server.
Key Commands
pnpm install
Install all project dependencies based on pnpm-lock.yaml.
pnpm dev
Start the Next.js development server to run the application locally.
# Use via CDN
jsDelivrjsDelivr serves any public GitHub repository as a CDN with zero setup. Pick a version and a file to get a ready-to-paste link and snippet.
Command Glossary
Commands referenced in this DOCs, explained below.
npm
View Details ▼
npm
JavaScript and Node.js package manager.
Manage Node.js projects and their module dependencies.
Some subcommands such as `install`, `run`, etc. have their own usage documentation.
npm init {{[-y|--yes]}}
Create a `package.json` file with default values (omit `--yes` to do it interactively):
npm {{[i|install]}}
Download all the packages listed as dependencies in `package.json`:
npm {{[i|install]}} {{package_name}}@{{version}}
Download a specific version of a package and add it to the list of dependencies in `package.json`:
pnpm
View Details ▼
pnpm
Fast, disk space efficient package manager for Node.js.
Manage Node.js projects and their module dependencies.
pnpm init
Create a `package.json` file:
pnpm {{[i|install]}}
Download all the packages listed as dependencies in `package.json`:
pnpm add {{module_name}}@{{version}}
Download a specific version of a package and add it to the list of dependencies in `package.json`:
vercel
View Details ▼
vercel
Deploy and manage your Vercel deployments.
vercel
Deploy the current directory:
vercel --prod
Deploy the current directory to production:
vercel {{path/to/project}}
Deploy a directory:
