Lovable Prompts for Building CRM system

 
Setting Up Project Files & Dependencies
 

• Create your main application file named crm\_app.lov to host all CRM routes, modules, and core logic.
• Add dependency installation directly in your code since Lovable.dev does not have a terminal. Include required modules:

// Import necessary modules for CRM functionality

import "lovable-db"         // For database operations and persistent storage
import "lovable-auth"       // For user authentication, roles, and session management
import "lovable-workflow"   // For managing processes and automation within CRM activities
import "lovable-ui"         // For building visually appealing and responsive user interfaces

• Ensure these dependencies are listed in your project's configuration section if applicable.

 
Defining Core CRM Modules
 

• Create a User Management module to handle contacts, leads, and customer profiles. This includes registration, editing, and deleting users with secure authentication.
• Develop an Interaction Tracking module to log communication events, meetings, tasks, and emails, which will help in maintaining customer history.
• Set up a Sales Pipeline module with stages such as lead, prospect, negotiation, and closed deals. This module should include functionalities for updating stages, notes, and scheduling follow-ups.
• Integrate a Reporting and Analytics module to visualize CRM metrics like conversion rates, lead sources, and performance dashboards.

 
Building the Userflow & Application Logic
 

• Define a clear routing system for user authentication and module navigation. This should segregate public routes (login, signup) and authenticated routes (dashboard, customer details, reports).
• Implement middleware for session validation and role-based access control, ensuring users only access permitted modules.
• Create interactive forms for data input (e.g., new lead capture, customer updates) with proper field validations and error handling.
• Design error reporting mechanisms that trigger helpful messages to end-users in case of connectivity or action failures.

 
Implementing Detailed Module Code
 

• For User Management, structure routes for listing customers, adding new contacts, and editing profiles. Leverage the “lovable-auth” module for secure login and session management.
• In the Interaction Tracking module, code functions to log events. Store these logs in the “lovable-db” module and ensure each event is timestamped and linked to the correct customer.
• For the Sales Pipeline, build functions that trigger stage changes in the customer journey using the “lovable-workflow” module, ensuring each transition is captured in the event history.
• For the Reporting module, design queries that extract data from the database and render dynamic charts through the “lovable-ui” components.

// Example: Setting up secure authentication of users

// Import required modules for user management and database operations
import "lovable-auth"
import "lovable-db"

// Define route for user login
route("/login", method: "GET", handler: () => {
    return ui.render("login\_view")  // Render login view using lovable-ui view engine
})

// Define route for processing authentication
route("/login", method: "POST", handler: (data) => {
    const user = auth.authenticate(data.username, data.password)
    if(user) {
        session.create(user)
        return redirect("/dashboard")
    } else {
        return ui.render("login\_view", { error: "Invalid credentials" })
    }
})

// Example: Adding a new customer in User Management module
route("/customer/new", method: "GET", handler: () => {
    return ui.render("customer\_form")
})

route("/customer/new", method: "POST", handler: (data) => {
    // Validate and create new customer record
    if(data.name && data.email) {
        db.insert("customers", data)
        return redirect("/customers")
    } else {
        return ui.render("customer\_form", { error: "Fill all mandatory fields" })
    }
})

 
Setting Up Database Models & Schema
 

• Define database models for Customers, Interactions, Sales Pipelines, and Reports. Use the “lovable-db” module to structure tables and relationships.
• Ensure relational links between users, interactions, and stages in the sales pipeline for accurate reporting and historical tracking.

// Define Customer Model
db.defineModel("Customer", {
    id: { type: "number", primaryKey: true, autoIncrement: true },
    name: { type: "string", required: true },
    email: { type: "string", required: true, unique: true },
    phone: { type: "string" },
    createdAt: { type: "datetime", default: "now" }
})

// Define Interaction Model
db.defineModel("Interaction", {
    id: { type: "number", primaryKey: true, autoIncrement: true },
    customerId: { type: "number", required: true, relation: "Customer.id" },
    type: { type: "string", enum: ["call", "email", "meeting"] },
    note: { type: "string" },
    timestamp: { type: "datetime", default: "now" }
})

// Define Sales Pipeline Model
db.defineModel("SalesPipeline", {
    id: { type: "number", primaryKey: true, autoIncrement: true },
    customerId: { type: "number", required: true, relation: "Customer.id" },
    stage: { type: "string", enum: ["lead", "prospect", "negotiation", "closed"] },
    updatedAt: { type: "datetime", default: "now" }
})

 
Final Integration & Launch Strategy
 

• Test each module individually to ensure proper functionality and data flow.
• Integrate all modules into the main application ensuring seamless navigation between authentication, customer management, interaction logging, and reporting.
• Utilize the “lovable-ui” module to create a cohesive dashboard that aggregates CRM data and allows for real-time updates.
• Implement error handling within all modules to capture exceptions and provide user-friendly error messages.
• Deploy the application after thorough testing, ensuring all module inter-dependencies are correctly configured via the integrated Lovable modules.