Aplicación CRM
Construido con Agente de IA
Plantilla Flutter

Plantilla de Backend para la App CRM
Flutter — Guía de Esquema, API y AI

Un esquema de backend de Flutter CRM listo para producción y un Kit de Inicio en Back4app: Contacto, Empresa, Negocio, Actividad, etapas del pipeline, diagrama ER, diccionario de datos, esquema JSON, playground de API, y un prompt de Agente de AI con un clic para desplegar en minutos.

Construido con Agente de IA

Puntos Clave

En esta página obtienes un esquema de CRM listo para producción, un prompt de AI con un clic, y código Flutter paso a paso — para que puedas lanzar una app CRM sin construir el backend.

  1. Despliega en minutos — Pega el aviso del Agente de IA y obtén una aplicación en funcionamiento con contactos, empresas, ofertas y pipeline.
  2. Seguro por defecto — ACLs y acceso basado en roles para que los usuarios vean solo sus ofertas y datos asignados.
  3. Flutter-SDK nativo — Objetos tipados, async/await, fijación offline y Live Queries para actualizaciones de pipeline.
  4. REST + GraphQL — Ambas APIs generadas automáticamente; filtra ofertas por etapa, lista actividades por relacionado con.
  5. Cinco clases — _Usuario (incorporado), Empresa, Contacto, Oferta (pipeline), Actividad (tareas/eventos).

¿Qué es la plantilla de backend de la aplicación CRM de Flutter?

La plantilla de backend de la aplicación CRM de Flutter es un esquema de Back4app listo para producción (Contact, Company, Deal, Activity) con un SDK de Dart tipado, fijación offline y Live Queries. Construye una única base de código para iOS y Android: consulta ofertas por etapa, gestiona contactos y empresas, y sincroniza datos del canal de ventas en tiempo real. Sin backend personalizado ni pegamento REST: el SDK de Back4app Flutter maneja la autenticación, CRUD y almacenamiento local para que te enfoques en la interfaz de usuario y la lógica de negocio.

Mejor para:

Equipos de ventasCreadores de CRMPrototipado rápidoRepresentantes de campoLanzamientos de MVPEquipos eligiendo un BaaS para CRM

Descripción general

Las aplicaciones CRM de Flutter necesitan contactos, ofertas, etapas del pipeline y sincronización offline opcional. El esquema de Back4app (Empresa, Contacto, Oferta, Actividad) se ajusta al SDK de Flutter: QueryBuilder para filtrar por etapa, pinning para almacenamiento local y Live Queries para actualizaciones en tiempo real del pipeline.

Las cinco clases a continuación — _User, Company, Contact, Deal, Activity — están expuestas a través del SDK de Back4app Flutter. Usa tipos de Dart y async/await para obtener ofertas por etapa, crear contactos y ofertas, y registrar actividades. No hay REST ni cableado de GraphQL en tu aplicación; el SDK maneja la serialización y sincronización.

Características principales del CRM

Con Flutter y el SDK de Parse obtienes gestión de contactos, pipeline de negocios y seguimiento de actividades, además de fijación offline y Live Queries para un backend de CRM completo.

Gestión de contactos

Almacena y gestiona contactos con nombre, correo electrónico, teléfono, empresa y notas. Ideal para aplicaciones Flutter.

Gestión de empresas

Rastrea empresas con nombre, sitio web, industria y dirección. Enlaces a contactos y ofertas.

Tubería de ofertas

Tubería de ventas con etapas, monto, fecha de cierre esperada y asignación. Construido para backends de Flutter.

Seguimiento de actividades

Registra llamadas, correos electrónicos, reuniones y notas vinculadas a contactos y negocios. Funciona con el SDK de Flutter.

Usuario y permisos

Modelo de usuario integrado y punteros para propiedad y asignación. ACLs listos para usar para Flutter.

¿Por qué construir tu backend CRM de Flutter con Back4app?

