A próxima versão da Dashboard Pagar.me

• Introdução
• Tecnologia utilizada
• Requisitos
• Instalação
• Cockpit
  • Rodando testes no Cockpit
• Estrutura do projeto
• Contribuindo
• Licenças

Pilot é o codinome da nova dashboard do Pagar.me. O produto foi criado a partir de feedbacks dos usuários, para que eles possam ter uma experiência cada vez mais transparente de sua operação financeira no Pagar.me, e consigam focar no seu negócio!

A stack foi escolhida com base no que empresas como Facebook, AirBnb, e New York Times estão usando para construir suas experiências. Também foi levado em consideração a simplicidade, curva de aprendizado e requisitos como fácil distribuição e entrega progressiva.

Tendo isso em vista, optamos por usar React e Ramda. A estrutura do projeto foi iniciada rapidamente usando o FormerKit Dashboard, projeto que desenvolvemos baseado no Create React App para nos permitir criar rapidamente projetos de dashboards.

Este repositório é um monorepo que aloja os pacotes que compõem a Pilot. Para instalar as dependências é necessário usar o Yarn versão 1.0 ou superior, que suporta a funcionalidade de Workspaces.

Algumas instruções para desenvolver na Pilot:

1. Clonando o repositório

   $ git clone [email protected]:pagarme/pilot.git

2. Rodando o servidor

   Entre na pasta principal do projeto:

   $ cd pilot

   Use o Yarn para instalar as dependências:

   $ yarn

   Entre no diretório da Pilot e inicie a aplicação:

   $ cd packages/pilot
   $ yarn start

O Cockpit é nossa biblioteca para efetuar requests a serviços externos, e devolver os dados retornados em um formato estruturado para serem utilizados nas páginas da Pilot. Atualmente, a principal função do Cockpit é fazer a comunicação com a API utilizando o pagarme-js. Porém, sua estrutura permite interação com outros serviços, caso haja necessidade. Uma request ao Cockpit equivale a uma ou mais requests na API, onde o dado retornado será tratado para ser renderizado na Pilot.

Entre no diretório do Cockpit e inicie os testes:

$ cd packages/cockpit
$ yarn test

• packages: Toda a estrutura de arquivos e pastas dos monorepos, seguindo a funcionalidades de Workspaces.

  • cockpit: Contém a estrutura de arquivos e pastas do Cockpit.

    • config: Configurações gerais do Webpack e Jest.
    • dist: Scripts prontos para produção.
    • scripts: Todos os scripts usados para testes.
    • src: Código-fonte do Cockpit.

  • pilot: Contém a estrutura de arquivos e pastas da Pilot.

    • src

      • components: Todos os componentes da Pilot.
      • containers: Todos os containers da Pilot.
      • formatters: Funções utilizadas para formatação dos dados da aplicação.
      • models: Modelos baseados na estrutura de dados da aplicação e da API.
      • pages: Todos os higher-order components que contém toda a lógica de busca de dados e manutenção de estado das páginas da Pilot.

    • stories: Nossa biblioteca de componentes, containers e páginas usadas na aplicação. Utilizamos o Storybook.

Para ler informações sobre contribuição, confira nosso guia de contribuição em CONTRIBUTING.md.

Veja as licenças em LICENSES.