🏷️ backlog for sprint 1

JS3-Module-Project πŸ”—

Level 100: Display information about every episode of a single TV show. πŸ”— Clone

Level 100

For level 100, we are going to display information about every episode of a single TV show.

Requirements

  1. All episodes must be shown
  2. For each episode, at least following must be displayed:
    1. The name of the episode
    2. The season number
    3. The episode number
    4. The medium-sized image for the episode
    5. The summary text of the episode
  3. Combine season number and episode number into an episode code:
    1. Each part should be zero-padded to two digits.
    2. Example: S02E07 would be the code for the 7th episode of the 2nd season. S2E7 would be incorrect.
  4. Your page should state somewhere that the data has (originally) come from TVMaze.com, and link back to that site (or the specific episode on that site). See tvmaze.com/api#licensing.

Screenshot of minimal version

Note: Provided your project meets the above requirements, it can look however you want. Do the simplest thing to begin with.

Here is one example layout.


          Screenshot of a website with cards showing per-episode data according to the requirements

  • 🎯 Topic Requirements
  • 🎯 Topic Structuring Data
  • πŸ“… Week 1
Level 0: Set up project πŸ”— Clone

Level 0

The goals of level 0 are to:

  • Create a GitHub repository with the starter scaffolding in-place.
  • Deploy it to Netlify.
  • Make sure whenever you push changes your Netlify site will be updated.

[!WARNING]
Unlike other projects at CYF, you are not going to fork this project, you’re going to create a repository from a template repository.

Create your repository

  1. Go to https://github.com/CodeYourFuture/JS3-Module-Project
  2. Click on the green button: Use this template.
  3. Name your new repo exactly this: JS3-Module-Project
  4. Do not enable Include all branches
  5. Click the final green button Create repository from template

Deploy your site

  1. Follow the guide to deploy your site to Netlify.
  2. Configure your site for auto-deployments.
  3. Ensure your Netlify site is named exactly cyf-USERNAME-tv.netlify.app where USERNAME is your GitHub username.

Get set up on your laptop

  1. Clone your repository
  2. Open your repository in VS Code
  3. Open the index.html page in Chrome
  4. Make sure in Chrome you can see the text “Got 73 episode(s)” in red. If you can’t, something has gone wrong.
  5. Edit index.html to include your name and github username in the page title instead of “(My Name (My GitHub username))”.

Push your changes

  1. Commit your changes to your index.html to your git repository (with a clear commit message).
  2. Push your changes to your GitHub repository. Make sure they show up on GitHub.
  3. Ensure your updated site has been deployed to Netlify.

Completion criteria

You have completed level 0 when:

  • You have a GitHub repository called JS3-Module-Project which is not a fork of this repo.
  • The index.html page on your GitHub project contains your name and GitHub username.
  • Your project is deployed to Netlify at cyf-USERNAME-tv.netlify.app.
  • Your deployed project has your name and GitHub username in its title.
  • 🎯 Topic Requirements
  • πŸ• Priority Mandatory
  • πŸ‡ Size Small
  • πŸ“… Week 1