Neste artigo, exploraremos um projeto de listagem de filmes desenvolvido com React, abordando conceitos como components, props, hooks e requisições a APIs. O projeto visa oferecer funcionalidades como pesquisa por filmes, exibição dos filmes mais populares e detalhes de filmes específicos.

Projeto com React: Listagem de Filmes

Nesta aula, o professor apresenta um projeto de listagem de filmes que será desenvolvido com React. O objetivo é colocar em prática os conceitos aprendidos sobre React, como components, props, hooks e requisições a APIs.

  • Desenvolvimento de um projeto de listagem de filmes com React
  • Aplicação prática dos conceitos de React, como components, props, hooks e requisições a APIs

Funcionalidades do Projeto

As principais funcionalidades que o projeto terá são:

  • Pesquisa por filmes: o usuário poderá digitar o nome de um filme no campo de pesquisa e os resultados relacionados serão exibidos na lista
  • Exibição dos filmes mais populares: inicialmente, sem nenhum termo de pesquisa, os filmes mais populares serão exibidos
  • Detalhes do filme: ao clicar em um filme específico, uma nova página com mais detalhes será aberta, contendo informações como orçamento, idioma origem

Sugestão de Projeto de Listagem de Filmes

O projeto proposto pelo professor consiste em criar uma página de listagem de filmes, onde os usuários poderão visualizar os filmes populares, acessar detalhes sobre cada filme e retornar para a lista principal. Além disso, há uma sugestão de adicionar a funcionalidade de recarregar os filmes populares ao submeter o campo de pesquisa vazio.

  • A criação de uma página de listagem de filmes é uma prática comum na internet e proporciona a aplicação de diversos conceitos importantes do React.
  • O projeto permite a utilização de APIs, requisições com Axios, implementação de rotas dinâmicas, gerenciamento de estado com useState, efeitos com useEffect e mapeamento de arrays.
  • A proposta de adicionar a funcionalidade de recarregar os filmes populares ao submeter o campo de pesquisa vazio amplia a prática dos conceitos mencionados e aprimora a experiência do usuário.

Justificativa do Projeto

O projeto de listagem de filmes proposto oferece uma oportunidade valiosa para praticar e aprimorar habilidades em desenvolvimento web, especialmente no contexto do React. Além disso, a implementação do projeto com diferentes APIs proporciona uma ampla gama de experiências e desafios.

  • A listagem de filmes é um projeto comum na internet e permite praticar conceitos essenciais do React, como utilização de APIs, requisições com Axios, implementação de rotas dinâmicas, gerenciamento de estado com useState, efeitos com useEffect e mapeamento de arrays.
  • A possibilidade de refazer o projeto com diferentes APIs oferece uma oportunidade contínua de prática e aprofundamento dos conceitos mencionados, enriquecendo a experiência de aprendizado.
  • A diversidade de APIs sugeridas pelo professor proporciona uma ampla variedade de desafios e cenários de aplicação, contribuindo para um aprendizado mais abrangente e prático.

APIs de Dados de Entretenimento

As APIs PokéAPI e Rick and Morty API oferecem acesso a dados de entretenimento, como informações sobre pokémons e a série Rick and Morty, respectivamente. A PokéAPI fornece dados completos sobre todos os pokémons, permitindo a paginação e a aplicação de filtros nas requisições. Por outro lado, a Rick and Morty API utiliza GraphQL para consultas mais otimizadas, buscando apenas os dados necessários.

  • Acesso a informações sobre pokémons e a série Rick and Morty
  • PokéAPI oferece dados completos sobre todos os pokémons
  • Rick and Morty API utiliza GraphQL para consultas otimizadas

Iniciando o Projeto de Desenvolvimento

Com as funcionalidades definidas e as APIs selecionadas, o professor está pronto para iniciar o desenvolvimento do projeto. Ele utilizará React para a construção do projeto, aplicando conceitos como components, props, hooks, rotas e integração com a API do TheMovieDB para buscar informações sobre filmes. O objetivo é criar um projeto visualmente simples, mas que permita explorar as funcionalidades do React em detalhes.

  • Utilização do React para construção do projeto
  • Aplicação de conceitos como components, props, hooks e rotas
  • Integração com a API do TheMovieDB para busca de informações sobre filmes

Conclusão

Ao final deste artigo, os leitores estarão motivados a acompanhar o desenvolvimento do projeto, aprendendo na prática sobre a utilização de APIs, requisições com Axios, rotas dinâmicas, estado com useState, efeitos com useEffect e mapeamento de arrays, além de obter insights sobre a importância da prática constante na consolidação de conhecimentos em React.