A aplicação é divida em dois contextos principais: Client e API. Para executar e testar a aplicação, você precisará executar as seguintes linhas de comando no seu terminal respectivamente para cada diretório:

“/API”

yarn install
yarn dev

//para testes
yarn test

Certifique-se de duplicar o seu .env.example e renomeá-lo para .env. Na variável TOKEN, você precisará coletá-lo, caso queira, no site oficial da API, em: https://www.alphavantage.co/support/#api-key

Após isso, basta substituir após a igualdade.

RESULTADO ESPERADO:

“/client”

yarn install
yarn start

//para testes
yarn test

Por fim, certifique-se que a baseURL utilizada no serviço da API do client corresponde ao endereço que a sua API estará rodando. Por padrão, ela rodará no localhost, ou seja, a sua baseURL precisará conter o seguinte:

diretório: “/client/src/services/StockingAPI.ts”

export const stockingAPIInstance = axios.create({
  baseURL: "http://localhost:3333",
});

Perceba que a porta na baseURL que usei é exatamente a mesma que recebemos no terminal ao executar a API, ou seja, 3333.

Sua aplicação agora está configurada e pronta para ser utilizada.

OBSERVAÇÃO: A api utilizada tem o limite de apenas 5 requisições por minuto, então poderá acontecer alguma inconsistência durante o uso da aplicação, tendo em vista que nada será respondido no próximo minuto, pois a API da alphavantage nos bloqueou temporariamente. Portanto, é normal que ao rodar “yarn test” na API, apenas 5 testes (dos 8 existentes) passem, pois os seguintes serão bloqueados.

Seguem as prints do sistema funcionando:

QUOTES

HISTORY

COMPARISON

GAINS/LOSS

Para construir a API, utilizei Typescript, Axios, Path Register (para aplicar o path mapping), Express, Jest para os testes e o dotenv para variáveis de ambiente.

• Path mapping (clean code)
• Clean Architecture
• Gitmoji to commits
• Export files from DIR by index practice
• Exception handling with validators
• Interfaces/DTOs in controllers, services etc
• English with own language into code

O foco do desenvolvimento da API foi explicitar algumas práticas de organização e padrão de projeto que gosto de utilizar. A separação consiste em ter algumas pastas gerais dentro de “./src”. São elas:

Controllers → Responsáveis por processar a requisição HTTP e direcionar a chamada de serviços.

Interfaces → Onde se encontram as tipagens generalistas para utilização no sistema.

Lib → Onde temos o centralizador de rotas da aplicação, separadas por contexto em um objeto.

Modules → Onde centralizei os casos de uso da aplicação.

Dentro de modules temos alguns casos de uso, guardando os seus respectivos serviços, interfaces de transferência de objeto e seus testes automatizados.

Routes → Onde temos as instâncias de rotas para o framework Express.

Services → Onde centralizamos todas as configurações e chamadas da API externa que estamos consumindo (https://www.alphavantage.co).

Validators → Onde temos alguns modelos de Exceptions padrões para utilizar nas validações dos dados.

PATH MAPPING

Uma outra adaptação de suma importância para organização de código, foi a configuração do path mapping na aplicação, que aconteceu por intermédio de uma lib chamada “tsconfig-paths”, declarada nos scripts do package.json

Sendo assim, como o próprio nome da lib já nos deixa ciente, é preciso ainda configurar os “paths” do projeto no nosso tsconfig.json. Essa foi a configuração que escolhi:

GITMOJI

Uma outra abordagem interessante que senti necessidade de mostrar, foi a utilização da extensão do VSCODE chamada Gitmoji para utilizar padronizações de commits, com o fito de deixar ainda mais organizado e melhorar a experiência de desenvolvimento com os desenvolvedores. Segue uma print mostrando o exemplo:

Cada emoji tem uma descrição subentendida, como por exemplo esses:

Download da collection de requisições no insomnia: Baixar