Hacktoberfest 2026: as issues que os mantenedores marcaram para outubro, abertas e boas para iniciantes. Ver issues do Hacktoberfest

TV Show Project Level 400: Fetch much more data

Aberta
  • Algo errado?
#478 0 comentários 0 reações 0 responsáveis Ver no GitHub

Mantenedores costumam responder em até 10 dias

Ninguém assumiu esta issue ainda.

Avaliação

Dificuldade
3/5
Tempo estimado
1-2 dias
Facilidade para iniciantes
35/100
Tipo de issue
Funcionalidade
Clareza
Razoavelmente clara
Status de atividade
Estagnada
Stack de tecnologia
javascript
Domínio
api, frontend

Direção de pesquisa

Comece no repositório do seu parceiro obtendo o branch main mais recente e lendo a implementação de nível 300 dele antes de compará-la com a sua. Adicione a seleção de programas, a busca de programas e episódios do TVmaze, opções alfabéticas, uma busca funcional e controles de episódios, além de uma requisição por URL; valide o resultado por meio do pull request obrigatório revisado pelo seu parceiro.

Escrita pelo modelo de indexação a partir do texto da issue.

Descrição

🏕 Priority Mandatory 📅 Sprint 3 Core Submit:None

Level 400

For level 400, you should work in the repo of your partner from level 200.

You do not need to re-add yourself as a collaborator.

Remember to change to the right directory on your machine, and pull the latest changes from their main branch.

Before writing any new code, look at their level 300 implementation.

Compare their implementation to yours. Think:

  1. How is it different?
  2. What do you prefer about your implementation?
  3. What do you prefer about their implementation?
  4. What did you learn that you didn't know before?

They should do the same with your repository.

Have a discussion about your answers to these questions. In class, together you should give a 3 minute talk about your conclusions.

Refactoring

Feel free to change anything in your codebase which you think will make it easier to work with, or to build new features.

Make a branch and pull request for yourself, and then have your partner review, making sure they understand the changes made.

Adding new functionality

Level 400 is about expanding beyond one TV show.

Until now, your site has only showed information about the episode of one TV show.

But TVmaze has information about lots of TV shows, all in the same format.

We want to display any of them.

Requirements
  1. Add a select element to your page so the user can choose a show.
  2. When the user first loads the page, make a fetch request to https://api.tvmaze.com/shows (documentation) to get a list of available shows, and add an entry to the drop-down per show.
  3. When a user selects a show, display the episodes for that show, just like the earlier levels of this project.

You will need to perform a fetch to get the episode list.
4. Make sure that your search and episode selector controls still work correctly when you change shows.
5. Your select must list shows in alphabetical order, case-insensitive.
6. During one user's visit to your website, you should never fetch any URL more than once.

[!NOTE]
Be careful when developing with fetch. By default, every time you make a small change to your app it will be restarted by live server - if you are fetching JSON on page load, the JSON will be downloaded again and again. These frequent HTTP requests may lead to the API permanently banning your IP address from further requests, or "throttling" it for some time. Worse, if they don't, they may cause performance issues for the API service we are using.

Send a pull request to your partner's repo with this functionality. Have them review, and when happy, merge your PR.

Screenshot of minimal version

Note: Provided your project meets the above requirements, it can look however you want.

Here is one example layout.

Screenshot of a website with a drop-down list with the show "Breaking Bad" selected

Screenshot of a website with a drop-down list showing multiple TV shows

Linguagem predominante
JavaScript
Estrelas
0
Forks
276
Nenhum PR com merge em 30d

Preparar o ambiente

Este projeto não oferece contêiner de desenvolvimento, Dockerfile nem guia de contribuição, então a configuração fica por sua conta: comece pelo README e veja nosso guia da primeira contribuição para os passos gerais.

Primeiros passos

  1. Leia a issue inteira e depois o guia de contribuição do projeto.
  2. Comente na issue dizendo que vai assumir — evita que duas pessoas façam o mesmo trabalho.
  3. Faça um fork do repositório e trabalhe em uma branch.
  4. Abra um pull request que referencie o número da issue.

Mais de CodeYourFuture/Module-Data-Flows

Todas as issues de CodeYourFuture/Module-Data-Flows

Issues semelhantes

Mais issues de JavaScript

Receba novas issues na sua caixa de entrada

Um resumo curto de issues do GitHub para quem está começando.