Histórico da Página
| Índice |
|---|
Introdução e objetivo
...
Este guia foi estruturado para fornecer aos desenvolvedores de parceiros o embasamento técnico necessário para atuar na plataforma TOTVS Fluig. A conclusão desta trilha é o primeiro passo para garantir entregas de alta qualidade e segurança, alinhadas a plataforma TOTVS Fluigreúne os pré-requisitos, conteúdos de capacitação e padrões técnicos para parceiros. O objetivo é garantir que toda solução desenvolvida seja escalável, segura e compatível com as atualizações da plataforma.
| Informações | ||
|---|---|---|
| ||
O domínio destes conceitos fundamentais evita o retrabalho, reduz o débito técnico e assegura que o desenvolvimento sob a plataforma sejam compatíveis com as futuras atualizações do TOTVS Fluig. |
Configuração do ambiente de desenvolvimento
...
Antes de iniciar os cursos, configure sua estação de trabalho seguindo os padrões oficiais:
Infraestrutura e instalação: consulte as Especificações técnicas e o guia de Instalação e atualização para garantir a compatibilidade de atualizações.
IDE recomendada: utilize o Eclipse com o plugin Fluig Studio para exportação nativa de projetos. Caso prefira o VS Code, utilize extensões de suporte para JavaScript e JSON.
Banco de dados: certifique-se de realizar a Configuração de banco de dados seguindo as permissões de Schema necessárias para evitar erros de persistência.
Acesso ao portal Fluig Academy
...
Antes de iniciar, os membros da equipe técnica devem possuir uma conta ativa no portal TOTVS Fluig Academy:
Portal TOTVS Fluig Academy: Fluig Academy.
Primeiros Passospassos: Realize realize o cadastro com seu e-mail e matricule-se nos cursos listados nas trilhas abaixo.
...
Conteúdos de capacitação recomendados
...
A seguir, veja os conteúdos recomendados.
Desenvolvimento de
...
portais e
...
widgets
...
Esta trilha foca na camada de apresentação e componentes dinâmicos. O objetivo é capacitar o desenvolvedor na criação de interfaces dinâmicas e componentes para o ambiente de portais do TOTVS Fluig.
| Curso | Descrição detalhada para o Desenvolvedor |
|---|---|
| Como fazer - Instalar Eclipse 2019-R9 + Fluig Studio | Guia passo a passo para configurar o ambiente de desenvolvimento oficial (IDE) e o plugin Fluig Studio. |
| Iniciando o desenvolvimento de widgets | Conceitos fundamentais sobre a estrutura de uma widget, ciclo de vida e publicação no portal. |
| Client-side: Desenvolvimento desenvolvimento com ES6+ no TOTVS Fluig | Modernização do código Client-side utilizando as novas especificações do JavaScript para maior performancedesempenho. |
| Preferências da widget, como salvar e recuperar os dados | Aprenda a utilizar o mecanismo de persistência de dados para salvar e recuperar configurações customizadas personalizadas da widget. |
| Templates Mustache em widgets, aprenda a desenvolver | Implementação de renderização dinâmica. Aprenda a separar a estrutura HTML da lógica de dados, facilitando a manutenção. |
| Client-side: Integrações integrações eficientes com promises e async/await, incluindo datasets | Como realizar chamadas assíncronas eficientes para buscar dados internos (Datasetsdatasets) sem travar a interface do usuário.Widgets com APIs do TOTVS Fluig: Usuário logadoMétodos para capturar o contexto do usuário atual, permitindo a criação de widgets personalizadas com base em permissões e perfil. |
Consumo de APIs REST
...
Capacitação voltada para a camada de integração, permitindo que o TOTVS Fluig se comunique de forma segura com ERPs, sistemas legados, etc.
| Curso | Descrição detalhada para o Desenvolvedor |
|---|---|
| Introdução ao Swagger swagger do TOTVS Fluig - Básico I | Como utilizar o portal interativo de APIs para explorar, testar e entender os endpoints nativos disponíveis na plataforma. |
| Consumindo a API REST do TOTVS Fluig com Postman | Guia prático de como configurar autenticação (OAuth 1.0) e realizar requisições externas para a plataforma. |
Interface e
...
experiência (Style
...
guide)
...
O uso do Style Guideguide não é apenas visual. É uma questão de conformidade técnica. Seguir estes padrões garante que sua interface não "quebre" em novas atualizações do TOTVS Fluig.
| Curso | Descrição detalhada para o Desenvolvedor |
|---|---|
| Fluig Style Guideguide | Documentação oficial contendo a biblioteca de componentes, padrões de cores, tipografia e ícones. Item de consulta essencial antes de qualquer CSS customizado. |
| Style Guide guide - Datatable | Criação de grades de dados com recursos de busca, paginação e seleção, mantendo o padrão visual das rotinas nativas. |
| Style Guide guide - Filter | Implementação de campos de busca inteligente com autocompletar auto completar e filtros dinâmicos integrados a Datasets datasets. |
| Style Guide guide - Modal | Padronização de janelas de alerta, confirmação e formulários pop-up para melhorar a experiência do usuário. |
| Como fazer - TOTVS Fluig - Modal de seleção de documentos | Implementação técnica para abrir a estrutura de pastas de documentos e permitir que o usuário selecione arquivos de forma nativa. |
| Desenvolvendo widgets compatíveis com modo escuro | Modo escuro: certifique-se de estar desenvolvendo widgets compatíveis com modo escuro. |
Publicação e Store
...
Para parceiros que visam a escalabilidade e a distribuição de suas soluções.
| Curso | Descrição Detalhada detalhada para o Desenvolvedor |
|---|---|
| Adaptando seu componente para a TOTVS Store | Requisitos técnicos e boas práticas para transformar seu desenvolvimento em uma solução publicável na Store oficial. |
| Dica | ||
|---|---|---|
| ||
Antes de iniciar a codificação de uma nova widget, verifique sempre se o componente já existe no Style Guideguide para garantir a responsividade e compatibilidade com futuras atualizações do TOTVS Fluig. |
Manual de consulta técnica
...
Links diretos para a documentação técnica, padrões oficiais e resolução de problemas.
Configuração do ambiente e infraestrutura
...
Especificações técnicas e Instalação e atualização: requisitos e guias de atualização.
Configuração de banco de dados: padrões de Schema e permissões.
Controle de log: padronização para diagnóstico de soluções.
Padrões de desenvolvimento e Style Guide
...
- Desenvolvimento sobre a plataforma: documentações reunidas referentes à desenvolvimento sobre a plataforma.
Portal Fluig Style Guide: consulte para usar componentes nativos e CSS.
API JQuery: documentação da biblioteca padrão utilizada no Client-side da plataforma.
Arquitetura de componentes e WCM
...
Arquivo application.info: como configurar as propriedades de metadados do seu projeto.
Internacionalização (i18n): como criar componentes multi-idioma.
Central de componentes e Estrutura de páginas: entenda a hierarquia do portal.
Construção de widgets e layouts: guia técnico completo sobre a criação desses componentes.
Como criar um widget que busque conteúdo: passo a passo para widgets com funcionalidade de pesquisa.
Layouts: documentação sobre personalização de estruturas de página.
- Desenvolvendo widgets compatíveis com modo escuro: guia de adaptação visual para o modo escuro.
Closure Compiler Maven plugin: otimização e minificação de código.
Workflows e processos
...
Desenvolvimento de workflow: melhores práticas de modelagem e eventos de processo.
Migração para produção (Formulário 2.0): guia de transição para o novo motor de formulários.
Publicação, Store e suporte
...
Sample-component (Projeto base): projeto de exemplo para soluções compatíveis com a Store.
- Erro 401 - Unauthorized: FAQ técnica sobre problemas de autenticação em exemplos de desenvolvimento.
- FAQ da Plataforma: perguntas frequentes e diretrizes.
Dica técnica de On-boarding
...
| Dica | ||
|---|---|---|
| ||
Recomendamos que o desenvolvedor realize primeiro os cursos do portal Fluig Academy e mantenha os links do manual de consulta técnica salvo nos favoritos do navegador para consulta rápida durante a codificação. |
Visão Geral
Import HTML Content
Conteúdo das Ferramentas
Tarefas