Aviso:

Para brindarle información de soporte completa de manera más rápida, el contenido de esta página ha sido traducido al español mediante traducción automática. Para consultar la información de soporte más precisa, consulte la versión en inglés de este contenido.

Aplicación generadora de nóminas

Introducción

Este tutorial le ayudará a construir una aplicación en Catalyst que genera nóminas de empleados. La aplicación permitirá a los usuarios estilizar la plantilla de la nómina de la empresa, ingresar detalles del empleado en un formulario y enviar la nómina a los empleados respectivos por correo electrónico.

La aplicación client se verá así:

smartbrowz_tutorial_payslip_first_look

El correo electrónico enviado al empleado se verá así: smartbrowz_tutorial_payslip_first_look_email

La nómina que se genera y envía por correo electrónico como PDF se verá así: smartbrowz_tutorial_payslip_first_look_template

Puede acceder a una aplicación funcional y probar su funcionalidad aquí: ¡Pruebe la App!

La aplicación Payslip Generator utiliza los siguientes Servicios de Catalyst y sus componentes:

  1. Catalyst SmartBrowz

    • Templates: Templates se utiliza para crear una plantilla personalizada de una nómina.
    • PDF & Screenshot: PDF & Screenshot se utilizará para probar la plantilla y generar PDFs de la plantilla en el backend.
  2. Catalyst Serverless

    • Función Advanced I/O: La función Advanced I/O puede codificarse usando Node.js. Contiene las APIs que le permiten alimentar los detalles a su plantilla personalizada y activar el componente Mail para enviar un correo electrónico al empleado.
  3. Catalyst Cloud Scale

    • Web Client Hosting: El frontend/client de la aplicación se alojará en Catalyst usando Web Client Hosting. Puede inicializar y crear su web client como una aplicación web básica usando plugins nativos de Catalyst.
    • Mail: Mail se utiliza para configurar la dirección de correo electrónico desde la cual se enviarán los correos electrónicos automatizados a los empleados.

Utilizaremos la consola web de Catalyst y la Interfaz de Línea de Comandos (CLI) de Catalyst para construir esta aplicación.

Se le proporcionará el código para los archivos que se incluirán en los componentes de función y client en este tutorial. Tendrá que copiar el código proporcionado aquí y pegarlo en los archivos apropiados según se indique.

Arquitectura de la aplicación

La lógica de la aplicación generadora de nóminas se describe a continuación:

catalyst_payslip_architecture

  • Enviar el formulario: El usuario final ingresará los detalles del empleado en el formulario mostrado en el lado del client, como nombre, cargo, ID, correo electrónico, salario base, deducciones, asignaciones y método de pago. Una vez ingresados los detalles, el usuario hará clic en Submit.

  • Se activará el SDK de PDF & Screenshot: En el backend, se activará el SDK de PDF & Screenshot, y se lanzará un navegador headless. Usando el Template ID generado por Catalyst, los detalles recopilados en el formulario se renderizarán en la plantilla y se convertirán en un PDF.

  • Se enviará el correo electrónico: El PDF generado se enviará por correo electrónico como un archivo adjunto al correo electrónico ingresado en el formulario usando el SDK de Send Mail, que invoca el componente Mail. Se notificará al usuario que el correo electrónico ha sido enviado, y el formulario se actualizará y estará listo para recibir los siguientes detalles del usuario.


Última actualización 2026-03-20 21:51:56 +0530 IST

Tiempo mínimo para completar:

20 mins

Nivel de dificultad:

Beginner

SERVICIOS INVOLUCRADOS

Serverless Cloud Scale SmartBrowz

COMPONENTES INVOLUCRADOS

Functions Web Client Templates Mail