Photo by Ferenc Almasi on Unsplash
It’s been a little over 3 months since my last post about building a payment solution using Javascript.
How I built a Payment Gateway using Javascript.
Yes, it can be overwhelming at times with a 9–5, am glad was able to finally do part of the would be series of how to build a payment gateway or solution using Javascript.
In the last post I talked about why I chose JavaScript which I will not be repeating here, however, I have come to realise that using other frameworks (not for Javascript) or languages can also give you a a pretty good and robust solution as well. Therefore, I will in the future share about using other languages (PHP and Python) and frameworks (Laravel and Django) to come up with similar or even better solutions. It all comes to which one you’re well conversant about.
Alright enough of that, let’s dive into the Gateway (JavaScript — NodeJS).
The Start
With this, we will be using TypeScript which I believe is an advantage over using just JavaScript to avoid errors that may have sneaked through to the runtime. You see, basic JavaScript is dynamic and weak-typed which can bring up challenges in managing a growing code base while TypeScript which is a super-set of JavaScript has strong static typing, compilation, and object oriented programming characteristics which come in handy when looking at large code projects or ever growing code bases like a payment gateway (from the previous blog, you will see that we are looking at having Mobile money integrations, VISA and MasterCard, SMS, Email and other billing and security features that tend to keep changing overtime)
Since we have that out of the way let’s start with setup our gateway with TypeScript, Express and MongoDB.
Step 1
We will create our folder and move into it:
$ mkdir gateway
$ cd gateway
Then we can go ahead and initialise our npm project:
$ npm init
You can use the -y flag to use defaults of npm init by automatically saying yes. However, for me I love to make it personal 😎 so I came up with something like this:
https://medium.com/media/aec0d90a82cc171eb8bd709a864bd13f/href
Step 2 - Add and Configure TypeScript
After initialising our project, next is adding and configuring TypeScript. Remember that this is done inside our gateway folder.
First we install TypeSript as below:
$ npm install --save-dev typescript
We then add a tsconfig.json file to the root directory gatewaywhich is used to configure the compilation options of TypeScript.
$ nano tsconfig.json
Then insert the code below:
https://medium.com/media/cd67a9205e7ff6e03b178482657424d2/href
Looking at the snippet above, here is simple explanation for the variables we have used:
- module: Specifies the module code generation method. Node uses commonjs.
- esModuleInterop :Enables interoperability between CommonJS and ES modules during imports.
- target: Specifies the output language level (we are using ES6).
- moduleResolution: This helps the compiler figure out what an import refers to. The value node mimics the Node module resolution mechanism.
- sourceMap : Creates respective .map file for allowing debuggers and other tools to display the original TypeScript source code when working with the emitted JavaScript files.
- outDir: This is the location to output .js files after compilation. In our project we will use thedistfolder.
Read more about this here TypeScript Compiler options
Step 3 - Add and Configure Express server
Let’s start by installing express:
$ npm install --save express
$ npm install -save-dev @types/express
//We use the @types/express package for TypeScript to know about the types of Express classes.
Then we create the src folder in our gateway folder to hold our TypeScript files which have a .ts extension:
$ mkdir src
Then we add a file called app.ts which will act as our main project app which we will later add the respective transpiled app.js file in the package.json to run as the main file instead of index.js :
$ nano src/app.ts
Add the code below to create a minimalistic express server:
https://medium.com/media/993302f8d71d9e291686e1c329801959/href
The above code creates an express server that runs on port 3000 . Let’s go ahead and compile, then run our server to test if everything works fine. To compile, we run the command below in the terminal:
$ npx tsc
The above uses the configuration options in tsconfig.json to generate .js files in the dist folder which we will use in running the app as below:
$ node dist/app.js
For a successful run we will have the output below:
Express is listening at [http://localhost:3000](http://localhost:3000)
You can open the link in the browser and you should be able to see Hello World! in the browser. Hurayyyy!! You have setup and configure your express server. You can open the dist/app.js and see how it looks like. Below is a snippet.
https://medium.com/media/d0578224bb3e187f6d6f5ef265e25588/href
Finally, let’s install and configure MongoDB.
Step 4 - Add and Configure MongoDB
First, you need to make sure that you have MongoDB installed and running on your machine, you can use the links below for instructions to install, run and create a database (for our case it should be gateway)according to the operating system you have.
- On MacOS https://www.mongodb.com/docs/manual/tutorial/install-mongodb-on-os-x/
- On Linux https://www.mongodb.com/docs/manual/administration/install-on-linux/
- On Windows https://www.mongodb.com/docs/manual/tutorial/install-mongodb-on-windows/
We can go ahead and add mongodband mongoose to our project using the command below:
$ npm install mongodb mongoose
$ npm install -save-dev [@types/mongodb](http://twitter.com/types/mongodb) @types/mongoose
Next we are going to connect to our database that we created by updating our app.ts code as below:
https://medium.com/media/d2c6d70197c8fab90cbf22b1e11ebda2/href
We have imported the mongoose module and used it to connect to our database which uses the url mongodb://localhost:27017/gateway. On a successful db connection the express server will be started and you will get the output below:
Express is listening at [http://localhost:3000](http://localhost:3000)
Wow! It has been a long thread but I am thankful that you took time to go through it all. It will be great if you give a clap or even follow me for future posts in this series and other topics. Next we will be looking at database actions.
In case you want the code used in this post, you can use the link below:
GitHub - Cank256/payie: A payment solution project
Top comments (0)