Back to Projects

HubSpot Chrome Extension

Integrating MCM Telecom Services with HubSpot CRM

Hubspot Chrome Extension

Role

Software Developer

Timeline

2023 -2024

Technologies

AWS Lambda, SQS, API Gateway, DynamoDB, React, HubSpot API, WhatsApp Business API

Project Overview

This project was centered around developing a Chrome extension for HubSpot to seamlessly integrate MCM Telecom's services with the HubSpot CRM. The extension enables users to efficiently manage mass messaging campaigns, sending SMS and WhatsApp messages directly from HubSpot contact lists.

This tool is designed to enhance communication and streamline marketing efforts by leveraging existing contact data and approved WhatsApp templates.

Key Contributions

Mass Messaging Integration

Developed features for mass sending of SMS and WhatsApp messages, allowing users to easily create campaigns from their HubSpot contact lists. This included handling the complexities of template management for WhatsApp, ensuring compliance with platform guidelines.

Custom HubSpot Workflow Actions

Created custom actions within HubSpot workflows to enable automated sending of SMS and WhatsApp messages. This feature enhances automation capabilities, allowing businesses to maintain regular and personalized communication with their contacts.

Serverless Architecture Design

Architected a robust serverless backend using AWS services, including Lambda functions, API Gateway, SQS for message queuing, and DynamoDB for scalable data storage. This architecture was optimized for the asynchronous nature of messaging services, ensuring high availability and performance.

React Frontend Development

Built a React app to provide a user-friendly interface for managing campaigns and message templates. Employed best practices such as React Router for navigation, TanStack Query for data management, Axios for API interactions, and custom hooks for reusability and clean code.

WhatsApp API Integration

Integrated WhatsApp Business API to support template-based messaging, including proper handling of message statuses via webhooks. This integration required careful attention to API limits, compliance, and error handling to ensure a smooth user experience.

OAuth and Security Management

Implemented OAuth flow for HubSpot API integration, ensuring secure and efficient authorization for users. This involved managing tokens and permissions in a way that aligns with HubSpot’s security requirements and best practices.

Challenges and Solutions

One of the primary challenges was designing a secure and scalable serverless architecture that could handle high volumes of messages asynchronously. This was achieved by leveraging AWS best practices, optimizing API Gateway setups, Lambda function executions, and SQS queue configurations for reliable and secure message processing.

Properly designing DynamoDB tables and indexes to accommodate varied access patterns was crucial. This involved creating appropriate partition and sort keys and implementing global secondary indexes to support dynamic queries without compromising performance.

Integrating the WhatsApp API required precise handling of template approvals and webhook notifications for message status updates. We addressed this by developing a robust error handling and retry mechanism to ensure message delivery and status tracking integrity.

Navigating the OAuth flow with HubSpot’s API posed challenges, particularly in maintaining secure and seamless user sessions. This was managed by implementing a reliable token management system, adhering to OAuth best practices, and ensuring smooth user authentication and authorization flows.

Results and Impact

Although specific statistics are confidential, the HubSpot Chrome extension successfully enhanced MCM Telecom's integration capabilities, providing a streamlined solution for mass messaging directly from HubSpot. The project met all functional and security requirements, demonstrating the effectiveness of a well-designed serverless architecture combined with a robust React frontend.

Technologies Used

React React
AWS AWS
Hubspot Hubspot
WhatsApp WhatsApp
Chrome Chrome
Tanstack Query Tanstack Query
React Router React Router