/iextrading-api-client

API Client using React JS + Redux

Primary LanguageJavaScript

Software Engineer Test

Como utilizar

O projeto utiliza o gerenciador de pacotes NPM. Instale os pacotes com o comando npm i para prosseguir com a construção.

Para executar o projeto, use npm start.

Tarefas

O teste consiste em utilizar React para uma simples aplicação que exibe o valor de ações através de chamadas de API. Crie uma tela apenas com um input de texto que receberá um símbolo de ação (ex: aapl para Apple, fb para Facebook, twtr para Twitter) e retornará o último valor de ação da empresa, assim como outras informações relevantes. Sinta-se livre para utilizar quaisquer dependências que você desejar no npm e auxiliar no desenvolvimento da aplicação.

  1. Utilizar componentes React para montar a interface e Redux para controlar o estado;
  2. Você pode utilizar a API gratuita do IEX para obter os dados necessários;
  3. A documentação da API sugerida pode ser acessada aqui;
  4. As informações de ações para cada símbolo são encontradas aqui (Estamos interessados apenas no latestPrice)
  5. A mesma API também retorna as informações mais relevantes da empresa
  6. Plotar um gráfico com a evolução do valor das ações (PS: utilizamos o pacote Recharts)

Desafios Extras

Se você gostaria de fazer um pouco mais, sugerimos os seguintes desafios:

  1. Componentes reutilizáveis: que tal montar a interface usando seus próprios componentes de apresentação? Uma ideia: criar componentes genéricos de UI que poderiam ser utilizados em outros projetos. É o que fazemos internamente com nossos projetos! Adoramos o styled-components;
  2. Atualizações: a API é atualizada quase em tempo real e poderia atualizar as informações de acordo (conforme faz o Yahoo! Finance)
  3. Animação à la Bloomberg: exibir em formato de marquee o valor e variação percentual do valor das ações

Requisitos de tecnologia

  • React para _view;
  • Redux para_ framework_ de estado;

Pontos de sucesso

Itens que foram concluídos:

Pré-requisitos:

  • Crie uma tela apenas com um input de texto que receberá um símbolo de ação e retornará o último valor de ação da empresa;
  • Obter dados extras da empresa;
  • Utilizar componentes React para montar a interface e Redux para controlar o estado;
  • Plotar um gráfico com a evolução do valor das ações. Foi Utilizado o pacote [Recharts].

Extra:

  • Componentes reutilizáveis com Styled-Components;
  • Atualizações: a API é atualizada quase em tempo real;
  • Exibir em formato de marquee o valor e variação percentual do valor das ações.