DEV Community

Caleb Nkunze
Caleb Nkunze

Posted on • Originally published at blog.devgenius.io on

NodeJS Gateway — Part 1: Initial Setup


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
Enter fullscreen mode Exit fullscreen mode

Then we can go ahead and initialise our npm project:

$ npm init
Enter fullscreen mode Exit fullscreen mode

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
Enter fullscreen mode Exit fullscreen mode

We then add a tsconfig.json file to the root directory gatewaywhich is used to configure the compilation options of TypeScript.

$ nano tsconfig.json
Enter fullscreen mode Exit fullscreen mode

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.
Enter fullscreen mode Exit fullscreen mode

Then we create the src folder in our gateway folder to hold our TypeScript files which have a .ts extension:

$ mkdir src
Enter fullscreen mode Exit fullscreen mode

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
Enter fullscreen mode Exit fullscreen mode

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
Enter fullscreen mode Exit fullscreen mode

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
Enter fullscreen mode Exit fullscreen mode

For a successful run we will have the output below:

Express is listening at [http://localhost:3000](http://localhost:3000)
Enter fullscreen mode Exit fullscreen mode

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.

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
Enter fullscreen mode Exit fullscreen mode

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)
Enter fullscreen mode Exit fullscreen mode

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)

AWS Security LIVE!

Join us for AWS Security LIVE!

Discover the future of cloud security. Tune in live for trends, tips, and solutions from AWS and AWS Partners.

Learn More

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay