Jakub Szczepaniak, home pagePolski

Movie list – a simple JavaScript app

The objective is to display a filterable list of movies. Building a simple interface for it will improve your basic skills and knowledge of JavaScript.

Basic requirements

  1. Load a list of movies from a JSON file. Prepare the file yourself: give the movies the fields used below, and leave a few of them out here and there.
  2. Display the list of movies with their properties.
  3. Handle missing fields.

Future improvements

  1. Filtering by the fields:
    • title and plot: a text input
    • genre, actors, director and rated: a dropdown
    • year, duration, metascore, imdbRating and imdbVotes: two number inputs, minimum and maximum; one or both can be filled in
    • a button that clears the filters
  2. Sorting:
    • sorting doesn’t cancel filtering, and vice versa
    • sorting has 3 states: not sorted, ascending, descending
  3. Sorting by multiple fields:
    • sorting by a field keeps the previous sorts, but takes priority over them
    • a button that clears the sorting
  4. Turn titles and names into links, so the user can read more.

Generic version

The version above works on fixed properties. A more flexible one doesn’t assume which fields exist, which takes a higher level of abstraction.

  1. Find out which fields are available.
  2. Assign a type to each field:
    • string (actors, director, rated)
    • number (duration)
    • date (year)
    • text (title, plot)

All notes