Introduction

In this project, I developed a platform that allows customers to generate and send payment request links via SMS or email to their clients. The goal was to streamline the payment request process, integrate with a secure payment service provider, and provide a seamless experience across multiple devices. The system included a robust client management feature, templating engine, and real-time transaction monitoring.

Key Features

1. Client Management System

A critical feature of the platform is the client management system, where users can manage the contact details of their clients. This enables them to generate payment request links quickly and efficiently.

2. Templating Engine with Preview

We implemented a templating engine based on Pug and Mustache. This allows customers to create custom messages with placeholders for text or images. Users can preview these messages in both mobile and desktop formats. The emails are designed using MJML, ensuring they are responsive and render flawlessly on all clients.

3. Hosted Checkout Integration

To enable secure payments, we integrated the system with a payment provider’s PCI-DSS compliant hosted checkout solution. The checkout link is embedded into the payment request message, and once the payment is completed, the transaction status is updated through a callback. We also implemented a background scheduler to verify the status of pending transactions to handle potential failures.

4. Transaction Overview and Dashboard

The platform includes a transaction overview and a dashboard, providing an at-a-glance view of all payment processes and any incurred fees, such as SMS delivery charges. We integrated with Twilio to handle SMS notifications.

5. Admin Interface and User Management

Admins can manage users and clients through an admin interface, built with Keycloak for user management. The self-hosted Keycloak solution was themed and customized to integrate smoothly with the rest of the system.

Architecture and Technology Stack

To ensure high availability and scalability, the platform was built using a microservice architecture. Here’s an overview of the key components and technologies used:

• Microservices: The core services for payment management, messaging, and transaction status tracking were separated into microservices, ensuring they could scale independently.
• Nest.JS: Both the services and the API were built with Nest.JS, using Redis for inter-service communication.
• MySQL and Prisma ORM: We chose MySQL as the database and Prisma as the ORM for efficient data management and querying.
• Next.JS: The frontend was a Next.JS SSR application, with components written in React. It communicated with the backend via REST APIs.
• Error Logging: Error handling and logging were centralized with Rollbar, ensuring smooth tracking and resolution of issues.

Team and Collaboration

The project team consisted of:

• Infrastructure and Backend Development: I was responsible for the infrastructure setup and backend development, including the microservice architecture, API integration, and payment provider integration.
• DevOps Specialist: A DevOps engineer who helped with deploying and scaling the system using containerization and cloud infrastructure.
• Frontend Developer: A frontend specialist who worked on developing the Next.JS-based user interface and handling client-side functionality.

Conclusion

This project successfully streamlined the process of sending payment requests, offering a seamless and responsive solution for users across multiple devices. The flexible architecture, use of microservices, and integration of modern technologies like Nest.JS and Next.JS ensure that the platform is scalable, maintainable, and ready for future enhancements.