Contact

Reliable IT solutions designed for performance, security, and scalability—supporting growing businesses worldwide, every step of the way.

React 18 Vite Node.js Lead CRM

Building a Smart Lead Management System from Scratch

React + Vite  |  Node.js  |  Follow-up Automation  |  Payment Handling

packages/frontend packages/backend packages/shared
Request a Demo Request a Quote
Lead Management System
Frontend React 18 + Vite
Backend Node.js + Express
Project Type Lead CRM / SaaS
Duration Ongoing
Region Global
About the Project

Project Overview

Lead Management System is a full-stack CRM platform built with a React 18 + Vite frontend and a Node.js + Express REST API backend. It enables sales teams to capture leads, track pipeline stages, manage payments, automate follow-ups, and send real-time notifications — all from a single fast SPA.

Built as a monorepo with packages/frontend, packages/backend, and packages/shared, the system shares TypeScript types and Zod validators across both apps, keeping the lead data contracts consistent end-to-end.

5
Pipeline Stages
3
User Roles
Auto
Follow-up Engine
Lead Pipeline Stages
New Lead just captured — awaiting first contact
Contacted First touchpoint made — call or email sent
Qualified Needs confirmed — proposal stage
Negotiation Pricing discussed — awaiting decision
Closed / Won Payment received — deal complete
Admin
Full CRM control & team management
Sales Manager
Assign leads, set targets & view reports
Sales Agent
Handle leads, update status & log follow-ups
Pain Points

Business Challenges

The sales team had no centralized system to manage leads, track follow-ups, or collect payments:

Leads Falling Through the Cracks
No visibility into pipeline stage, missed follow-ups, and lost revenue
01 No centralized place to capture and track incoming leads
02 Lead status was managed in spreadsheets — prone to errors and stale data
03 No follow-up reminders — agents missed callbacks and email sequences
04 Payment collection was handled outside the system with no audit trail
05 No automated notifications when a lead moved to a new stage
06 Managers had no real-time visibility into team performance or pipeline health
07 Separate tools for CRM, payments, and email meant duplicated data entry
What We Built

Our Role & Responsibilities

We designed and developed the full system end-to-end — React SPA, Node.js API, automation engine, payment integration, and notification pipeline.

React 18 + Vite SPA — Kanban-style lead pipeline board
Node.js + Express REST API with JWT role-based auth
Lead capture, assignment, and status change workflows
Follow-up automation engine — scheduled Node.js cron jobs
Payment handling with Stripe/Razorpay & invoice generation
Real-time notifications via Node.js WebSocket (Socket.io)
Automated email sequences triggered on status changes
Sales analytics dashboard with React Query + Chart.js
Development Timeline
Phase 1: Requirement Analysis
Mapped sales workflows, pipeline stages, and notification triggers
Phase 2: Monorepo Setup
npm workspaces, shared TS types, ESLint & Prettier across packages
Phase 3: React Frontend
Kanban board, lead forms, payment UI — built with Vite + React Query
Phase 4: Node.js API + Automation
REST API, follow-up cron engine, Socket.io & payment webhooks
Phase 5: Deployment & Live
Docker, CI/CD pipeline, SSL — production ready
What We Built

Solution Delivered

A complete Lead Management CRM — React Kanban board on the frontend, Node.js API + automation engine on the backend, and a shared types package in the middle.

Lead Pipeline Board
Drag-and-drop Kanban board to move leads across 5 status stages.
Follow-up Automation
Node.js cron jobs auto-schedule calls, emails & reminders per stage.
Payment Handling
Stripe/Razorpay payments with invoice generation & payment status tracking.
Real-time Notifications
Socket.io push alerts for stage changes, new leads & payment events.
Email Sequences
Automated Nodemailer email drips triggered on status transitions.
Analytics Dashboard
Conversion funnel, revenue pipeline & team performance with Chart.js.
Full
Stack
Lead CRM Platform

Technology Stack

  • Frontend: React 18 + Vite
  • Backend: Node.js + Express
  • Database: MySQL via Prisma ORM
  • Auth: JWT + Role Middleware
  • Realtime: Socket.io (WebSocket)
  • Automation: Node-cron (follow-up jobs)
  • Email: Nodemailer + SMTP
  • Payments: Stripe / Razorpay
  • Styling: Tailwind CSS + shadcn/ui
  • Repo: Monorepo (npm workspaces)
Request a Demo
Core Features

Lead System in Action

Every feature built around the sales workflow — from first capture to closed deal and payment collection.

Lead Capture & Assignment
Capture leads via forms or API import, auto-assign to agents by round-robin or manual rule.
Status Management
Drag-and-drop Kanban board to move leads across New → Contacted → Qualified → Negotiation → Closed.
Follow-up Automation
Node-cron jobs auto-schedule follow-up reminders, callbacks, and escalations per pipeline stage.
Payment Handling
Collect payments via Stripe/Razorpay links, track partial & full payments, generate invoices.
Real-time Notifications
Socket.io pushes instant alerts to agents and managers on lead changes, payments, and deadlines.
Email Drip Sequences
Nodemailer sends automated email sequences triggered by lead stage transitions.
SMS Alerts
Twilio-powered SMS sent to leads and agents at key pipeline milestones.
Conversion Analytics
React + Chart.js funnel charts, win/loss rates, revenue pipeline, and agent leaderboards.
Activity Log
Full audit trail of every status change, note, call log, and payment event per lead.
Request a Live Demo
Follow-up Engine

Automation & Notifications

The Node.js follow-up engine runs scheduled cron jobs that evaluate every lead's last-contact date and pipeline stage, then automatically triggers the next action — zero manual effort for the sales team.

All notification channels (Socket.io, Email, SMS) are unified through a single NotificationService in the shared package, so any Node.js event can push to all channels at once.

Node-cron runs every 15 mins to check overdue follow-ups
Nodemailer sends stage-specific email templates automatically
Twilio SMS fires at key deal milestones & deadlines
Socket.io pushes real-time in-app alerts to dashboard
FOLLOW-UP AUTOMATION FLOW
Lead Created
Agent assigned, welcome email sent via Nodemailer
No contact in 24h
Node-cron fires → agent gets Socket.io alert + SMS reminder
Status → Contacted
Email drip #1 sent to lead, CRM activity log updated
Status → Qualified
Payment link generated via Stripe & sent to lead by email
Payment Received
Webhook triggers invoice PDF, lead marked Closed/Won
Deal Lost
Automated re-engagement email scheduled for 30 days later
Outcomes

Results & Impact

Measurable improvements across the sales team after Lead Management System implementation.

40%
Increase in lead conversion rate
0
Missed follow-ups with automation engine
3x
Faster pipeline visibility for managers
100%
Payments tracked with full audit trail
The Takeaway

Why This Case Study Matters

Proves real-world CRM scalability with React + Node.js stack
Demonstrates expertise in building backend automation engines
Shows end-to-end payment integration inside a CRM system
Builds trust for sales-heavy businesses needing a custom CRM
System Highlights
Lead Conversion Rate 40%↑
Follow-up Automation 100%
Payment Tracking 100%
Pipeline Visibility Real-time
Request a Demo
Image
Hill Shape Image
40% Higher Lead Conversion — Let's Build Your CRM

Ready to Automate Your Sales Pipeline?

Request a Quote
Talk to Expert
React 18 + Vite Node.js + Express Socket.io Realtime Follow-up Automation Stripe Payments Twilio SMS Nodemailer Node-cron Jobs Kanban Pipeline JWT Auth
We use cookies to improve your browsing experience, serve personalized ads, and analyze traffic. By clicking "Accept", you consent to our use of cookies.