https://github.com/brunosobraldev/dashboard-api-crud
https://github.com/brunosobraldev/dashboard-api-crud
bootstrap5 reactjs sass typescript
Last synced: about 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/brunosobraldev/dashboard-api-crud
- Owner: BrunoSobralDEV
- Created: 2023-02-06T17:52:40.000Z (over 3 years ago)
- Default Branch: bruno-luiz-sobral-santos
- Last Pushed: 2023-02-23T20:06:08.000Z (over 3 years ago)
- Last Synced: 2025-09-02T01:34:09.237Z (9 months ago)
- Topics: bootstrap5, reactjs, sass, typescript
- Language: TypeScript
- Homepage: https://dashboard-api-crud.vercel.app
- Size: 1.07 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Desafio 2023/01
.png)
.png)
.png)
.png)
.png)
.png)
# O Desafio
Construir uma aplicação web (frontend e backend) capaz de realizar a comunicação com APIs distintas, além de um CRUD.
## Aplicação
- A página principal deve conter uma listagem de usuários gerada a partir da api [Random User Generator](https://randomuser.me/), a lista deve conter a foto do usuário, nome completo, email, username e idade. Além disso, os requests devem ser páginados, porém, é de critério do participante do desafio a quantidade de resultados a serem exibidos por página e variações para o mesmo. Também, deve haver uma search para buscar usuários por nome, email ou username;
- Em uma segunda página, o usuário deve ser capaz de selecionar um status code http qualquer, e, após a seleção, deve ser retornada uma imagem da api [HTTP Cat](https://http.cat/) relacionada ao status escolhido, caso não exista tal imagem, deve ser retornada uma imagem de not found à critério de escolha do participante do desafio;
- Em uma terceira página, deve haver um botão de refresh que, ao ser clicado, deve retornar uma imagem aleatória da api [Random Dog](https://random.dog/);
- Em uma quarta página, deve haver uma lista de clientes, através da qual o usuário deve ser capaz de cadastrar novos clientes, visualizar informações de um cliente específico, atualizar um cliente e deletar clientes. O cadastro deve possuir nome, email, telefone, endereço e cpf.
### Requisitos da aplicação e de código
- Interface amigável, bonita e limpa
- Responsividade
- Clean Code
### Ferramentas e Stack utilizado
- [ReactJS](https://reactjs.org/) para o frontend
- [Node.js](https://nodejs.org/en/) para o backend
- [TypeScript](https://www.typescriptlang.org/)
- HTML5 e CSS3
- UI: [Bootstrap v5](https://getbootstrap.com/)