# Payment Method Integration (Shurjopay)

This repository demonstrates the integration of the **Shurjopay** payment gateway with separate **backend** and **frontend** implementations. It provides a comprehensive guide to integrating Shurjopay into your applications seamlessly.

---

## Features

- **Backend API** for initiating payments and handling callbacks.
- **Frontend interface** to initiate payments and display transaction statuses.
- Environment-based configurations for streamlined development and production.
- Clear and scalable folder structure.

---

## Prerequisites

Ensure you have the following before starting:

1. **Shurjopay** merchant account and API credentials.
2. [Node.js](https://nodejs.org/) (v14 or later) installed.
3. Package manager like `npm` or `yarn`.
4. A modern web browser for testing the frontend.

---

## Getting Started

### Clone the Repository

```bash
git clone https://github.com/Apollo-Level2-Web-Dev/payment-method-integration.git
cd payment-method-integration
```

---

Backend Setup

1. Navigate to the Backend Directory

   cd backend

2. Install Dependencies

   npm install

3. Configure Environment Variables

   Create a .env file in the backend directory and add the following variables:

   PORT=4000
   DATABASE_URL="<Mongodb DATABASE_URL>"
   
   JWT_ACCESS_SECRET=verysecret
   JWT_REFRESH_SECRET=veryverysecret
   JWT_ACCESS_EXPIRES_IN=7d
   JWT_REFRESH_EXPIRES_IN=365d
   
   SP_ENDPOINT=https://sandbox.shurjopayment.com
   SP_USERNAME=sp_sandbox
   SP_PASSWORD=pyyk97hu&6u6
   SP_PREFIX=SP
   SP_RETURN_URL=http://localhost:5173/order/verification
   

4. Run the Backend Server

   npm start

   The backend will run at http://localhost:4000.

---

Frontend Setup

1. Navigate to the Frontend Directory

   cd frontend

2. Install Dependencies

   npm install

3. Configure Environment Variables

   Create a .env file in the frontend directory and add the following variable:

   Vite_APP_API_URL=http://localhost:4000/api/v1
   

4. Run the Frontend Application

   npm start

   The frontend will run at http://localhost:5173.

---

Folder Structure

Root Directory

.
├── backend/               # Backend API and logic
├── frontend/              # Frontend user interface
├── README.md              # Project documentation
└── .gitignore             # Git ignore rules

---

Backend Folder Structure

backend/
├── src/
│   ├── app/
│   │   ├── config/          # Configuration files (e.g., database, environment setup)
│   │   ├── errors/          # Custom error handling classes and utilities
│   │   ├── interfaces/      # TypeScript interfaces and types
│   │   ├── middlewares/     # Express middlewares for validation, logging, authentication, etc.
│   │   ├── modules/         # Feature modules (e.g., payment module for Shurjopay integration)
│   │   │   ├── payment/     # Shurjopay-specific logic
│   │   │   │   ├── controller/  # Payment controllers for handling API requests
│   │   │   │   ├── router/       # Route definitions for payment-related endpoints
│   │   │   │   ├── service/      # Business logic and interaction with Shurjopay API
│   │   │   │   └── model/        # Mongoose models or database schemas if needed
│   │   ├── utils/           # Helper functions and utilities (e.g., logging, error handling)
│   │   └── app.ts           # Main Express app configuration and initialization
│   └── server.ts            # Server initialization and entry point
├── .env                     # Environment variables (e.g., API credentials)
├── package.json             # Node.js dependencies
└── tsconfig.json            # TypeScript configuration

---

Frontend Folder Structure

frontend/
├── public/                # Public assets
├── src/
│   ├── components/        # Reusable UI components
│   ├── pages/             # Application pages (e.g., Payment, Success)
│   ├── services/          # API calls to the backend
│   ├── App.tsx            # Main App component
│   ├── index.tsx          # Entry point for React
├── .env                   # Environment variables
├── package.json           # Node.js dependencies
└── tsconfig.json          # TypeScript configuration

---

Payment Callback

The Shurjopay gateway sends transaction details to the RETURN_URL and CANCEL_URL specified in the .env file. Ensure these endpoints are correctly implemented in the backend to handle the responses.

---

License

This project is licensed under the MIT License. See the LICENSE file for details.

---

Contact

For any questions or assistance, feel free to open an issue in the repository's Issues section.

This version improves readability, organizes information clearly, and includes all relevant details for both backend and frontend setups. Let me know if you need further customizations!