Back4app te proporciona un backend listo y un SDK tipado para que puedas construir tu aplicación CRM con pipeline, contactos y ofertas sin escribir código REST o gestionar la autenticación tú mismo.

  • •SDK tipado y serialización: Los objetos tipados del SDK mantienen Contact, Company, Deal y Activity seguros en cuanto a tipos; el SDK maneja JSON para que escribas menos código repetitivo.
  • •Primero asincrónico y fuera de línea: El SDK Back4app Flutter utiliza async/await y fijación; el pipeline y los contactos funcionan sin conexión y se sincronizan al volver a estar en línea.
  • •Sincronización Live Queries / Reactiva: Suscríbete a los cambios de Deal y Activity para que el pipeline y el panel de control se actualicen en tiempo real.

Mismo esquema y APIs para cada stack—cambia de clientes más tarde sin cambiar el backend.

Beneficios principales

Un backend CRM listo para producción para que puedas enviar más rápido y concentrarte en tu aplicación.

Envía más rápido, sin código de backend

APIs REST y GraphQL y un esquema listo para usar — conecta tu aplicación y listo.

Seguro por defecto

ACLs y permisos a nivel de clase; restringir por assignedTo y createdBy.

Pipeline en Tiempo Real

Live Queries sobre WebSockets para actualizaciones instantáneas de ofertas y actividades.

Autenticación Integrada

Registro de usuario, inicio de sesión y manejo de sesiones listos para usar.

Funciona Sin Conexión

El anclaje local mantiene contactos y ofertas disponibles sin conexión y se sincroniza cuando te reconectas.

Despliega en Minutos

Usa el Agente de IA para crear y desplegar tu aplicación CRM a partir de esta plantilla.

¿Listo para probarlo?

Deja que el agente de IA de Back4app cree el backend de tu aplicación CRM, conecte el frontend Flutter y despliegue — todo desde un solo aviso.

Construir con el agente de IAPrueba el API Playground

Gratis para comenzar — 50 avisos de agente de IA/mes, no se requiere tarjeta de crédito

Pila técnica

Todo lo que impulsa esta plantilla de aplicación CRM de un vistazo.

Frontend
Flutter
Backend
Back4app
Base de datos
MongoDB
Autenticación
Autenticación y Control de Acceso
APIs
REST y GraphQL
Despliegue
Agente de IA / Panel de control

Diagrama ER

Diagrama de entidad-relación para el modelo de datos de la aplicación CRM Flutter.

