Projeto 02: App Galeria de Imagens da NASA Utilizar dados de fontes confiáveis, como a NASA, garante precisão e credibilidade em pesquisas, permitindo decisões fundamentadas e fortalecendo a qualidade dos estudos. Isso promove avanços em áreas como meio ambiente, exploração espacial e inovação tecnológica.
Utilizando a ferramenta Expo Snack, implemente uma aplicação ReactNative voltada para a Exibição de Imagens da Rest API da NASA. A aplicação permitirá aos usuários visualizar a galeria de imagens da agência, deve também permitir a seleção de uma imagem para a visualização de dados sobre a mesma.
Tarefa 01: Criando o projeto
Desenvolva uma aplicação utilizando a plataforma Expo. Estruture os diretórios da seguinte forma:
screens (ou outro nome que represente componentes do tipo tela); components (para componentes menores e reutilizáveis); api (para recursos relacionados ao consumo de dados da Rest API); Outros diretórios que considerar necessários para a organização do projeto. Não concentre múltiplos componentes em um único arquivo, mantendo cada componente em arquivos separados para melhor modularidade e manutenção.
Não utilize outras bibliotecas de componentes que não as que foram estudadas em aula.
Tarefa 02: Carregando Dados
No diretório api, implemente um objeto responsável por consumir uma Rest API que fornece dados sobre as imagens da galeria. A Rest API utilizada será a da NASA, e a URL base para consulta é:
https://images-api.nasa.gov/search?q=earth&page=1 Neste exemplo, earth é o astro para o qual serão obtidas as imagens e 1 é a página da consulta, permitindo a navegação por meio de paginação.
Exiba as imagens em uma galeria e implemente a funcionalidade para que o usuário possa escolher outros astros para serem exibidos, como moon, sun, mars, jupiter, entre outros.
Utilize o(s) método(s) de entrada mais adequado(s) para facilitar a escolha do astro e a exibição das imagens.
Tarefa 03: Manipulação da Lista
Implemente a lista de imagens utilizando a funcionalidade de Lazy Loading, permitindo a paginação das consultas à Rest API de forma transparente para o usuário.
Adicionalmente, implemente a funcionalidade de Pull to Refresh para permitir a atualização da lista e buscar dados mais recentes.
Inclua também uma barra de progresso, que indique em porcentagem a quantidade de itens já carregados, com base no total de itens disponíveis na Rest API.
Tarefa 04: Navegação para Detalhes da Imagem
Implemente na lista a funcionalidade que permite ao usuário selecionar uma imagem em exibição. Ao selecionar a imagem, a aplicação deve navegar para outra interface onde serão exibidos os detalhes sobre o item selecionado. Utilize os dados fornecidos pela Rest API para apresentar informações adicionais sobre a imagem escolhida.
A aplicação deve estar componentizada.
Envie o link para o projeto Expo Snack.
Veja um protótipo de exemplo: