Neste projeto eu criei uma aplicação Front-End utilizando React com TypeScript onde é possível:
- Realizar buscas por artigos científicos na API do portal CORE;
- Marcar e desmarcar os resultados da pesquisa como favorito;
- Mostrar uma listagem com os artigos favoritados;
- Mostrar os resultados das buscas e dos artigos favoritados com paginação.
Página de busca
Página com artigos favoritos
Paginação
Para solicitar a chave de uso que será utilizada no arquivo .env que você irá criar acesse a seguinte página:
https://core.ac.uk/services/api/
Após clique em Register now, informe o seu e-mail e clique novamente em Register now e siga as orientações recebidas no e-mail informado.
Caso queira consultar a documentação da API utilizada no projeto basta acessar:
https://core.ac.uk/docs/#!/all/search
- Abra o terminal e realize o clone do projeto:
git clone git@github.com:Humberto-Bonadiman/scientific-articles.git- Acesse o diretório do projeto e depois utilize o comando npm install para instalar todas as dependências necessárias:
cd scientific-articles
npm install- Crie um arquivo .env e repasse os dados o valor da chave de acesso dentro de REACT_APP_API_KEY:
touch .envO valor dentro do arquivo deve estar parecido com o arquivo .env.example:
REACT_APP_API_KEY=sua_api_key_vai_aqui- Por último, rode o comando npm start e acesse o projeto via browser, no caminho http://localhost:3000/.
npm startObservação: Para rodar os testes é necessário que a aplicação esteja funcionando (digitar npm start no terminal).
Para rodar os testes da aplicação utilize o comando npm run cypress:open no terminal:
cypress:openApós digitar este comando o Cypress irá abrir. Clique na opção E2E Testing e selecione o navegador de sua preferência. Assim que o navegador abrir clique em specs na barra lateral (a 2ª opção) e selecione uma das opções de teste.
Também é possível realizar digitando **npm run cy:run** no terminal.