Ver fuente del diagrama
Mermaid
erDiagram
    _User {
        String objectId PK
        String username
        String email
        String password
        Date createdAt
        Date updatedAt
    }

    Company {
        String objectId PK
        String name
        String website
        String industry
        String address
        String notes
        Pointer createdBy FK
        Date createdAt
        Date updatedAt
    }

    Contact {
        String objectId PK
        String name
        String email
        String phone
        Pointer company FK
        String notes
        Pointer createdBy FK
        Date createdAt
        Date updatedAt
    }

    Deal {
        String objectId PK
        String title
        Number amount
        String stage
        Pointer contact FK
        Pointer company FK
        Date expectedCloseDate
        String notes
        Pointer assignedTo FK
        Date createdAt
        Date updatedAt
    }

    Activity {
        String objectId PK
        String type
        String subject
        String description
        Date dueDate
        Date completedAt
        Pointer relatedTo FK
        Pointer createdBy FK
        Date createdAt
        Date updatedAt
    }

    Company ||--o{ Contact : "has"
    Company ||--o{ Deal : "has"
    Contact ||--o{ Deal : "has"
    _User ||--o{ Deal : "assignedTo"
    _User ||--o{ Activity : "createdBy"
    Contact ||--o{ Activity : "relatedTo"
    Deal ||--o{ Activity : "relatedTo"
    _User ||--o{ Company : "createdBy"
    _User ||--o{ Contact : "createdBy"

Flujo de integración

Secuencia de Auth-to-CRUD: cómo tu aplicación Flutter se comunica con Back4app — iniciar sesión, luego consultar contactos y negocios, actualizar el pipeline.

Ver fuente del diagrama
Mermaid
sequenceDiagram
  participant User
  participant App as Flutter App
  participant Back4app as Back4app Cloud

  User->>App: Login
  App->>Back4app: Parse().login(username, password)
  Back4app-->>App: Session token
  App-->>User: Logged in

  User->>App: Load contacts and deals
  App->>Back4app: Query<Deal>().find() or Query<Contact>().find()
  Back4app-->>App: List<Deal> / List<Contact>
  App-->>User: Show pipeline

  User->>App: Create deal or contact
  App->>Back4app: deal.save() or contact.save()
  Back4app-->>App: Deal (objectId)
  App-->>User: Updated list

Diccionario de datos

Referencia completa de campos para cada clase en el esquema.

CampoTipoDescripciónRequerido
objectIdStringAuto-generated unique identifierautomático
nameStringFull name of the contact
emailStringEmail address—
phoneStringPhone number—
companyPointer<Company>Company this contact belongs to—
notesStringFree-form notes—
createdByPointer<_User>User who created this contact—
createdAtDateAuto-generated creation timestampautomático
updatedAtDateAuto-generated last-update timestampautomático

9 campos en Contact

Seguridad y permisos

Cómo la propiedad, ACLs y permisos a nivel de clase protegen los datos en este esquema de CRM.

ACLs a Nivel de Fila

Usa ACLs y punteros (assignedTo, createdBy) para que los usuarios solo vean y editen sus tratos asignados y datos relacionados.

Permisos a Nivel de Clase

Los CLPs restringen qué roles o usuarios pueden crear, leer, actualizar o eliminar objetos a nivel de clase.

Propiedad Basada en Punteros

Deal.assignedTo y Activity.createdBy se vinculan a _User; Cloud Code puede hacer cumplir la visibilidad y las ediciones por rol.

Esquema (JSON)

Definición de esquema JSON en bruto — copia y usa en tu aplicación Back4app o importa a través de la API.

JSON
{
  "classes": [
    {
      "className": "Contact",
      "fields": {
        "objectId": {
          "type": "String",
          "required": false
        },
        "name": {
          "type": "String",
          "required": true
        },
        "email": {
          "type": "String",
          "required": false
        },
        "phone": {
          "type": "String",
          "required": false
        },
        "company": {
          "type": "Pointer",
          "targetClass": "Company",
          "required": false
        },
        "notes": {
          "type": "String",
          "required": false
        },
        "createdBy": {
          "type": "Pointer",
          "targetClass": "_User",
          "required": false
        },
        "createdAt": {
          "type": "Date",
          "required": false
        },
        "updatedAt": {
          "type": "Date",
          "required": false
        }
      }
    },
    {
      "className": "Company",
      "fields": {
        "objectId": {
          "type": "String",
          "required": false
        },
        "name": {
          "type": "String",
          "required": true
        },
        "website": {
          "type": "String",
          "required": false
        },
        "industry": {
          "type": "String",
          "required": false
        },
        "address": {
          "type": "String",
          "required": false
        },
        "notes": {
          "type": "String",
          "required": false
        },
        "createdBy": {
          "type": "Pointer",
          "targetClass": "_User",
          "required": false
        },
        "createdAt": {
          "type": "Date",
          "required": false
        },
        "updatedAt": {
          "type": "Date",
          "required": false
        }
      }
    },
    {
      "className": "Deal",
      "fields": {
        "objectId": {
          "type": "String",
          "required": false
        },
        "title": {
          "type": "String",
          "required": true
        },
        "amount": {
          "type": "Number",
          "required": false
        },
        "stage": {
          "type": "String",
          "required": false
        },
        "contact": {
          "type": "Pointer",
          "targetClass": "Contact",
          "required": false
        },
        "company": {
          "type": "Pointer",
          "targetClass": "Company",
          "required": false
        },
        "expectedCloseDate": {
          "type": "Date",
          "required": false
        },
        "notes": {
          "type": "String",
          "required": false
        },
        "assignedTo": {
          "type": "Pointer",
          "targetClass": "_User",
          "required": false
        },
        "createdAt": {
          "type": "Date",
          "required": false
        },
        "updatedAt": {
          "type": "Date",
          "required": false
        }
      }
    },
    {
      "className": "Activity",
      "fields": {
        "objectId": {
          "type": "String",
          "required": false
        },
        "type": {
          "type": "String",
          "required": false
        },
        "subject": {
          "type": "String",
          "required": false
        },
        "description": {
          "type": "String",
          "required": false
        },
        "dueDate": {
          "type": "Date",
          "required": false
        },
        "completedAt": {
          "type": "Date",
          "required": false
        },
        "relatedTo": {
          "type": "Pointer",
          "required": false
        },
        "createdBy": {
          "type": "Pointer",
          "targetClass": "_User",
          "required": false
        },
        "createdAt": {
          "type": "Date",
          "required": false
        },
        "updatedAt": {
          "type": "Date",
          "required": false
        }
      }
    },
    {
      "className": "_User",
      "fields": {
        "objectId": {
          "type": "String",
          "required": false
        },
        "username": {
          "type": "String",
          "required": true
        },
        "email": {
          "type": "String",
          "required": true
        },
        "password": {
          "type": "String",
          "required": true
        },
        "createdAt": {
          "type": "Date",
          "required": false
        },
        "updatedAt": {
          "type": "Date",
          "required": false
        }
      }
    }
  ]
}

Construir con el Agente de IA

Utiliza el Agente de IA de Back4app para construir una aplicación CRM real a partir de esta plantilla: creará el frontend, el backend (este esquema, autenticación y APIs) y lo desplegará — sin configuración manual. El aviso a continuación describe esta pila CRM para que el Agente pueda generar una aplicación lista para producción de una sola vez.

Agente de IA Back4app
Listo para construir
Crea una aplicación CRM en Back4app con este esquema y comportamiento exactos.

Esquema:
1. _Usuario (usar Back4app incorporado): nombre de usuario (String, requerido), correo electrónico (String, requerido), contraseña (String, requerido); objectId, createdAt, updatedAt (sistema).
2. Empresa: nombre (String, requerido), sitio web (String), industria (String), dirección (String), notas (String), creadoPor (Puntero a _Usuario); objectId, createdAt, updatedAt (sistema).
3. Contacto: nombre (String, requerido), correo electrónico (String), teléfono (String), empresa (Puntero a Empresa), notas (String), creadoPor (Puntero a _Usuario); objectId, createdAt, updatedAt (sistema).
4. Negocio: título (String, requerido), monto (Número), etapa (String; por ejemplo, cliente potencial, calificado, propuesta, negociación, ganado, perdido), contacto (Puntero a Contacto), empresa (Puntero a Empresa), fechaEsperadaCierre (Fecha), notas (String), asignadoA (Puntero a _Usuario); objectId, createdAt, updatedAt (sistema).
5. Actividad: tipo (String; por ejemplo, llamada, correo electrónico, reunión, nota), asunto (String), descripción (String), fechaVencimiento (Fecha), completadoEn (Fecha), relacionadoCon (Puntero a Contacto o Negocio), creadoPor (Puntero a _Usuario); objectId, createdAt, updatedAt (sistema).

Seguridad:
- Establecer ACLs para que solo los usuarios autenticados puedan acceder a los datos; usar reglas basadas en roles o basadas en propietarios donde sea apropiado (por ejemplo, asignadoA, creadoPor).
- Usar Permisos a Nivel de Clase para que solo los usuarios autenticados puedan crear/leer/actualizar/eliminar estas clases.

Autenticación:
- Registro (nombre de usuario, correo electrónico, contraseña) e inicio de sesión; soporte para cerrar sesión/sesión.

Comportamiento:
- CRUD completo para Empresa, Contacto, Negocio y Actividad.
- Listar negocios con filtro por etapa y ordenar por fechaEsperadaCierre o updatedAt (vista de pipeline).
- Listar actividades por relacionadoCon (Contacto o Negocio).
- Opcional: Live Queries en tiempo real para Negocio y Actividad para actualizaciones de panel/pipeline.
- Opcional: fijación fuera de línea para móvil (Contactos, Negocios, Actividades).

Entregar:
- Crear la aplicación Back4app con el esquema anterior, ACLs y cualquier Código en la Nube necesario.
- Generar el frontend y conectarlo a este backend; desplegar para que la aplicación sea ejecutable de extremo a extremo.

Presiona el botón a continuación para abrir el Agente con el aviso de esta plantilla prellenado.

Desplegar en minutos50 mensajes gratuitos / mesNo se requiere tarjeta de crédito

API Playground

Prueba los endpoints REST y GraphQL para el esquema CRM. Respuestas de los datos de ejemplo anteriores — no se necesita cuenta de Back4app.

Cargando espacio de trabajo…

Utiliza el mismo esquema CRM (Contacto, Empresa, Negocio, Actividad) que esta plantilla.

Integración paso a paso Flutter

Conéctate a tu backend de Back4app desde una app Flutter utilizando el SDK Back4app Flutter.

  1. Paso 1: Instalar el SDK Back4app Flutter

    Agrega el SDK Back4app para tu stack (por ejemplo, npm, pubspec o gestor de paquetes).

    YAML
    dependencies:
  flutter:
    sdk: flutter
  parse_server_sdk_flutter: ^7.0.0

  2. Paso 2: Inicializa Back4app en tu app

    Inicializa el SDK de Back4app al iniciar la aplicación con tu ID de aplicación y URL del servidor.

    Dart
    import 'package:parse_server_sdk_flutter/parse_server_sdk_flutter.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();

  await Parse().initialize(
    'YOUR_APP_ID',
    'https://parseapi.back4app.com',
    clientKey: 'YOUR_CLIENT_KEY',
    autoSendSessionId: true,
  );

  runApp(const MyApp());
}

  3. Paso 3: Consultar contactos y ofertas

    Utiliza el SDK para obtener objetos de Contacto y Oferta; filtra las ofertas por etapa para el pipeline.

    Dart
    Future<List<ParseObject>> getDeals({String stage = 'qualified'}) async {
  final query = QueryBuilder<ParseObject>(ParseObject('Deal'))
    ..whereEqualTo('stage', stage)
    ..orderByAscending('expectedCloseDate');

  final response = await query.query();
  if (response.success && response.results != null) {
    return response.results as List<ParseObject>;
  }
  return [];
}
Future<List<ParseObject>> getContacts() async {
  final query = QueryBuilder<ParseObject>(ParseObject('Contact'));
  final response = await query.query();
  if (response.success && response.results != null) {
    return response.results as List<ParseObject>;
  }
  return [];
}

  4. Paso 4: Crear un contacto u oferta

    Crea un nuevo Contacto u Oferta con los campos y punteros requeridos (empresa, contacto, asignadoA), luego guarda.

    Dart
    Future<void> createDeal(String title, {String stage = 'lead', double? amount}) async {
  final deal = ParseObject('Deal')
    ..set('title', title)
    ..set('stage', stage);
  if (amount != null) deal.set('amount', amount);
  await deal.save();
}
Future<void> createContact(String name, {String? email, String? phone}) async {
  final contact = ParseObject('Contact')..set('name', name);
  if (email != null) contact.set('email', email);
  if (phone != null) contact.set('phone', phone);
  await contact.save();
}

  5. Paso 5: Actualizar la etapa de la oferta y actividades

    Actualiza Deal.stage al mover en el pipeline; crea y lista Actividad por relacionadoCon.

    Dart
    // Update deal stage (e.g. move in pipeline)
Future<void> updateDealStage(String objectId, String stage) async {
  final deal = ParseObject('Deal')..objectId = objectId;
  deal.set('stage', stage);
  await deal.save();
}

// Delete a deal
Future<void> deleteDeal(String objectId) async {
  final deal = ParseObject('Deal')..objectId = objectId;
  await deal.delete();
}

Integración de Gestión de Estado

Integra el SDK de Back4app con la capa de estado de tu aplicación (por ejemplo, contexto, tienda o servicios) para el estado de pipeline y contacto.

Modelo de Datos Completo

Copia un modelo CRM completo para la serialización segura por tipo (por ejemplo, clase, interfaz o definición de tipo).

Dart
class Deal {
  final String? objectId;
  final String title;
  final double? amount;
  final String? stage;
  final DateTime? expectedCloseDate;
  final String? contactId;
  final String? companyId;
  final String? assignedToId;
  final DateTime? createdAt;
  final DateTime? updatedAt;

  Deal({
    this.objectId,
    required this.title,
    this.amount,
    this.stage = 'lead',
    this.expectedCloseDate,
    this.contactId,
    this.companyId,
    this.assignedToId,
    this.createdAt,
    this.updatedAt,
  });

  factory Deal.fromJson(Map<String, dynamic> json) {
    return Deal(
      objectId: json['objectId'] as String?,
      title: json['title'] as String,
      amount: (json['amount'] as num?)?.toDouble(),
      stage: json['stage'] as String? ?? 'lead',
      expectedCloseDate: json['expectedCloseDate'] != null ? DateTime.parse(json['expectedCloseDate']) : null,
      contactId: json['contact'] is Map ? (json['contact'] as Map)['objectId'] as String? : null,
      companyId: json['company'] is Map ? (json['company'] as Map)['objectId'] as String? : null,
      assignedToId: json['assignedTo'] is Map ? (json['assignedTo'] as Map)['objectId'] as String? : null,
      createdAt: json['createdAt'] != null ? DateTime.parse(json['createdAt']) : null,
      updatedAt: json['updatedAt'] != null ? DateTime.parse(json['updatedAt']) : null,
    );
  }
}

Offline-First y Almacenamiento Local

Utiliza pin() y unpin() para que los contactos y las ofertas estén disponibles sin conexión y se sincronicen al volver a estar en línea.

Los SDK compatibles incluyen un almacenamiento local. Fija objetos de Contacto, Oferta y Actividad para mantenerlos en el dispositivo; consulta datos fijados cuando estés sin conexión. Cuando la aplicación vuelva a estar en línea, sincroniza con el servidor.

A continuación: fija resultados después de la búsqueda y deshazte de la fijación cuando ya no necesites copias locales.

Dart
// Pin deals after fetch (offline-first)
Future<void> fetchAndPinDeals() async {
  final query = QueryBuilder<ParseObject>(ParseObject('Deal'))
    ..whereEqualTo('stage', 'qualified')
    ..orderByDescending('expectedCloseDate');
  final response = await query.query();
  if (response.success && response.results != null) {
    final results = response.results!.cast<ParseObject>();
    await ParseObject.pinAllObjects(results);
    // Now query from local store when offline:
    // QueryBuilder<ParseObject>(ParseObject('Deal')).fromLocalDatastore();
  }
}

// Unpin when no longer needed
Future<void> unpinAllDeals() async {
  await ParseObject.unpinAll('Deal');
}

Preguntas Frecuentes

Preguntas comunes sobre la plantilla del backend de la aplicación CRM.

¿Qué es Back4app?
¿Por qué usar Back4app para una aplicación CRM Flutter?
¿Cómo consulto negocios por etapa en Flutter?
¿El SDK Flutter soporta datos CRM offline?

Confiado por desarrolladores de todo el mundo

Únete a la comunidad que está construyendo el futuro de las aplicaciones

G2 Users Love Us Badge

¿Listo para construir tu aplicación CRM?

Comienza tu proyecto Flutter en minutos. No se requiere tarjeta de crédito.

Construye con Agente AI