13 razões para usar o PO UI

Rafaelly Gruber Schoeffel
TOTVS Developers
Published in
4 min readDec 27, 2019

O PO UI é um projeto open source de componentes que utiliza o Angular. Saiba a seguir como ele surgiu.

O PO UI nasceu com o nome de THF (TOTVS HTML Framework), como um projeto inner source na empresa TOTVS, líder em softwares corporativos na América Latina, presente em mais de 40 países.

Em julho de 2019 o projeto se tornou open source, mudou sua paleta de cores e alterou o nome para PO UI.

Agora vamos para as 13 razões para utilizar este projeto:

1 — Licença MIT e open source

Qualquer um pode modificar, distribuir e usar comercialmente, e o principal, pode contribuir!!

Criatividade não tem limites, que tal criarmos o PO UI react, vue ?

2 — Documentação em Português 🇧🇷

O inglês é a língua franca da programação, ou seja, é a língua escolhida como padrão para os conteúdos relacionados a esta área.

O inglês é essencial para a área de tecnologia, mas nossa origem e nossos usuários atuais são brasileiros, além disso um levantamento da British Council mostrou que apenas 5% da população brasileira sabe se comunicar em inglês.

A tradução da documentação para inglês está em nossos planos, mas uma documentação em português é algo que nos orgulhamos e valorizamos.

3 — Muitos exemplos de uso

Cada componente contém um exemplo básico (mínimo de código possível), um exemplo interativo (laboratório) e por fim um ou mais casos de uso.

Para cada componente novo ou para cada nova funcionalidade nós sempre procuramos implementar exemplos de uso que fiquem mais próximos de casos de uso reais.

Exemplo de uma FAQ sobre doação de sangue com o componente po-accordion.

4 — UX Friendly

Todos os componentes que existem na biblioteca do PO UI passam por estudos de usabilidade com um time de designers no UX Lab da TOTVS. Cada vez mais procuramos aproximar os desenvolvedores dos designers para criar componentes simples e eficientes.

5 — Atualizado com a última versão do Angular

Um dos princípios do projeto é ser compatível com as últimas versões das tecnologias do Angular e Typescript, assim sempre está atualizado com as novidades e melhorias.

6 — Suporte 5 dias por semana em Português

Toda semana uma pessoa do core team do projeto fica responsável por responder as issues do Github e auxiliar a comunidade encaminhando demandas ao P.O. (product owner) e também resolvendo dúvidas.

Esta rotatividade entre os membros gera mais pluralidade e leveza no suporte.

7 — Está em constante reinvenção

Como tudo nessa vida, nem tudo são flores, mas a boa noticia é que no projeto do PO UI os desenvolvedores, designers, usuários e demais membros estão sempre comprometidos em discutir melhorias relacionadas a diversos temas como: qualidade de código, processos de desenvolvimento, automatização de tarefas, acessibilidade, melhorias de documentação, usabilidade entre outros temas.

Todo final do ano o time ganha 2 semanas para propor e desenvolver qualquer coisa em qualquer tecnologia que contribua com o time!

E se você tem alguma sugestão de melhoria, por favor fala com a gente!!

8 — Possui um Schematics

Um schematics é um gerador de código padronizado instalado com o NPM, baseado em um modelo previamente codificado. Muito utilizado para personalizar projetos e atender às necessidades específicas de uma organização.

O PO contém schematics do Angular CLI em seu pacote, para facilitar o desenvolvimento de aplicações PO UI.

9 — Tem templates prontinhos

Uma das nova frentes do PO é investir no desenvolvimento de nosso pacote de templates, eles facilitam a vida dos desenvolvedores pois criam algumas páginas prontas e customizáveis.

Por exemplo formulários, visualizações de dados e páginas relacionadas a login, todos os exemplos podem ser encontrados em nosso portal, na lista de componentes.

Exemplo de um template para troca de senha (po-page-change-password)

10 — Tem releases semanais

Toda sexta-feira é lançada uma nova release no NPM (node package manager), um novo pacote do PO que contém melhorias e/ou correções de bugs. Em alguns casos as releases são lançadas na segundas-feira.

Para acompanhar nossas releases basta nos seguir no Twitter, watch no Github e acompanhar nosso changelog.

11– 70+ Componentes

Até a data de publicação deste artigo, o PO está com mais de 70 componentes e está crescendo cada vez mais! 🎉

Diversos componentes para:

  • Formulários
  • Lista de dados
  • Gráficos
  • Organizadores de layout
  • Menus
  • Modal e notificações

Entre outros, para conferir, basta entrar em nosso portal, na lista de componentes

12 — Garante AOT (ahead of time)

O compilador Angular Ahead-of-Time (AOT) converte seu código Angular HTML e TypeScript em código JavaScript mais eficiente com muitas vantagens.

Por meio de boas práticas no código, conseguimos sempre garantir que o código do PO fique compatível com a compilação AOT.

13 — Temas e CSS

Aqui está uma das maiores vantagens do PO UI: um repositório com todo o estilo CSS dos componentes, ou seja, nosso CSS fica separado de nosso código Angular.

Além disso, disponibilizamos um tema com a paleta de cores dos produtos TOTVS e também temos ferramentas muito interessantes para customização de cores do tema padrão e criação de novos temas.

Obrigada pela sua leitura, não se esqueça de compartilhar este artigo e nos dar uma estrela no Github ⭐️!

Saiba mais:

Twitter do PO

Portal do PO

Github do PO

--

--

Rafaelly Gruber Schoeffel
TOTVS Developers

Research and development Engineer at TOTVS and also an aspiring cellist.