This project is deprecated and is no longer being actively maintained.

Stripe on StdLib Demo

Welcome to the Stripe on StdLib demo! This repository shows how to build frictionless Stripe integrations on top of StdLib’s serverless platform and their browser-based API development environment, Code.xyz.

This project extends our universal Stripe Payments Demo, a sample e-commerce store that uses Stripe Elements and the Sources API to accept both card payments and additional payment methods on the web. Please refer to the main project to learn more and find backend code in more languages.

StdLib allows anybody to quickly ship scalable and production-ready APIs. We’ve ported our payments demo from Express to a serverless-based approach on StdLib to serve API endpoints, the Stripe webhook integration, and the single-page app. You can explore this repository on Code.xyz. We hope you enjoy!

Overview

You can read more about the features from this app on the main payments repository.

Stripe and StdLib Integration

This section gives you some details about how this Stripe and StdLib integration works.

API Endpoints

The functions directory contains the code for all the API endpoints consumed by the single-page demo. FaaSlang defines semantics and rules for the deployment and execution of these serverless functions.

The ability to create orders via a POST request on /orders is defined in functions/orders/__main__.js, and the ability to list products via a GET request on /products is defined in functions/products/__main__.js. These functions rely on the stripe/inventory.js library which helps with product and order management on Stripe.

The interesting thing to note is that for API endpoints which contain IDs in their path, such as POST /orders/{id}/pay to pay a specific order, the serverless function is defined in functions/orders/__notfound__.js, which is called automatically since the endpoint has a variable. The same applies for fetch a specific product.

The Stripe webhook handler is defined in functions/webhook.js.

Single-Page App and Static Assets

The frontend code for the demo lives in the public directory. In particular, public/javascripts/payments.js creates the payment experience using Stripe Elements, and public/javascripts/store.js handles the inventory and order management on Stripe.

The main app template is served by a function, specifically the main function defined in functions/__main__.js. All the static assets (scripts, stylesheets, and images) are also rendered by a function, specifically via the functions/public/__notfound__.js function which relies on the fileio.js helper to read and map files from the public directory.

Getting Started

You’ll need the following:

• Node.js >= 8.x.
• Modern browser that supports ES6 (Chrome to see the Payment Request, and Safari to see Apple Pay).
• Stripe account to accept payments (sign up for free).
• StdLib account to deploy the project (sign up for free).

In your Stripe Dashboard, you can enable the payment methods you’d like to test with one click. Some payment methods require receiving a real-time webhook notification to complete a charge. This StdLib demo exposes an endpoint for webhooks which you can enter in your webhooks settings on Stripe (it should look like https://<username>.lib.id/<service>@dev/webhook).

Deploying to StdLib

The simplest way to test and deploy this project is to use the Code.xyz development environment, but you can also clone this repository locally and use the StdLib command line tools.

In both cases, you’ll need to copy the file env.example.json to env.json and fill in your own Stripe API keys and any other configuration details.

To install StdLib command line tools, run the following command:

npm install lib.cli -g

Login or create a StdLib account from the command line:

lib login

You can now push the code to StdLib:

lib up dev

This Stripe demo should now be running at https://<username>.lib.id/<service>@dev/. You should also see in your Terminal the URL of your webhook endpoint to enter in your Stripe account if you’d like to try non-card payment methods which are asynchronous: https://<username>.lib.id/<service>@dev/webhook.

More about StdLib

If you want to join the StdLib community, you can visit stdlib.com or follow StdLib on Twitter.