Building a Phone Number Validator using a third-party API and Nodejs.
If you have just got started with learning the concepts like API, backend server, etc. then building simple projects like “Phone Number Validator” will help you a lot to put these concepts into practice. In this tutorial, I’ll show you how to build an application from scratch.
Our application will do the following:
- Takes the user’s phone number and country code as input.
- Display information related to the phone number like location, landline or mobile number, Carrier, validity, etc as output.
So basically we can validate the phone number and this is useful when your application has to send WhatsApp messages or SMS to users.
I am using the following Technologies for building up the Phone Number Validator:
- HTML, CSS and Javascript & Jquery(Front-End).
- Node JS and Express (Backend).
- NumVerify API (this is a third-party API).
This entire project is divided into three articles:-
- Creating a server using node and express.
- Building up the front end.
- Requesting the API and handling the data.
Alright, let’s get started by building this application’s backend. Before jumping to the actual implementation, let’s create a server that gives the response as “Hello World” on making a request to the home route. Later we will serve our front-end files like Html, CSS, and Javascript through this server to the end user.
Create a new folder for our project and give a name of your choice, in my case I am giving the name as a Number_Validator
Creating a Server
Create a file, named app.js inside the folder Number_Validator.
What is a Server?
A server is a program that serves files as per the user's request. For example: If you are reading my article, then the front end that you are seeing now(medium’s webpage) is stored in the medium’s server, when you come to the medium website, a request is sent to its server, and the server gives you back these files that you are viewing now. But there are a few pre-requisites you need to know to create a server.
NPM:Node Package Manager is a package manager for Javascript programming, it is used to install NodeJs packages. NPM comes with NodejS installation, so if you haven’t installed NodejS, please install it by going to this link. It provides many useful packages that helps us to code easily. Express is one of the most famous and useful packages from NPM.
What is Express?
Express is an open-source backend web application framework for NodeJS. It is used to design and implement web applications quickly and easily. It helps to implement functionalities such as serving files with different formats in less code.
The first step is to initialize our Node project:
Step 1: Open the Command-Line and navigate to the directory of our project.
Example: If the Number_Validator folder is inside the Home folder which is inside the Desktop folder then the following command will change the directory.
cd Desktop\Home\Number_Validator
Step 2: Type the following command and press enter to initialize the npm package automatically.
npm init -yes
The -yes
in the above command initializes npm without asking any questions like the author name, description, version, git, etc. However, if you want to add these details, feel free to do it.
Once this is done, a file named package.json will be generated inside the project folder. Inside this file, you can find a JSON object that will have a key called main, make sure this key is set to the value app.js because this will be the entry point of our project.
Step 3: Now we need to install express. Type the following command to do so:
npm install express
Now a folder named node_modules will automatically be generated and it will have a bunch of files that are required for the express package which is the dependency for our project. This folder contains all the files related to dependencies that we have installed for our project. Now the folder structure should look like this:
Now we are all set to write the code for our server. Let's start with the below code.
const express = require('express');
In the first line of app.js, we have used the require
function for the express module. This inbuilt function helps to include external packages into our code file. It reads the file, executes it, and returns the exported object to the assigned variable. The constant express
should contain the returned object of the express module.
const app = express()
Next, we need to call the express function that we imported and assign it to a constant named app
.This function creates a new express application for us. It returns the app object for our project.
app.get("/", (req, res) => {
res.send("Hello World");
})
Next, we have to use a get
method to handle a request from the user. A get method has two arguments, the first is the path, in our case, it is the root path /
and the next parameter is a callback function that handles the response for the request. It has two parameters that are req (request object) and res (response object). The send
function is a method of response object and it sends back the response for a request that comes in. It will return the text “Hello World” according to the above code.
app.listen(80, () => {
console.log("Your server is running at Port 80")
});
The last set of codes uses the listen
function to make the server respond to the user’s request on the specified port number. The first argument is the port number that is set to 80 in our case, it is used to bind and listen to connections on the specified host and port number. Ports are virtual places in an operating system where networks can start and end. The next argument is a function that is executed once the server starts listening. In our instance, we have simply printed the message on the console through console.log
function.
That’s it! we have created our own server, type localhost:80
in your browser’s search bar and press enter, now you should see the message “Hello World on your screen”.
The final code looks like this:
Conclusion:
That was so simple, isn't it? In the next part of this blog series, we will learn how to serve the Html, CSS, and Javascript files through our server in the form of a response to a request.
My name is Alfiya Siddique, I am a 2nd-year diploma student studying Computer Science. You can follow me on Linkedin and Twitter.
Thank you for your time! Have a great day ahead.