O DevCurrency é uma aplicação web de nível profissional desenvolvida para acompanhar em tempo real as métricas de diversas moedas virtuais de forma prática, dinâmica e visualmente agradável. Criado com React e ModuleCSS, o projeto faz consumo de APIs externas via fetch, exibindo informações atualizadas de cada criptomoeda em páginas dinâmicas, com rotas condicionais baseadas no ID da moeda.
- Visão Geral do Projeto
- Tecnologias Utilizadas
- Estrutura do Projeto
- Screenshots
- Requisitos para Rodar o Projeto Localmente
- Rodar o Projeto Localmente
- Autores
- Licença
- A visualização em scroll infinito das moedas com botão que chama mais dados.
- Acesso limitado ao 'ver mais' para podermos controlar a performance da página.
Ao acessar uma moeda há uma aba com mais detalhes da moeda, com renderizaçãode uma página condicional, pois necessita lidar com dados via URL para a chamada de dados.
Na página principal possui um input para fazer a pesquisa da moeda que desejar para ver seus detalhes aprofundados!
Next.JS |
CSS3 |
Git |
Github |
O projeto é organizado em vários arquivos para melhor organização do código e separação de interesses:
public/
: A pasta serve como o local para armazenar arquivos estáticos que não passam pelo processo de build do React e podem ser acessados diretamente no navegador.src/
: Onde encontra-se o processo de desenvolvimento de todo o código-fonte do sistema.src/pages/
: A pasta contém todo o sistema de rotas e páginas do projeto.src/components/
: A pasta contém todos os componentes utilizados na aplicação.
- Verifique se você tem o Node.js instalado. Caso contrário, faça o download e instale a versão mais recente do Node.js.
- O npm (Node Package Manager) é instalado automaticamente com o Node.js.
- Certifique-se de ter o Git instalado em sua máquina. Se não tiver, você pode baixá-lo aqui.
- Escolha um editor de texto ou uma IDE (Ambiente de Desenvolvimento Integrado) para trabalhar no código. Alguns exemplos populares incluem o Visual Studio Code, Sublime Text e Atom.
- Você precisará de um navegador web para visualizar o aplicativo localmente. Recomendamos o uso do Google Chrome, Mozilla Firefox ou Microsoft Edge.
- Necessita realizar toda a configuração para utilização da API do CoinCap com sua chave de API.
Clone o projeto
git clone https://github.com/MarcioJorgeMelo/devCurrencyAPI.git
Vá para a pasta do projeto
cd devcurrecny
Abra o projeto no VSCode
code .
Instale as dependências
npm install # Instala as dependências (se ainda não tiver feito)
Abra com o React Server
npm run dev # Inicia o servidor ReactJS