In this tutorial, we’ll walk through building a custom CRM (Customer Relationship Management system) using Lovable and Make. The goal is to create a functional CRM with:

  • Deal tracking (drag-and-drop functionality)
  • Contact management (modal views for editing)
  • AI-powered calling (using Vapi and Make)
  • Company data enrichment (using Apollo.io)

By the end, you’ll have a customized CRM that automates workflows without needing to code from scratch.

1

Setting Up Your CRM in Lovable

  • Go to Lovable and create a new project.
  • Set the project type as CRM.
  • Define key entities:
    • Deals (for tracking sales progress)
    • Contacts (representing potential clients)
    • Companies (the organizations you’re interacting with)
  • Select Light Theme (optional).
  • Click Generate.
2

Adding Deal Stages

  1. Open the Deals section in Lovable.
  2. Click Edit and introduce five stages:
    • Lead
    • Qualification
    • Proposal Sent
    • Negotiation
    • Closed - Won/Lost
  3. Enable Drag-and-Drop functionality for deals to move across stages.

Why? This allows users to track deals in a visual workflow.

3

Implementing a Contact Management System

  • Click on the Contacts section.
  • Modify the UI to include a clickable modal view when selecting a contact.
  • Ensure that:
    • The modal displays contact details.
    • Fields are editable for easy updates.

Why? Traditional CRMs redirect users to a new page, slowing down workflow. A modal keeps everything in place.

4

Adding an AI-Powered Call Feature

1

Connect Lovable to Make

  • Open Make and create a new scenario.
  • Add a Webhook module:
    • Click Webhooks > Custom Webhook.
    • Name it Call Contact.
    • Copy the webhook URL.
2

Configure Lovable to Send Call Data

  • In Lovable, go to Call Contact.
  • Modify the button’s action to send JSON data (name, phone number, company, and call goal) to the Make webhook.
  • Test the connection by clicking Call Contact.
3

Use Vapi for AI-Powered Calling

  • In Make, add an API Call module.
  • Configure it to send the call request to Vapi.
  • Set up a Vapi AI agent to:
    • Call the contact.
    • Read a custom script based on the deal stage.
    • Log call results in Lovable.

Now, when clicking Call Contact, an AI agent will make the call on your behalf.

5

Adding Company Enrichment with Apollo.io

1

Setup Make Webhook for Enrichment

  • In Make, create another Webhook named Enrich Company.
  • Copy the webhook URL.
2

Modify Lovable to Send Enrichment Requests

  • Add an Enrich Company button in the Companies section.
  • Modify its action to send the domain name as a JSON request to Make.
3

Configure Apollo API in Make

  • Add an API Call module in Make.
  • Use the Apollo.io** Organization Enrichment API**.
  • Pass the company domain to get:
    • Industry
    • Number of employees
    • Company address
    • Funding details

Now, clicking Enrich Company fetches real-time company data.

6

Making the Data More Readable

To structure the API response:

  • Modify Lovable to dynamically parse the JSON response.
  • Display results in a structured modal view.

Why? Raw JSON isn’t user-friendly. This ensures clean, readable data.

7

Securing API Calls with Supabase

To hide API calls using Supabase Edge Functions:

  • In Lovable, enable Supabase integration.
  • Create an Edge Function to proxy requests to Make.
  • Modify Lovable to call the Edge Function instead of Make’s webhook.

Why? This prevents unauthorized access to your webhook.

8

Automating Follow-Ups and Workflows

To automate Email campaigns based on Deal stages:

  • In Make, add an Email module.
  • Trigger email automation when:
    • A deal moves to the Proposal Sent stage.
    • A contact opens an email.

This keeps sales reps informed and automates customer engagement.

9

Final Testing and Deployment

1

Test Your CRM

  • Add a test deal and move it through the pipeline.
  • Add a contact and trigger a call.
  • Enrich a company’s details and verify data.
2

Deploy and Share

  • Use Lovable’s Custom Domain feature to personalize your CRM.
  • Share the app with your team.
10

🎉 Congratulations!

You’ve built a fully functional, AI-powered CRM with Lovable and Make\\\\!

Next Steps

  • Experiment with new integrations (Slack, Notion, HubSpot).
  • Automate lead scoring and AI-generated follow-ups.
  • Join Make Academy to explore advanced automation.

Was this page helpful?