https://github.com/matheusmhq/tmdb-react-js

Um React app consumindo a API do TMDB.
https://github.com/matheusmhq/tmdb-react-js

bootstrap javascript movie movie-database people react react-js series the-movie-db tmdb tmdb-api tvs

Last synced: 4 days ago
JSON representation

Um React app consumindo a API do TMDB.

• Host: GitHub
• URL: https://github.com/matheusmhq/tmdb-react-js
• Owner: matheusmhq
• License: mit
• Created: 2021-02-13T15:59:17.000Z (almost 4 years ago)
• Default Branch: main
• Last Pushed: 2022-04-24T04:19:07.000Z (over 2 years ago)
• Last Synced: 2023-03-05T19:03:50.760Z (over 1 year ago)
• Topics: bootstrap, javascript, movie, movie-database, people, react, react-js, series, the-movie-db, tmdb, tmdb-api, tvs
• Language: JavaScript
• Homepage: https://tmdb-movies.netlify.app
• Size: 18.1 MB
• Stars: 3
• Watchers: 2
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        




		

	



 🌟 TMDB ReactJs 🌟 


#



  Um React app totalmente responsivo construído com React consumindo a api pública do TMDB.





    

        

    





  Demo •

  Bibliotecas •

  Funcionalidades •

  Iniciando   





    



# Demo

[TMDB ReactJs - Live ◀️](https://tmdb-movies.netlify.app/)

## Bibliotecas

As principais bibliotecas usadas nesse projeto:

| Biblioteca             | Descrição   |

| :-------------:|--------------|

| [React](http://facebook.github.io/react/index.html) | Uma biblioteca JavaScript para criar interfaces de usuário. |

| [Bootstrap](https://react-bootstrap.github.io/) | A biblioteca de front-end mais popular reconstruída para React. |

| [Router Dom](https://reactrouter.com/) | O React Router Dom é uma lib completa para controle de rotas. |

| [Axios](https://github.com/axios/axios) | Cliente HTTP baseado em promessa para o navegador e node.js. |

| [Moment](https://momentjs.com/) | Uma biblioteca de datas JavaScript para analisar, validar, manipular e formatar datas. |

# Funcionalidades

- [Descubra (/discover)](https://tmdb-movies.netlify.app/) - Lista **_filmes_** ou **_séries_** baseado nos filtros selecionados (Ano e Ordernar por).

- [Filmes/Séries (/movie ou /tvs)](https://tmdb-movies.netlify.app/movies) - Lista **_filmes_** ou **_séries_** baseado no tipo selecionado (Populares ou Mais votados).

- [Pesquisa (search)](https://tmdb-movies.netlify.app/search/matrix) - Lista **_filmes_**, **_séries_** ou **_pessoas_** baseado na palavra digitada.

- [Filmes/Séries (/details)](https://tmdb-movies.netlify.app/details/movie/603) - Exibe informações detalhadas como **_data de lançamento_**, **_gêneros_**, **_tempo de duração_**, **_trailer_** etc... sobre o filme ou série escolhida, mostrando também informações sobre o **_elenco_** e **_recomendações_**.

- [Pessoas (/persons)](https://tmdb-movies.netlify.app/persons) - Lista **_pessoas_**

- [Detalhes Pessoas (/person)](https://tmdb-movies.netlify.app/person/6384) - Exibe informações detalhadas como **_data de nascimento_**, **_gênero_**, **_trabalhos_** etc... sobre a pessoa escolhida.

- OBS: Todas as páginas que contém listagem estão **_páginadas_**.

# Iniciando

- Clonar esse repositório

  ```

  git clone https://github.com/matheusmhq/tmdb-react-js.git

  cd tmdb-react-js

  ```

- Instale as dependências

  ```

  yarn install ou npm install

  ```

- Pegue uma API KEY em [TMDB](https://www.themoviedb.org). Faça login usando sua conta e navegue até [TMDB Configurações da conta](https://www.themoviedb.org/settings/api). Copie a API KEY (v3 auth) e crie o seguinte arquivo **_.env.local_** na pasta raiz do projeto

- Cole isso no seu arquivo **_.env.local_** e salve

  ```

  REACT_APP_API_KEY=COLE_SUA_API_KEY_AQUI

  ```

- Agora é só rodar **yarn start** ou **npm start**

- A aplicação irá abrir no seguinte endereço `http://localhost:3000`

- Bons estudos pra você! 😀😀😀