GitPlanet

Cheap and reliable Node.js hosting starts at $3/month, and $1/month static HTML hosting

Created with love in Canada, visit hostnodejs.com today

Feel like to post an Ad? Learn Details
All Projects → brxck → Gatsby Starter Stripe

brxck / Gatsby Starter Stripe

Licence: mit
🛒 A starter storefront & admin UI with Gatsby, Stripe, & Netlify Functions.

Programming Languages

javascript
184084 projects - #8 most used programming language

Labels

gatsbystripe

Projects that are alternatives of or similar to Gatsby Starter Stripe

Gatsby Advanced Starter
A high performance skeleton starter for GatsbyJS that focuses on SEO/Social features/development environment.
Stars: ✭ 1,224 (+1230.43%)
Mutual labels:  gatsby
Gatsby Styled Blog Starter
My first GatsbyJS starter.
Stars: ✭ 86 (-6.52%)
Mutual labels:  gatsby
Stripe Payments Demo
Sample store accepting universal payments on the web with Stripe Elements, Payment Request, Apple Pay, Google Pay, Microsoft Pay, and the PaymentIntents API. 💳🌍✨
Stars: ✭ 1,287 (+1298.91%)
Mutual labels:  stripe
Gatsby Starter Docz
📝 Gatsby starter with Docz and a blog for your documentation
Stars: ✭ 81 (-11.96%)
Mutual labels:  gatsby
Gatsby Bulma Quickstart
🚀 + ⚛️ A Quick Way to bootstrap your next Gatsby + Bulma site.
Stars: ✭ 84 (-8.7%)
Mutual labels:  gatsby
Gatsby Theme Try Ghost
A Gatsby theme to build flaring fast blogs from headless Ghost CMS
Stars: ✭ 88 (-4.35%)
Mutual labels:  gatsby
Reactime
Chrome extension for improving and optimizing performance in React applications (Gatsby and Next.js compatible).
Stars: ✭ 1,219 (+1225%)
Mutual labels:  gatsby
Cordova Plugin Stripe
A Cordova plugin that lets you use Stripe's Native SDKs for Android and iOS.
Stars: ✭ 90 (-2.17%)
Mutual labels:  stripe
Gatsby Plugin Google Fonts
Bring Google Fonts to Gatsby https://www.gatsbyjs.org/
Stars: ✭ 84 (-8.7%)
Mutual labels:  gatsby
Gatsby Plugin Elasticlunr Search
Gatsby search plugin via elastic lunr client-side search index.
Stars: ✭ 88 (-4.35%)
Mutual labels:  gatsby
Gatsby With Unstructured Data
A simple example of creating pages dynamically in Gatsby without using GraphQL.
Stars: ✭ 83 (-9.78%)
Mutual labels:  gatsby
Blog
Source for my blazing fast blog
Stars: ✭ 83 (-9.78%)
Mutual labels:  gatsby
Gatsby Using Page Transitions
Gatsby example site using page transitions
Stars: ✭ 88 (-4.35%)
Mutual labels:  gatsby
Gatsby Starter Help Center
📙A free self-hosted help center
Stars: ✭ 80 (-13.04%)
Mutual labels:  gatsby
Builder
Drag and drop page building using your code components
Stars: ✭ 1,281 (+1292.39%)
Mutual labels:  gatsby
Gatsby Starter Typescript Rebass Netlifycms
My default Gatsby setup. Includes rich MDX support.
Stars: ✭ 79 (-14.13%)
Mutual labels:  gatsby
Rw
Ryan Wiemer's Digital Portfolio
Stars: ✭ 87 (-5.43%)
Mutual labels:  gatsby
Chip
A drop-in subscription billing UI for Laravel
Stars: ✭ 91 (-1.09%)
Mutual labels:  stripe
Gatsby Remark Design System
🎨 Create your design system with Gatsby in Markdown
Stars: ✭ 90 (-2.17%)
Mutual labels:  gatsby
Gatsby Starter Procyon
An opinionated Gatsby starter designed for trash-eating pandas.
Stars: ✭ 88 (-4.35%)
Mutual labels:  gatsby
View All Similar Projects ➔

gatsby-starter-stripe

A starter to create and manage a storefront with Gatsby, Stripe, & Netlify Functions; includes cart, checkout, admin, and live data.

Features

  • Create and manage inventory through admin interface
  • Statically generate based on Stripe inventory
  • Dynamically update with live inventory & availability data
  • Checkout powered by Stripe
  • Serverless functions interact with Stripe API

Getting Started

  1. Create a new site from this starter

    gatsby new <project-name> https://github.com/brxck/gatsby-starter-stripe

  2. Setup Stripe

    This starter has an admin interface to manage your inventory, but the Stripe integration does not handle an empty account well. Before starting your site, you should create at least one product with one sku in Stripe.

    ⚠️ Cannot query field errors usually mean that a queried field is empty in all of your products/skus. Either define the field in your Stripe data, or remove it from the the GraphQL queries of allStripeSku.

  3. Configure API keys

    Rename .env.example to .env and fill with your Stripe API test keys. Don't commit this file to a public repo!

  4. Start development servers

    You will need to install and configure the Netlify CLI: npm install netlify-cli -g

    To start the development servers for Gatsby & Netlify Functions simply run Netlify Dev.

    netlify dev

    Your site is accessible at http://localhost:8888!

    ⚠️ Make sure to use the proxied Netilfy Dev server at :8888! Otherwise your Gatsby application will not be able to access your Netlify Functions.

  5. Start developing

    This starter aims to handle some of the plumbing needed to integrate Gatsby & Stripe. Everything else is left to you and your preferred methods.

    The source files for Netlify Functions are located at /src/functions, they are then built into the files in /functions. Visit the documentation for more information on their structure.

  6. Deploy to Netlify

    netlify deploy

    You will need to enable Netlify Identity for authentication into the admin area.

    If you want to deploy somewhere other than Netlify, you'll have to find another place to deploy the serverless functions in /functions, ex. AWS Lambda.

Contributing

Issues and pull requests welcome!

Acknowledgments

Thanks @njosefbeck for authoring and maintaining gatsby-source-stripe, which makes this starter possible!

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].