https://github.com/edmilson-dk/redfox-test-web
Web part of the application made by me.
https://github.com/edmilson-dk/redfox-test-web
Last synced: over 1 year ago
JSON representation
Web part of the application made by me.
- Host: GitHub
- URL: https://github.com/edmilson-dk/redfox-test-web
- Owner: edmilson-dk
- Created: 2021-03-29T11:28:59.000Z (about 5 years ago)
- Default Branch: main
- Last Pushed: 2021-03-29T13:45:20.000Z (about 5 years ago)
- Last Synced: 2025-01-21T21:31:46.733Z (over 1 year ago)
- Language: JavaScript
- Homepage: redfox-test-web-edmilson-dk.vercel.app
- Size: 665 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# RedFox - Teste para desenvolvedor web
# Front-end
Este é o front-end da aplicação, construida totalmente resonsiva, layout agradavél, com telas de login e registro, tela para listagem de pokemons, formulário para criar pokemons, filtro, etc.
# Tópicos
- [Tecologias](#techs)
- [Rotas da aplicação](#routes)
- [Rodando a aplicação](#execute)
- [Página online](#online)
## Tecnologias e bibliotecas utilizadas
- [ReactJS](https://pt-br.reactjs.org/)
- [Material UI](https://material-ui.com/pt/)
- [Axios](https://www.npmjs.com/package/axios)
- [Toastify](https://www.npmjs.com/package/react-toastify)
### Públicas
> As rotas públicas não necessitam da auteticação do usuário.
- ``/``
> Rota da home da aplicação.
- ``/login``
> Rota para o usuário fazer login.
- ``/register``
> Rota para o usuário criar conta.
### Privadas
> AS rotas privadas necessitam que o usuário esteja autenticado.
- ``/dashboard``
> Rota da dashboard aplicação.
- ``/create``
> Rota para adicionar um novo pokemon.
__Todas as rotas abaixo só podem ser acessadas via clique no botão de um card relacionado a um pokemon em espécifico, caso contrário você apenas retornará a página da dashboard__
- ``/updatepokemon``
> Rota para atualizar alguns dados do pokemon.
- ``/updateimage``
> Rota para atualizar a imagem de um pokemon.
- ``/viewpokemon``
> Rota para visualizar os dados de um pokemon
Para executar a frnt-end em sua máquina siga os passos abaixo.
- 1 Clone meu repositório em sua máquina
```sh
git clone git@github.com:edmilson-dk/teste-desenvolvimento-web.git
# entre na pasta web
cd teste-desenvolvimento-web/web
```
- 2 Após o passo acima, instale as dependências necessárias, para isso é preciso que você tenha o [NodeJS](https://nodejs.org/en/) instalado em sua máquina.
```sh
npm install
# ou com yarn
yarn install
```
- 3 Agora crie um arquivo na raiz do projeto, chamado .env e dentro dele escreva o mesmo conteúdo que tem no arquivo "env.example" que deixei neste repositório, agora após o ``REACT_APP_URL_API=`` você deve colocar a url da api se você estiver executando a api em sua máquina local, igual eu ensinei na pasta da api, você deve deixar assim ``REACT_APP_URL_API=http://localhost:3003/api``, caso contrario use a api que esta online deve ficar assim ``REACT_APP_URL_API=http://localhost:3003/api``.
- 4 Feito isso é hora de executar o projeto, para isso execute o comando abaixo.
```sh
npm start
# ou com yarn
yarn start
```
## Veja a aplicação funcionando
Caso você não queira executar os passos de instalação manualmente, para sua sorte fiz o deploy da aplicação, e você pode testa ela no link abaixo.
[Aplicação aqui]()
Creator with 💙 by [Edmilson Jesus](https://www.linkedin.com/in/edmilson-jesus-4128711b5)