{"id":18655303,"url":"https://github.com/robertbroersma/next-storefront","last_synced_at":"2025-04-11T17:31:58.886Z","repository":{"id":54216755,"uuid":"299712068","full_name":"RobertBroersma/next-storefront","owner":"RobertBroersma","description":"🛍️ A dazzlingly fast E-Commerce solution built with Typescript and NextJS.","archived":false,"fork":false,"pushed_at":"2020-10-15T07:37:37.000Z","size":18153,"stargazers_count":102,"open_issues_count":0,"forks_count":14,"subscribers_count":10,"default_branch":"main","last_synced_at":"2025-04-07T00:42:55.259Z","etag":null,"topics":["nextjs","shopify","storefront","typescript"],"latest_commit_sha":null,"homepage":"https://next-storefront-statik.vercel.app/","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/RobertBroersma.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}},"created_at":"2020-09-29T19:02:28.000Z","updated_at":"2025-02-27T11:25:03.000Z","dependencies_parsed_at":"2022-08-13T09:21:06.355Z","dependency_job_id":null,"html_url":"https://github.com/RobertBroersma/next-storefront","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/RobertBroersma%2Fnext-storefront","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/RobertBroersma%2Fnext-storefront/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/RobertBroersma%2Fnext-storefront/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/RobertBroersma%2Fnext-storefront/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/RobertBroersma","download_url":"https://codeload.github.com/RobertBroersma/next-storefront/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248449851,"owners_count":21105577,"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":["nextjs","shopify","storefront","typescript"],"created_at":"2024-11-07T07:18:22.253Z","updated_at":"2025-04-11T17:31:53.867Z","avatar_url":"https://github.com/RobertBroersma.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e\n  \u003ca href=\"\" rel=\"noopener\"\u003e\n \u003cimg width=350px src=\"https://raw.githubusercontent.com/RobertBroersma/next-storefront/main/logo.svg\" alt=\"Project logo\"\u003e\u003c/a\u003e\n\u003c/p\u003e\n\n\u003ch3 align=\"center\"\u003eNext Storefront\u003c/h3\u003e\n\n\u003cdiv align=\"center\"\u003e\n\n[![Status](https://img.shields.io/badge/status-active-success.svg)]()\n[![GitHub Issues](https://img.shields.io/github/issues/RobertBroersma/funk.svg)](https://github.com/RobertBroersma/funk/issues)\n[![GitHub Pull Requests](https://img.shields.io/github/issues-pr/RobertBroersma/funk.svg)](https://github.com/RobertBroersma/funk/pulls)\n[![License](https://img.shields.io/badge/license-MIT-blue.svg)](/LICENSE)\n\n\u003c/div\u003e\n\n---\n\n\u003cp align=\"center\"\u003e A dazzlingly fast E-Commerce solution built with Typescript and NextJS.\n    \u003cbr\u003e \n\u003c/p\u003e\n\n\u003ca href=\"https://discord.gg/KZmJGPF\" \u003e\n  \u003cimg width=\"200\" src=\"https://i.imgur.com/En8vQRC.png)\" /\u003e\n \u003c/a\u003e\n\n## 📝 Table of Contents\n\n- [About](#about)\n- [Getting Started](#getting_started)\n- [Usage](#usage)\n- [TODO](#todo)\n\n## 🧐 About \u003ca name = \"about\"\u003e\u003c/a\u003e\n\n\n\nVisit the demo here: https://next-storefront-statik.vercel.app/\n\n\u003e 📝 This demo will be updated regularly as cool new features are rolled out!\n\n## 🏁 Getting Started \u003ca name = \"getting_started\"\u003e\u003c/a\u003e\n\n### Installing\n\nFirstly, install `@next-storefront/core`. This package contains an adapter to pull in and transform data from different data sources. It also contains contexts and hooks.\n\n```\nnpm install @next-storefront/core --save\n```\n\nOr\n\n```\nyarn add @next-storefront/core\n```\n\n## 🎈 Usage \u003ca name=\"usage\"\u003e\u003c/a\u003e\n\nSecondly, pick one or more data sources, and a checkout system.\n\n### Use with Shopify\n\nWhen working with Shopify, Shopify acts as both the source of products and the checkout.\n\n1. Install `@next-storefront/shopify`\n2. Configure Shopify as a source:\n\n```js\n// next-storefront.config.js\n\nmodule.exports = {\n  sources: [require('@next-storefront/shopify')],\n}\n```\n\n3. Configure Shopify Checkout:\n```tsx\n// App layout\n\nimport { CartProvider } from '@next-storefront/core'\nimport * as shopifyCheckout from '@next-storefront/shopify/checkout'\n\nexport function Layout({ Component, pageProps }) {\n  return (\n    \u003cCartProvider checkout={shopifyCheckout}\u003e\n      ...\n    \u003c/CartProvider\u003e\n  )\n}\n\n```\n\nGet a Shopify _storefront_ api access token. The best way is to [create a private app](https://shopify.dev/docs/storefront-api/getting-started#private).\n\nSet environment variables:  \n`NEXT_PUBLIC_SHOPIFY_STOREFRONT_TOKEN=woohoobigtoken`  \n`NEXT_PUBLIC_SHOPIFY_STORE_NAME=statikly` (as in statikly.myshopify.com)\n\n### Use With Stripe\n\nWhen working with Stripe, Stripe Checkout acts as the checkout. You can pull in product data from anywhere! (Even Shopify)\n1. Install any data source, e.g. `@next-storefront/json`\n2. Configure your data source:\n\n```js\n// next-storefront.config.js\n\nmodule.exports = {\n  sources: [require('@next-storefront/json')],\n}\n```\n\n3. Install `@next-storefront/stripe`\n4. Configure Stripe Checkout:\n\n```tsx\n// App layout\n\nimport { CartProvider } from '@next-storefront/core'\nimport * as stripeCheckout from '@next-storefront/stripe/checkout'\n\nexport function Layout({ Component, pageProps }) {\n  return (\n    \u003cCartProvider checkout={stripeCheckout}\u003e\n      ...\n    \u003c/CartProvider\u003e\n  )\n}\n\n```\n\nSet environment variables:  \n`STRIPE_SECRET_KEY`  \n`NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY`\n\nCreate some products by adding `.json` files to the `products` directory.\n\n## ⛏️ Built Using \u003ca name = \"built_using\"\u003e\u003c/a\u003e\n- [React](https://reactjs.org/)\n- [Next.js](https://nextjs.org/)\n- [React Query](https://github.com/tannerlinsley/react-query)\n- [TypeScript](https://www.typescriptlang.org/)\n\n\n## 🎉 Acknowledgements \u003ca name = \"acknowledgement\"\u003e\u003c/a\u003e\n- [Vue Storefront](https://www.vuestorefront.io/) - Inspiration\n- [Gatsby Theme Shopify Manager](https://gatsbythemeshopifymanager.com/) - Inspiration\n\n## TODO Features (in no particular order):\n\n- [x] Static Generation\n- [x] Serverless deploy with Vercel or Netlify\n- [x] Work with SSG\n- [x] Work with Incremental Static (Re)generation\n- [ ] Work with live-updates for things like inventory\n- [x] Use with Shopify\n- [x] Use with Stripe Checkout (This paves the way for retrieving products from anywhere!)\n- [ ] Use with Stripe Products\n- [ ] Use with other sources\n- [ ] Wishlists\n- [ ] Search \u0026 Filters\n- [ ] Custom Checkout\n- [ ] Order Pages\n- [ ] PWA\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frobertbroersma%2Fnext-storefront","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frobertbroersma%2Fnext-storefront","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frobertbroersma%2Fnext-storefront/lists"}