This is a Next.js app made explicitly for Payload's E-Commerce Template.
Key features:
- Payload, Next.js, GraphQL, TypeScript
- Complete authentication workflow
- Complete shopping experience
- Full shopping cart implementation
- Full checkout workflow
- Stripe integration
- Account dashboard
- Pre-made layout building blocks
- Payload Admin Bar
- Complete SEO solution
- Paywall support
First you'll need a running CMS. If you have not done so already, clone the CMS repo and follow the setup instructions. Take note of your server URL, you'll need this in the next step.
First, get your environment setup:
- First copy the example
.env
file as your own:cp .env.example .env
- Then open the
.env
file and paste your Payload server URL:NEXT_PUBLIC_CMS_URL=http://localhost:8000
First, run the development server:
npm run dev
# or
yarn dev
Open http://localhost:3000 with your browser to see the result.
You can start editing the page by modifying the documents within your CMS.
To learn more about PayloadCMS and Next.js, take a look at the following resources:
- Payload CMS Documentation - learn about Payload CMS features and API.
- Payload GraphQL Documentation - Payload's GraphQL documentation.
- Next.js Documentation - learn about Next.js features and API.
- Learn Next.js - an interactive Next.js tutorial.
- Payload+Next.js Auth Frontend Demo - Payload's demo of how to authenticate Next.js apps
- Payload Admin Bar - A React component used to easily navigate to and from Payload
You can check out the Payload CMS GitHub repository as well as the Next.js GitHub repository - your feedback and contributions are welcome!
The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.
Check out our Payload CMS deployment documentation or the Next.js deployment documentation for more details.