The Credit Card Verification system comprises a JavaScript React.js frontend and a Java Spring Boot backend. The frontend sends API requests to the backend to validate credit cards via its RESTful API.
Frontend Tech Stack:
- JavaScript
- React.js 18
- React Router Dom for dynamic page routing
- Axios for API integration
Backend Tech Stack:
- Java 11
- Spring Boot 2.7.15
- Follows Test Driven Development (TDD) principles
- Utilizes JUnit 5.10.0 and Mockito 5.5.0 for Unit Testing.
- Node.js and npm: You need Node.js (version 16 or later) and npm (Node Package Manager) installed on your system. If not, follow the steps below to install them.
- Java Development Kit (JDK): You need a Java Development Kit (JDK) installed. I recommend using JDK 11 or later.
- Spring Boot 2.7.15
- Maven
-
Visit the official Node.js website.
-
Download the LTS (Long Term Support) version of Node.js (which includes npm).
-
Run the installer and follow the installation instructions.
-
After installation, open a command prompt and verify that Node.js and npm are installed by running:
node -v npm -v
-
Run
brew install node@16 -
After installation, open a command prompt and verify that Node.js and npm are installed by running:
node -v npm -v
-
Run
sudo apt update -
Run
sudo apt update -
Run
sudo apt install nodejs npm -
After installation, open a command prompt and verify that Node.js and npm are installed by running:
node -v npm -v
- To get started clone this repository to your local machine by running the following command on you command prompt or terminal.
git clone https://github.com/kindyluv/credit-card-validator.git
The Frontend application is a single page application with a user friendly interface with a card design at the left and a simple input form and a submit form that makes the API call to verify if the card is valid or invalid and get response from the API call.
- After cloning this project navigate to the frontend folder.
cd creditCardValidator/frontend - Resolve dependencies by running the following command.
yarn
- To start the application run the following command on yor terminal.
yarn run start
The application will load on http://localhost:3000
The application requires the following fields in the input:
- Card Name
- Card Number (max: 19)/(min: 16)
- Expiry Date (Month / Year)
- CVV
- When the card validation is successful a green checker modal pops up
- and the card changes color to green
- When the card validation is unsuccessful a red checker modal pops up with a try again message
NB: The submit button is disabled until all the fields are filled
The Backend application is a single RESTFul API POST call http://localhost:8080/api/v1/card/validate
To resolve the dependencies and start the application follow the steps below:
- Navigate to the the project folder:
cd creditCardValidator/backend/cardValidatingSystem - To Resolve the dependencies:
- Windows
mvn clean install
- Linux and MacOS
./mvnw clean install
- Windows
- To start the application
- Windows
mvn spring-boot:run
- Linux and MacOS
./mvnw spring-boot:run
- Windows
- The Spring Boot application will start, and you can access it at
http://localhost:8080/api/v1/card/.
This API provides access to credit card validation. It allows users to verify credit card type and check if it's a valid credit card.
The base URL for accessing the API is: http://localhost:8080/api/v1/card/
- Validate Card
- Endpoint:
validate - Method: POST
- Description: Make a post call to verify a credit card
- Example Request Body:
{ "cardNumber": "5298202628250195", "cardCVV": "781", "cardExpiryDate": "12/23" } - Example Response:
- Error:
{ "validationStatus": "failed", "validationErrors": [ "Expiry date must be within allowed card lifetime", "Card number must be numbers only" ] } - Success:
{ "validationStatus": "success", "validationErrors": [] }
- Error:
- Windows:
mvn test - Linux/MacOS
./mvnw test