{"id":16795834,"url":"https://github.com/mrvautin/nextjs-checkout","last_synced_at":"2025-08-08T19:24:33.264Z","repository":{"id":174352845,"uuid":"622040447","full_name":"mrvautin/nextjs-checkout","owner":"mrvautin","description":"A superfast shopping cart built with Next.js and Prisma.","archived":false,"fork":false,"pushed_at":"2024-05-12T06:04:58.000Z","size":3552,"stargazers_count":11,"open_issues_count":1,"forks_count":10,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-03-18T06:51:29.014Z","etag":null,"topics":["cart","javascript","nextjs","reactjs","shopping-cart","typescript"],"latest_commit_sha":null,"homepage":"https://nextjs-checkout.markmoffat.com","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/mrvautin.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-04-01T00:38:33.000Z","updated_at":"2024-10-30T04:37:10.000Z","dependencies_parsed_at":"2024-01-06T05:30:07.111Z","dependency_job_id":"160920e3-daf6-4bb7-8b63-43504123cd1c","html_url":"https://github.com/mrvautin/nextjs-checkout","commit_stats":null,"previous_names":["mrvautin/nextjs-checkout"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mrvautin%2Fnextjs-checkout","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mrvautin%2Fnextjs-checkout/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mrvautin%2Fnextjs-checkout/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mrvautin%2Fnextjs-checkout/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mrvautin","download_url":"https://codeload.github.com/mrvautin/nextjs-checkout/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244893382,"owners_count":20527583,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["cart","javascript","nextjs","reactjs","shopping-cart","typescript"],"created_at":"2024-10-13T09:17:32.555Z","updated_at":"2025-03-22T01:30:58.211Z","avatar_url":"https://github.com/mrvautin.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# nextjs-checkout\n\nA superfast shopping cart built with [Next.js](https://nextjs.org/) and [Prisma](https://www.prisma.io). Supports [Stripe](https://stripe.com/), [Verifone](https://verifone.cloud/) and [Square (beta)](https://squareup.com/) payment gateways + the addition of payment gateways using modular design.\n\n![nextjs-checkout screenshot](https://nextjs-checkout.markmoffat.com/screenshot.jpg)\n\n## Demo\n\nYou can see a working demo here: [https://nextjs-checkout.markmoffat.com](https://nextjs-checkout.markmoffat.com)\n\n## Development\n\n### Installing\n\nRun command: `yarn install`\n\n### Starting dev\n\nRun command: `yarn run dev`\n\n### Building\n\nRun command: `yarn run build`\n\n### Testing\n\nRun command: `yarn run test`\n\n### Linting\n\nRun command: `yarn run lint`\n\n## Config\n\n`nextjs-checkout` uses [Next.js](https://nextjs.org/) config which uses `.env` files.\n\nThis means you able able to use multiple config files for your different environments. `.env` as base then `.env.development` and `.env.production`. For secrets, you can store them in `.env.local`.\n\n\u003e Note: .env, .env.development, and .env.production files should be included in your repository as they define defaults. .env*.local should be added to .gitignore, as those files are intended to be ignored. .env.local is where secrets can be stored.\n\n## Admin\n\nThe admin portal is access via `/admin` (eg: `http://localhost:3000/admin`). Authentication uses [Github](https://github.com/mrvautin/nextjs-checkout?tab=readme-ov-file#github-authentication) by default but this can be extended using [NextAuth.js](https://next-auth.js.org/) setting your chosen  provider in `/pages/api/auth/[...nextauth].ts`.\n\n#### Github authentication\n\nYou will need to setup a new app in Github.\n\n1. Visit [Github apps](https://github.com/settings/apps)\n2. Click `New Github App`\n3. Enter the name of the app\n4. Enter the homepage URL of your website\n5. In the `Callback URL` enter your domain followed by `/api/auth/callback/github`. For example: `https://example.com/api/auth/callback/github`\n6. Click `Create Github App`\n\nOnce complete, you will need to setup the following environment variables in your `.env`:\n\n```sh\nGITHUB_CLIENT_ID=clientid-here\nGITHUB_SECRET=secret-here\n```\n\nYou can then visit `/admin` on your website which will guide you through authorising with Github.\n\n## Database\n\n`nextjs-checkout` uses `Prisma` ORM meaning you can use a **PostgreSQL**, **MySQL**, **MongoDB**, **SQLite**, **CockroachDB**, or **Microsoft SQL Server** database. \n\nConnecting to your database is done through the `Prisma` config file `prisma/schema.prisma`. See [here](https://www.prisma.io/docs/concepts/database-connectors) for the config options for your chosen database.\n\nYou will most likely need to make small changes to the `prisma/schema.prisma` if you are not using `postgres` which is the default supported DB. Included is an example `Mongodb` file here: `prisma/schema-mongodb-example.prisma`.\n\n#### Setup / Config\n\n1. Setup DB string into the `DATABASE_CONNECTION_STRING` environment variable in your `.env` file.\n2. Start the app with `yarn run dev` to confirm the DB connects without issue.\n3. Sync the DB schema with your database: `npx prisma migrate dev --name init`\n\n#### Seed example data\n\nRun the seed command: `npx prisma db seed` to seed example Products into your `products` table.\n\n## Payments\n\n### Stripe\n\nConfiguration of Stripe payments is done via the `.env` or `.env.local` file. The relevant values are:\n\n``` sh\nNEXT_PUBLIC_PAYMENT_CONFIG=stripe\nSTRIPE_SECRET_KEY=sk_test\nSTRIPE_WEBHOOK_SECRET=we_....\n```\n\n#### Adding the webhook\n\nSetup the webhook URL within the Stripe dashboard here: [https://dashboard.stripe.com/webhooks](https://dashboard.stripe.com/webhooks). \n\nSetup the URL endpoint to `https://my-domain-url/api/stripe/webhook`.\n\n### Square\n\nConfiguration of Square payments is done via the `.env` or `.env.local` file. The relevant values are:\n\n``` sh\nSQUARE_ACCESS_TOKEN=xxxxxx.....\nSQUARE_LOCATION_ID=xxxxxxxxxxxxx\nSQUARE_WEBHOOK_URL=http://localhost:3000/api/square/webhook\n```\n\n#### Adding the webhook\n\nSetup the Webhook URL within the Square developer dashboard here: [https://developer.squareup.com/](https://developer.squareup.com/). \n\nSetup the URL endpoint to `https://my-domain-url/api/square/webhook`. Ensure you subscribe to `payment.updated` events. \n\n### Verifone\n\nConfiguration of Verifone payments is done via the `.env` or `.env.local` file. The relevant values are:\n\n``` sh\nNEXT_PUBLIC_PAYMENT_CONFIG=verifone\nVERIFONE_API_ENDPOINT=https://cst.test-gsc.vfims.com\nVERIFONE_PUBLIC_KEY=00000000-0000-0000-0000-000000000000\nVERIFONE_USER_UID=00000000-0000-0000-0000-000000000000\nVERIFONE_ENTITY_ID=00000000-0000-0000-0000-000000000000\nVERIFONE_PAYMENT_CONTRACT=00000000-0000-0000-0000-000000000000\nVERIFONE_THEME_ID=00000000-0000-0000-0000-000000000000\n```\n\nPlese refer to the Verifone documentation on where to obtain these values. \n\n#### Adding the webhook\n\nSetup a notification in the Verifone dashboard listening on: `Checkout - Transaction succeeded` and `Checkout - Transaction failed`. Setup the URL endpoint to `https://my-domain-url/api/verifone/webhook`.\n\nYou can test the webhook by setting up `Ngrok` and forwarding traffic to your app or using Postman to simulate and API call to your endpoint. A payload example:\n\n``` json\n{\n  \"objectType\": \"StandardEvent\",\n  \"eventId\": \"9eddccfb-1111-4b08-1111-e1906d784b8d\",\n  \"eventDateTime\": \"2023-05-05T00:50:58.556Z\",\n  \"recordId\": \"a4bfa80b-2222-4f53-2222-736fab4be93f\",\n  \"itemId\": \"a4bfa80b-2222-4f53-2222-736fab4be93f\",\n  \"entityUid\": \"75c0d895-3333-49e3-3333-4a4c555045f9\",\n  \"source\": \"CheckoutService\",\n  \"eventType\": \"CheckoutTransactionSuccess\"\n}\n```\n\n## Products\n\n### Images\n\nProduct images are stored on [AWS S3](https://aws.amazon.com/s3/). You can simply setup your S3 bucket in AWS Console and add the credentials to your `.env` or `.env.local` file. \n\nWhen managing products in `/admin/products` all images will be automatically uploaded to AWS S3.\n\n1. Visit [AWS S3](https://aws.amazon.com/s3/)\n2. Click `Create bucket`\n3. Pick your location and name your bucket\n4. In `Object ownership` select `ACLs enabled` - This is simply used to set an ACL of `public-read` for all images making them viewable to public for your website.\n5. Uncheck `Block all public access` as we want the images viewable to the public\n6. Click `Create bucket`\n7. Enter the Access key, secret and Bucket name to your `.env` or `.env.local` file:\n\n``` bash\nAWS_REGION=us-east-1\nAWS_S3_BUCKET_NAME=nextjs-checkout\nAWS_ACCESS_KEY_ID=my-key\nAWS_SECRET_ACCESS_KEY=my-key\n```\n\n## Discount codes\n\nDiscount codes are supported using an `amount` or `percent`. You can setup discount codes using the discount page in the Admin portal `/admin/discounts`. The `Dicount code` is the value customers will use at the checkout, the `Discount value` is either an `amount` or `percent` depending on the type set. You will need to set a start and end date/time and enable your discount.","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmrvautin%2Fnextjs-checkout","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmrvautin%2Fnextjs-checkout","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmrvautin%2Fnextjs-checkout/lists"}