Member-only story
Build an eCommerce website with Node.js, Vue 2, Stripe, Heroku and Amazon S3
This post goes through building a website for selling products. We set up a Vue client side application and Node.js server side app. The apps use Stripe’s Javascript libraries for payment processing. We deploy the client app to Amazon S3 and deploy the Node.js server to the cloud using Heroku.
In this tutorial we are going to build a website for selling artisan bundles of sticks online. It is going to be called Stickly! In order to make this site we’re going to need a Product display page, an Order page and a Confirmation details page. We’ll accept payments using Stripe’s client side and server side Javascript libraries.
To build the frontend we’ll use Vue 2 with vue-router for client side routing. The frontend application will be responsible for collecting user information and sending a request to Stripe for a special token. Once we have that token from Stripe, our client side code will forward the token to our server in order to initiate the charge.
The server will be made from Node.js using express and its associated utility libraries. There will be two endpoints. One for creating a new charge and the other for returning details about a particular charge, based on a unique identifier that we get from Stripe.
In order to build this application and start selling online, we are going to utilize third party services. To build a real world website that accept actual payments on the internet you’ll need to sign up for the following services and locate your special API keys.
- Stripe: Stripe is the current standard for developers accepting payments in the US. There are many competitors out there but Stripe’s extensive documentation and ease of use has made it the de facto choice for payment processing online. We are going to use their [client side](https://stripe.com/docs/stripe.js?) Javascript library and their server side [Node.js package](https://stripe.com/docs/api/node).
