Paypal checkout workflow with vue js and sails js

through this post we will see the workflow of Paypal checkout with validation in the backend by using vue js in the frontend and sails js in the backend i will try to explain each step as much as i can but i assumes that you at least have some working knowledge of javascript

we need first to create a REST application in paypal developer


this is the application we will try to build by the end of this tutorial

Step1 : client side

generate a new vue js project using vue cli

make sure first that you have vue-cli installed globally

once the project is created we replace the content of helloworld component with this code


this code contain the layout of the home page and it makes use of another component witch we will create right now the PayPal button component

in src/component/Paypal.vue

we add the template tag first a Paypal button and two messages one for success payment and the other if something went wrong

inside the script tag we have to initiate a paypal object in mounted


if you notice in that code we make use of a PayPal object to render the button

is not defined yet we need to import the paypal CDN

add this script in the index.html file


in mounted we used a sendDataPaypal method witch we will define now in methods


this method makes an http call using axios and sends the paypal data to the server side the paymentID ,payerID , amount so we can validate the payment in the server side

Step2 : Server side

generate a new sails js project

make sure first that you have sails installed globally

now we can generate a payment api

this command will create a model file and a controller file

in the model we define the attributes of a payment




we sould define the router too in


in the controller we receive the data from the client side and we pass it to a service PaypalService in this service we require paypal-rest-sdk module we need first to install this module by npm

and we execute the payment when the payment is successfully executed we save the payment in the database

You can find the final code here.



👉Don’t forget to clap if you like the post and star ⭐️ the repo in Github if you find it useful ,Thanks for reading

cheers 😉

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store