Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/coelhoreinaldo/starwars-planets
Consuming the planets endpoint from the Star Wars api and rendering the data into a table using React.js. It is possible to filter planets by various parameters, and it is also possible to sort in ascending or descending order.
https://github.com/coelhoreinaldo/starwars-planets
css javascript jest react rtl star-wars-api
Last synced: 27 days ago
JSON representation
Consuming the planets endpoint from the Star Wars api and rendering the data into a table using React.js. It is possible to filter planets by various parameters, and it is also possible to sort in ascending or descending order.
- Host: GitHub
- URL: https://github.com/coelhoreinaldo/starwars-planets
- Owner: coelhoreinaldo
- Created: 2023-05-04T18:24:49.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2023-05-19T21:55:26.000Z (over 1 year ago)
- Last Synced: 2024-10-25T01:26:46.783Z (3 months ago)
- Topics: css, javascript, jest, react, rtl, star-wars-api
- Language: JavaScript
- Homepage:
- Size: 5.67 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 🛰 Star Wars Planet Search
## 📘 Sobre
Consumo do endpoint de planetas da API do [Star Wars](https://swapi.dev/api/planets) e renderização dos dados em uma tabela usando React.js. É possível filtrar os planetas por diversos parâmetros, além de ser possível ordenar de maneira crescente ou decrescente.
## 🧩 Funcionalidades
- Visualizar os planetas de Star Wars retornados pela API.
- Procurar um planeta pelo nome.
- Filtrar por população, período orbital, diâmetro, período de rotação e superfície da água.
- Adicionar mais de um filtro e removê-lo ao clicar no botão de deletar ao lado.
- Remover todos os filtros ao clicar no botão de remover filtros.
- Ordenar de maneira decrescente ou crescente.## ⚛️ Ferramentas
Projeto construído utilizando React.js.
- JavaScript;
- Context API;
- Componentes Funcionais;
- React Router;
- useState, useEffect, useHistory, etc;
- Requisição de API em React;
- Props;
- Forms em React;
- RTL e Jest;
- Mobile First;## 🛠️ Como executar o projeto?
1. Instalando dependências
`npm install`
2. Executando a aplicação
`npm start`
## 📝 Nota
## 🧪 Cobertura de Testes
## ©️ Copyright
Este projeto foi desenvolvido por mim. Todo o código e o CSS implementado são de minha autoria e os direitos são reservados a mim.