Pular para o conteúdo
Todos os projetos

Projetos internos · Seguros

ERP de Seguros

Projetos internos de seguros de vida, saúde, bens e plataformas, com árvores de milhares de permissões e scripts de até 100 mil caracteres sem travar o navegador

Cliente
Prudential, Berkley, Porto e outros players · via i4Pro
Cargo
Desenvolvedor Front-end
Tecnologias
  • Vue.js
  • Vuetify
  • Vuex
  • Vite
  • JavaScript
  • BFF
Projeto confidencialAs telas estão sob acordo de confidencialidade (NDA). O que está descrito aqui é o que pode ser compartilhado.VidaSaúdeBensPlataformas

Contexto

ERP de seguros da i4Pro, base de projetos internos para grandes players como Prudential, Berkley e Porto, em linhas de seguro de vida, saúde e bens e em plataformas. O front-end, em Vue.js com Vuetify e Vuex, segue uma arquitetura BFF (Backend for Frontend) e consome APIs RESTful .NET (C#) apoiadas em stored procedures do SQL Server.

Desafio

Exibir no navegador árvores com milhares de permissões por instância e copiar scripts de até 100.000 caracteres sem travar a interface, migrar as aplicações front-end do ERP do Vue 2 para o Vue 3 com Vite e co-liderar decisões estratégicas e tecnológicas dos produtos para grandes players.

Resultados

mais performance nas aplicações e integrações após a migração para o Vue 3 com Vite
40–45%
caracteres: o tamanho máximo dos scripts copiados sem travar a interface
100k

Principais entregas

  1. 01Liderei a migração das aplicações front-end do ERP do Vue 2 para o Vue 3 com Vite, melhorando em 40% a 45% a performance das aplicações e integrações.
  2. 02Desenvolvi funcionalidades em Vue.js, com Vuetify e Vuex, para projetos internos de seguradoras como Prudential, Berkley e Porto, em arquitetura BFF (Backend for Frontend) que consome APIs RESTful .NET (C#) apoiadas em stored procedures do SQL Server.
  3. 03Construí uma árvore de permissões por instância, alimentada pelas APIs .NET que listavam milhares de permissões, validando as instâncias e renderizando tudo com virtual scroll, lazy loading dos nós e processamento em lotes, sem travar o navegador.
  4. 04Implementei a cópia (clipboard) de scripts de até 100.000 caracteres sem travamento da interface.
  5. 05Atuei na liderança das decisões estratégicas de produto e tecnologia para os grandes players atendidos.

Funcionalidades e as dores que resolvem

Cada funcionalidade nasceu de um problema real da operação.

  1. 01

    Árvore de permissões por instância

    Dor
    As APIs .NET listam milhares de permissões por instância; exibir e validar tudo na tela é o tipo de volume que congela o navegador.
    Solução
    Uma árvore de permissões por instância, alimentada pelas APIs .NET, valida as instâncias e renderiza milhares de permissões com virtual scroll, lazy loading dos nós e processamento em lotes, sem travar o navegador.

    Impacto: Milhares de permissões por instância, sem travamento

  2. 02

    Clipboard de scripts longos

    Dor
    Scripts com dezenas de milhares de caracteres precisam ser copiados direto da interface, e uma cópia desse tamanho pode congelar a aba.
    Solução
    A cópia (clipboard) de scripts foi implementada para textos de até 100.000 caracteres sem travar a interface.

    Impacto: Até 100.000 caracteres por script

  3. 03

    Migração para o Vue 3 com Vite

    Dor
    As aplicações front-end do ERP em Vue 2 limitavam a performance das aplicações e das integrações usadas pelas seguradoras.
    Solução
    As aplicações front-end do ERP foram migradas do Vue 2 para o Vue 3 com Vite, trazendo ganho de performance às aplicações e às integrações.

    Impacto: +40% a 45% de performance

  4. 04

    Arquitetura BFF e integração com .NET

    Dor
    Os dados exibidos vêm de APIs .NET (C#) apoiadas em stored procedures do SQL Server, e a tela precisa refleti-los com fidelidade.
    Solução
    As funcionalidades em Vue.js, com Vuetify e Vuex, seguem uma arquitetura BFF (Backend for Frontend) e consomem as APIs RESTful .NET.

  5. 05

    Funcionalidades nativas de alta performance

    Dor
    Grandes volumes de dados precisam entrar na interface sem degradar a experiência de quem opera o sistema no dia a dia.
    Solução
    A árvore de permissões e o clipboard de scripts foram construídos como funcionalidades nativas do produto, para incorporar grandes volumes de dados com alta performance.

  6. 06

    Decisões estratégicas de produto

    Dor
    Cada player tem prioridades e exigências próprias em vida, saúde, bens e plataformas.
    Solução
    Atuei na liderança das decisões estratégicas e tecnológicas dos produtos para os players atendidos.