Movie search database build with HTML / CSS / JAVASCRIPT

Problem solving

• Search for a movie api FOUND: http://www.omdbapi.com/?apikey=d10619f6&s="tron"

• HTML form

  • INPUT text and a button (js)

• Movie API consumation

  • Structure JSON

Example dataset search: {"Search":[{"Title":"Tron: Legacy","Year":"2010","imdbID":"tt1104001","Type":"movie","Poster":"https://m.media-amazon.com/images/M/MV5BMTk4NTk4MTk1OF5BMl5BanBnXkFtZTcwNTE2MDIwNA@@._V1_SX300.jpg"},{"Title":"Tron","Year":"1982","imdbID":"tt0084827","Type":"movie","Poster":"https://m.media-amazon.com/images/M/MV5BMTA4Y2VjOWEtMWQ5MS00YWU5LTkxZTMtNzVmMDYyNWFiODU5XkEyXkFqcGc@._V1_SX300.jpg"},{"Title":"Tron: Uprising","Year":"2012–2013","imdbID":"tt1812523","Type":"series","Poster":"https://m.media-amazon.com/images/M/MV5BOGI1MWY3ZjAtN2NlMS00NjQwLTgwYWMtNWVjZDJjNWZiYjliXkEyXkFqcGc@._V1_SX300.jpg"},{"Title":"Tron: The Next Day","Year":"2011","imdbID":"tt1865543","Type":"movie","Poster":"https://m.media-amazon.com/images/M/MV5BNjczNTI5ZjgtNWFmYi00Yjc0LWE2ODctNzc5YjFlMjUwMmI4XkEyXkFqcGc@._V1_SX300.jpg"},{"Title":"Tron: Evolution","Year":"2010","imdbID":"tt1572508","Type":"game","Poster":"https://m.media-amazon.com/images/M/MV5BZjFjYjQ1NmUtZThhOC00YTM2LWJiNjgtMmRlODE3YTk5YWNmXkEyXkFqcGdeQXVyMzYyODU2NTU@._V1_SX300.jpg"},{"Title":"TRON 2.0","Year":"2003","imdbID":"tt0208650","Type":"game","Poster":"N/A"},{"Title":"The Making of 'Tron'","Year":"2002","imdbID":"tt0340232","Type":"movie","Poster":"https://m.media-amazon.com/images/M/MV5BMjIwOTAwMjg1OF5BMl5BanBnXkFtZTcwNzM1ODUyMQ@@._V1_SX300.jpg"},{"Title":"Tron","Year":"1982","imdbID":"tt0384622","Type":"game","Poster":"https://m.media-amazon.com/images/M/MV5BZjlkNDUyNmEtYjQ4Ny00MTQ5LWI2MGMtN2JmZmI4MzNiMTY2XkEyXkFqcGdeQXVyNzg5OTk2OA@@._V1_SX300.jpg"},{"Title":"Tron Legacy","Year":"2011","imdbID":"tt1980294","Type":"game","Poster":"https://m.media-amazon.com/images/M/MV5BNTE2ZjYxZmEtMjQ5My00ZTIxLTlhNTQtNjZkOTA4MGIzNTk0XkEyXkFqcGdeQXVyNzg5OTk2OA@@._V1_SX300.jpg"},{"Title":"Tron: Destiny - Fan Trailer","Year":"2011","imdbID":"tt4061290","Type":"movie","Poster":"https://m.media-amazon.com/images/M/MV5BZDk0MjAxZjAtMmQ3My00MmJkLTkzMTctZDg1MzZhYTVkNTEwXkEyXkFqcGdeQXVyMjQxNzM0MjI@._V1_SX300.jpg"}],"totalResults":"49","Response":"True"}

• Search function
  • Structure and API syntax
• Details movie
  • Structure and break down objects
  • URL with the i parameter: example https://www.omdbapi.com/?apikey=d10619f6&i=tt0372784 Example datastructure: {"Title":"Batman Begins","Year":"2005","Rated":"PG-13","Released":"15 Jun 2005","Runtime":"140 min","Genre":"Action, Crime, Drama","Director":"Christopher Nolan","Writer":"Bob Kane, David S. Goyer, Christopher Nolan","Actors":"Christian Bale, Michael Caine, Ken Watanabe","Plot":"After witnessing his parents' death, billionaire Bruce Wayne learns the art of fighting to confront injustice. When he returns to Gotham as Batman, he must stop a secret society that intends to destroy the city.","Language":"English, Mandarin","Country":"United States, United Kingdom","Awards":"Nominated for 1 Oscar. 15 wins & 79 nominations total","Poster":"https://m.media-amazon.com/images/M/MV5BODIyMDdhNTgtNDlmOC00MjUxLWE2NDItODA5MTdkNzY3ZTdhXkEyXkFqcGc@._V1_SX300.jpg","Ratings":[{"Source":"Internet Movie Database","Value":"8.2/10"},{"Source":"Rotten Tomatoes","Value":"85%"},{"Source":"Metacritic","Value":"70/100"}],"Metascore":"70","imdbRating":"8.2","imdbVotes":"1,673,263","imdbID":"tt0372784","Type":"movie","DVD":"N/A","BoxOffice":"$206,863,479","Production":"N/A","Website":"N/A","Response":"True"}