1 Homework 8: Angular, Ajax, JSON, Responsive Design, and Node.js CSCI571 Spring 2021 1. Objectives Get familiar with AJAX and JSON technologies Use a combination of HTML5, Bootstrap and Angular on client side Use Node.js on server side Get familiar with Bootstrap to enhance the user experience using responsive design Get hands-on experience of Cloud services hosting NodeJS/Express Learn to use popular APIs such as TMDB Api 2. Background 2.1 AJAX and JSON AJAX (Asynchronous JavaScript + XML) incorporates several technologies Standards-based presentation using XHTML and CSS Result display and interaction using the Document Object Model (DOM) Data interchange and manipulation using JSON Asynchronous data retrieval using XMLHttpRequest JavaScript binding everything together 2.2 Bootstrap Bootstrap is a free collection of tools for creating responsive websites and web applications. It contains HTML and CSS-based design templates for typography, forms, buttons, navigation and other interface components, as well as optional JavaScript extensions. To learn more details about Bootstrap please refer to the lecture material on Responsive Web Design (RWD). You should use Bootstrap 4 in this homework. 2.3 Cloud Services 2.3.1 Google App Engine (GAE) Google App Engine applications are easy to create, easy to maintain, and easy to scale as your traffic and data storage needs change. With App Engine, there are no servers to maintain. You simply upload your application and it’s ready to go. App Engine applications automatically scale based on incoming traffic. Load balancing, micro services, authorization, SQL and noSQL databases, memcache, traffic splitting, logging, search, versioning, roll out and roll backs, and security scanning are all supported natively and are highly customizable. To learn more about GAE support for Node.js visit this page: https://cloud.google.com/appengine/docs/standard/nodejs/ 2 2.4 Angular Angular is a toolset for building the framework most suited to your application development. It is fully extensible and works well with other libraries. Every feature can be modified or replaced to suit your unique development workflow and feature needs. Angular combines declarative templates, dependency injection, end to end tooling, and integrated best practices to solve development challenges. Angular empowers developers to build applications that live on the web, mobile, or the desktop. For this homework, Angular 8+ (Angular 8, 9 or 10) can be used, but Angular 10 is recommended. Please note Angular 8+ will need familiarity with Typescript and component- based programming. To learn more about Angular 8+, visit this page: https://angular.io/ 2.5 Node.js Node.js is a JavaScript runtime built on Chrome’s V8 JavaScript engine. Node.js uses an event- driven, non-blocking I/O model that makes it lightweight and efficient. Node.js package ecosystem, npm, is the largest ecosystem of open source libraries in the world. To learn more about Node.js, visit: https://Node.js.org/en/ Also, Express.js is strongly recommended. Express.js is a minimal and flexible Node.js web application framework that provides a robust set of features for web and mobile applications. It is in fact the standard server framework for Node.js. To learn more about Express.js, visit: http://expressjs.com/ You can use nodemon while developing, visit: https://www.npmjs.com/package/nodemon All TMDB API calls should be done through your Node.JS server, otherwise will cause 4- point penalty. 3 3. High Level Description In this exercise, you will create a webpage that allows you to search for information regarding movies and TV shows using the TMDB API and upon selection can display results on the details page of that specific movie or TV show. You can view popular, top-rated and trending movies and TV shows on the home page along with currently playing movies. The application evolves from previous homework. The user will first open Home page, where the navbar contains Search Bar and user can enter the movie or TV show name and select from a list of matching movie/TV show names along with images using “autocomplete”. Selecting the movie or TV show name will lead to the details page of that movie or TV show. At the top of Home page, a Carousel of currently playing movie posters is displayed. Recently visited movies and TV shows are listed under Continue Watching in the Home page. Popular, Top Rated and Trending movies and TV shows are displayed below it. There are 4 routes for this application: a) Home page Route [‘/’] – It is a default route of this application. b) Movie Details Route [‘/watch/movie/’] – It displays the details of the movie with id= c) TV show Details Route [ ‘/watch/tv/’] – It displays the details of the TV show with id= d) Watchlist Route [‘/mylist’] – It displays the watchlist of the user. Instructions on how to use the API are given in Section 4. All implementation details and requirements will be explained in the following sections. 3.1 Navbar The Navigation bar must be present on top of the page and be visible all the time. You can use Bootstrap to create a navbar. It consists of following menu options: Home MyList Search bar “USC Films” upon clicking will lead to the Home page. 3.1.1 Search Functionality You must replicate the Search Bar at Top-right in the navigation bar using ngbTypeahead from ng-bootstrap (Refer section 5.3). The Search Bar allows user to enter a keyword (Movie name / TV show name) to retrieve information. Based on the user input, the text box should display a list of top 7 matching movies 4 and TV shows names along with their poster images. The autocomplete JSON data is retrieved from the TMDB Multi-Search API (refer to Section 4.1.1). The following is an example of calling this API: https://api.themoviedb.org/3/search/multi api_key=97588ddc4a26e3091152aa0c9a40de22&language=en- US&query=game 3.2 Home Page 3.2.1 Currently Playing Movies Carousel Refer to section 4.1.4 showing sample TMDB API calls to get Currently Playing Movies related information Collect Top 5 results from JSON result and create a carousel consisting of 5 slides. It has auto- rotate time of 5 seconds Auto rotate will pause on Hover and on Focus Refer to Section 5.3 for Implementation Hints for creating carousel using ng-bootstrap Each slide contains poster image of the movie and upon hovering should produce the required zoom effect and the name of the movie should appear at the bottom of the slide Selecting a particular slide, will take you to details page of that movie 3.2.2 Continue Watching Section When the user opens Home page for the first time, there will be no continue watching section. Once the user searches for any movie or TV show and selects, they will visit the details page of that movie or TV show. That movie or TV show gets added to the beginning of Continue Watching section’s carousel. This List will be maintained in local storage of the application. For more details on local storage, see section 5.4. 3.2.3 Popular Movies Section Popular Movies carousel displays a list of Popular Movies from Popular Movies endpoint. Refer to section 4.1.5 for TMDB example. Following is the template of API call: https://api.themoviedb.org/3/movie/popular api_key=<>&language=en- US&page=1 3.2.4 Top Rated Movies Section Top Rated Movies carousel displays a list of Top-Rated Movies from Top-Rated Movies endpoint. Refer to section 4.1.3 for TMDB example. Following is the template of API call:https://api.themoviedb.org/3/movie/top_rated api_key=<>&language=en- US&page=1 3.2.5 Trending Movies Section Trending Movies carousel displays a list of Trending Movies from Trending Movies endpoint. Refer to section 4.1.2 for TMDB example. Following is the template of API call: https://api.themoviedb.org/3/trending/movie/day api_key=<> 5 3.2.6 Popular TV Shows Section Popular TV shows carousel displays a list of Popular TV shows. Refer to section 4.1.14 for TMDB API example. Following is the template of API call: https://api.themoviedb.org/3/tv/popular api_key=<>&language=en- US&page=1 3.2.7 Top Rated TV Shows Section Top Rated TV Shows carousel displays a list of highest Rated TV shows. Refer to section 4.1.13 for TMDB example. Following is the template of API call: https://api.themoviedb.org/3/tv/top_rated api_key=<>&language=en- US&page=1 3.2.8 Trending TV shows Section Trending TV shows carousel displays a list of Trending TV shows. Refer to section 4.1.12 for TMDB example. Following is the template of API call: https://api.themoviedb.org/3/trending/tv/day api_key=<> Styling and Functionality for Sections from 3.2.2 to 3.2.8, 3.3.5 and 3.3.6: Refer to Section 5.3 for Implementation Hints for creating carousel using ng-bootstrap Carousel consists of 6 movie cards in a slide with left and right arrows at each end used for sliding to the next/previous set of cards Each Movie or TV show card, upon hovering should produce the required zoom effect and the name of TV show or movie at the bottom of the card. Selecting a particular movie’s or TV show’s card will take you to details page of that movie or Tv show. 3.3 Details Page 3.3.1 Details of Searched Movie/ TV show After the user selects a Movie or TV show from autocomplete suggestions dropdown, page should route to /watch// path where can be movie or tv. (example: /watch/movie/299534 if selected item’s is movie or /watch/tv/1668 if selected item’s is tv). The following components need to be displayed on successful search: Video of trailer (if not present, then teaser) of the movie or TV show is played using Youtube player (refer section 5.1). If no video is available, use default video id as tzkWB85ULJY Title of the movie or TV show Tagline of the movie or TV show Release year, Average votes, Duration of the Movie/TV show Genres, spoken languages Overview Full cast and crew 6 Reviews Recommended and Similar movies for movie or Recommended and similar TV shows for tv Refer to sections 4.1.8, 4.1.9, 4.1.17 and 4.1.18 for TMDB API Templates and Examples. There is button “Add to Watchlist”, which when clicked adds that particular movie or TV show at the top of the watchlist. It also produces an alert saying, “Added to watchlist”. Alert closes automatically after 5 seconds or can be manually closed by user. On clicking “Remove from Watchlist” button movie or TV show gets removed from watchlist. After removing from watchlist button changes back to “Add to watchlist”. Alert closes automatically after 5 seconds or can be manually closed by user. 3.3.2 Share Options User can share the Video (teaser or trailer links, priority is given to trailer) on Twitter and Facebook. For details on how to use it, refer Section 4.2. Twitter and Facebook should open in a new browser tab, if clicked. In Twitter, it should create a post having following content: Watch #USC #CSCI571 #FightOn In Facebook, it should create a post, which contains Youtube video link. 3.3.3 Full Cast and Crew section Refer to sections 4.1.11 Movie cast End point and 4.1.20 TV show Cast Endpoint for API Template and Examples Each cast member is displayed on a card with their image, name and character name There is a scroll bar below the cards, which when scrolled shows the cards for rest of the cast When clicked on one of the cards, open a Modal window. For details regarding implementing a Modal refer section 5.3. Modal contains the following fields: o Name of the Cast member o Image of the cast member o Date of birth o Place of birth o Gender o Known for o Other names of the cast member o External ids of cast member – upon hovering, a small tooltip appears Example: Visit IMDB, Visit Instagram 7 On clicking, it should take the user to that social media handle of that cast member o Biography of the cast member Refer sections 4.1.21 and 4.1.22 to find example API calls to get external ids and details about cast members. If any of the required fields are null, they should not appear in the modal. Ignore them. On clicking the cross symbol or anywhere outside of the modal view, modal should close. 3.3.4 Reviews Refer to sections 4.1.10 and 4.1.19 to find the sample API calls to TMDB to get reviews for a particular movie or TV show using their id and API key. We display the number of reviews retrieved for the Movie or TV show. A maximum of 10 reviews should be displayed Each review will contain author’s name, profile picture, rating given, written date, time and content of the review “Read the rest” text will open the full review in new tab If the content of review is more than 3 lines, it should end with ellipsis the end of 3rd line with “…” 3.3.5 Recommended Movies/ TV shows Refer to sections 4.1.6 and 4.1.15 to find the example TMDB API calls to get recommended movies/TV shows We give recommended movies or TV shows depending on the media_type of the item displayed on details page 3.3.6 Similar Movies/TV shows Refer to sections 4.1.7 and 4.1.16 to find the example TMDB API calls to get recommended movies/TV shows We give similar movies or TV shows depending on the media_type of the item displayed on details page 3.4 Watchlist Menu This menu will display all the Movies and TV shows that are added to the watchlist by the user. This watchlist will be maintained in local storage of the application. For more details on local storage, see section 5.4. Each Movie or TV show is displayed in the form of a card Upon hovering, it produces zooming effect and name of the Movie or TV show should appear at the bottom of the card Most Recently added Movie or TV show should be added at the beginning of the list. Once the Movie or TV show which is in the watchlist is visited again, it shifts to the beginning of the watchlist On clicking Movie or TV show card, it should take user to the details page of that Movie or TV show If watchlist is empty, it should display the alert showing the message “No items found in Watchlist”. 8 3.5 Custom Scroll Bar There is customized scroll bar for the whole web application. 3.6 Footer The Footer must be present at the end of each page. It should contain following line: “Powered by TMDB. Developed by ”. Here must be replaced with your name. 3.7 Responsive Design You must watch the video carefully to see how each page looks like on mobile devices. All functions must work on mobile devices like iphone 6/7/9 plus. Please note that for Sections from 3.2.2 to 3.2.8, 3.3.5 and 3.3.6, the indicators at bottom of carousel should be disabled and the Hover effect should be enabled by default in mobile view. One easy way to test for mobile devices is to use Google Chrome Responsive Design Mode 4. API’s description 4.1 TMDB API calls similar to Homework 6 In this homework, we will use TMDB API. 4.1.1 Multi-Search Endpoint to search for both Movies and TV shows From this endpoint, you will get a lot of information about the shows, movies, and people that are related to your search query. For each object that is returned, find out if it is a movie, show, or a person through the ‘media_type’ property returned for each object. If it is a movie or a tv show, collect it, otherwise, ignore it. API Template: https://api.themoviedb.org/3/search/multi api_key=<>&language=enUS&query= <> URL parameters to be provided in API Call: query: search query api_key: The API access Key. It is private, please do not share with anyone. See Homework 6. 9 API Example: https://api.themoviedb.org/3/search/multi api_key=97588ddc4a26e3091152aa0c9a40de22& language=en-US&query=game For each TV show, you will only need these fields: id – the ID of the TV Show name – the name of the TV Show backdrop_path – You need to construct image url like this: https://image.tmdb.org/t/p/w500 + backdrop_path Media_type – tv For each Movie, you will only need these fields: id – the ID of the Movie name – the name of the Movie backdrop_path – You need to construct image url like this: https://image.tmdb.org/t/p/w500 + backdrop_path Media_type – movie 4.1.2 Trending Movies Endpoint This endpoint will be used to get information about trending movies API Template: https://api.themoviedb.org/3/trending/movie/day api_key=<> URL parameter in API Call: api_key: The API access Key. It is private, please do not share with anyone. See Homework 6. API Example: https://api.themoviedb.org/3/trending/movie/day api_key=97588ddc4a26e3091152aa0c9a4 0de22 You will only need these fields: id – the ID of the Movie title – the name of the Movie poster_path – You need to construct image url like this: https://image.tmdb.org/t/p/w500 + poster_path 4.1.3 Top-Rated Movies Endpoint This endpoint will be used to get information about highest rated movies API Template: https://api.themoviedb.org/3/movie/top_rated api_key=<>&language=en- 10 US&page=1 URL parameter in API Call: api_key: The API access Key. It is private, please do not share with anyone. See Homework 6. API Example: https://api.themoviedb.org/3/movie/top_rated api_key=97588ddc4a26e3091152aa0c9a40de 22&language=en-US&page=1 You will only need these fields: id – the ID of the Movie title – the name of the Movie poster_path – You need to construct image url like this: https://image.tmdb.org/t/p/w500 + poster_path 4.1.4 Currently playing Movies Endpoint This endpoint will be used to get information about currently playing movies API Template: https://api.themoviedb.org/3/movie/now_playing api_key=<>&language=en- US&page=1 URL parameter in API Call: api_key: The API access Key. It is private, please do not share with anyone. See Homework 6. API Example: https://api.themoviedb.org/3/movie/now_playing api_key=97588ddc4a26e3091152aa0c9a4 0de22&language=en-US&page=1 You will only need these fields: id – ID of the Movie title – name of the Movie poster_path – You need to construct image url like this: https://image.tmdb.org/t/p/w500 + poster_path. Ignore those movies which don’t have poster_path. 4.1.5 Popular Movies Endpoint This endpoint will be used to get information about popular movies API Template: https://api.themoviedb.org/3/movie/popular api_key=<>&language=en- US&page=1 11 URL parameter in API Call: api_key: The API access Key. It is private, please do not share with anyone. See Homework 6. API Example: https://api.themoviedb.org/3/movie/popular api_key=97588ddc4a26e3091152aa0c9a40de2 2&language=en-US&page=1 You will only need these fields: id – the ID of the Movie title – the name of the Movie poster_path – You need to construct image url like this: https://image.tmdb.org/t/p/w500 + poster_path 4.1.6 Recommended Movies Endpoint This endpoint will be used to get information about recommended movies API Template: https://api.themoviedb.org/3/movie/<>/recommendations api_key=< >&language=en-US&page=1 URL parameter in API Call: api_key: The API access Key. It is private, please do not share with anyone. See Homework 6. Movie_id: id of the movie API Example: https://api.themoviedb.org/3/movie/464052/recommendations api_key=97588ddc4a26e309 1152aa0c9a40de22&language=en-US&page=1 You will only need these fields: id – the ID of the Movie title – the name of the Movie poster_path – You need to construct image url like this: https://image.tmdb.org/t/p/w500 + poster_path 4.1.7 Similar Movies Endpoint This endpoint will be used to get information about movies similar to the selected movie API Template: https://api.themoviedb.org/3/movie/<>/similar api_key=<>&languag 12 e=en-US&page=1 URL parameter in API Call: api_key: The API access Key. It is private, please do not share with anyone. See Homework 6. Movie_id: id of the movie API Example: https://api.themoviedb.org/3/movie/464052/similar api_key=97588ddc4a26e3091152aa0c9 a40de22&language=en-US&page=1 You will only need these fields: id – the ID of the Movie title – the name of the Movie poster_path – You need to construct image url like this: https://image.tmdb.org/t/p/w500 + poster_path 4.1.8 Movies Video Endpoint This endpoint will be used to get video related to the selected movie API Template: https://api.themoviedb.org/3/movie/<>/videos api_key=<>&languag e=en-US&page=1 URL parameter in API Call: api_key: The API access Key. It is private, please do not share with anyone. See Homework 6. Movie_id: id of the movie API Example: https://api.themoviedb.org/3/movie/464052/videos api_key=97588ddc4a26e3091152aa0c9a 40de22&language=en-US&page=1 You will only need these fields: site – the website where video is available type – the type of video available name – the caption for video key – You need to construct video link like this: “https://www.youtube.com/watch v=” +key 4.1.9 Movie Details Endpoint 13 This endpoint will be used to get information about Movie details API Template: https://api.themoviedb.org/3/movie/<> api_key=<>&language=en- US&page=1 URL parameter in API Call: api_key: The API access Key. It is private, please do not share with anyone. See Homework 6. Movie_id: id of the movie API Example: https://api.themoviedb.org/3/movie/464052 api_key=97588ddc4a26e3091152aa0c9a40de22 &language=en-US&page=1 You will only need these fields: title – title of the movie genres – movie’s genres spoken_languages – Languages in which movie is available release_date – release date of the movie runtime – duration of movie overview – movie’s synopsis vote_average – movie rating votes tagline – movie’s tag line 4.1.10 Movie Reviews Endpoint This endpoint will be used to get reviews related to the selected movie API Template: https://api.themoviedb.org/3/movie/<>/reviews api_key=<>&langua ge=en-US&page=1 URL parameter in API Call: api_key: The API access Key. It is private, please do not share with anyone. See Homework 6. Movie_id: id of the movie API Example: https://api.themoviedb.org/3/movie/464052/reviews api_key=97588ddc4a26e3091152aa0c9 a40de22&language=en-US&page=1 You will need a list of the following fields: author – the author of the review content – review’s content created_at – date at which review was created url – link to the review 14 rating – rating value if not null, take 0 otherwise avatar_path – profile picture of author When you get the id from avatar_path, you can append https://image.tmdb.org/t/p/original at the beginning of it, otherwise use the link provided. If avatar_path is not present, use the default image source as “https://encrypted- tbn0.gstatic.com/images q=tbn:ANd9GcRHnPmUvFLjjmoYWAbLTEmLLIRCPpV_Ogx CVA&usqp=CAU” or download it from the website. 4.1.11 Movie Cast Endpoint This endpoint will be used to get cast related information of the selected movie API Template: https://api.themoviedb.org/3/movie/<>/credits api_key=<>&languag e=en-US&page=1 URL parameter in API Call: api_key: The API access Key. It is private, please do not share with anyone. See Homework 6. Movie_id: id of the movie API Example: https://api.themoviedb.org/3/movie/464052/credits api_key=97588ddc4a26e3091152aa0c9a 40de22&language=en-US&page=1 You will need a list of the following fields: Id – id of the cast member name – name of the cast member character – character’s name profile_path – Construct image url: https://image.tmdb.org/t/p/w500/+ profile_path If profile picture is not available, don’t display those cast members. 4.1.12 Trending TV Shows Endpoint This endpoint will be used to get information about trending TV shows API Template: https://api.themoviedb.org/3/trending/tv/day api_key=<> URL parameter in API Call: api_key: The API access Key. It is private, please do not share with anyone. See Homework 6. API Example: https://api.themoviedb.org/3/trending/tv/day api_key=97588ddc4a26e3091152aa0c9a40de2 2 You will only need these fields: id – the ID of the TV show 15 name – the name of the TV show poster_path – You need to construct image url like this: https://image.tmdb.org/t/p/w500 + poster_path 4.1.13 Top-Rated TV shows Endpoint This endpoint will be used to get information about top-rated TV shows API Template: https://api.themoviedb.org/3/tv/top_rated api_key=<>&language=en- US&page=1 URL parameter in API Call: api_key: The API access Key. It is private, please do not share with anyone. See Homework 6. API Example: https://api.themoviedb.org/3/tv/top_rated api_key=97588ddc4a26e3091152aa0c9a40de22& language=en-US&page=1 You will only need these fields: id – the ID of the TV show name – the name of the TV show poster_path – You need to construct image url like this: https://image.tmdb.org/t/p/w500 + poster_path 4.1.14 Popular TV shows Endpoint This endpoint will be used to get information about popular TV shows API Template: https://api.themoviedb.org/3/tv/popular api_key=<>&language=en-US&page=1 URL parameter in API Call: api_key: The API access Key. It is private, please do not share with anyone. See Homework 6. API Example: https://api.themoviedb.org/3/tv/popular api_key=97588ddc4a26e3091152aa0c9a40de2 2&language=en-US&page=1 You will only need these fields: id – the ID of the Tv show name- the name of the Tv show poster_path – You need to construct image url like this: https://image.tmdb.org/t/p/w500 + poster_path 16 4.1.15 Recommended TV shows Endpoint This endpoint will be used to get information about recommended TV shows API Template: https://api.themoviedb.org/3/tv/<>/recommendations api_key=<>&l anguage=en-US&page=1 URL parameter in API Call: api_key: The API access Key. It is private, please do not share with anyone. See Homework 6. tvshow_id: id of the TV show API Example: https://api.themoviedb.org/3/tv/85271/recommendations api_key=97588ddc4a26e3091152a a0c9a40de22&language=en-US&page=1 You will only need these fields: id – the ID of the TV show name – the name of the TV show poster_path – You need to construct image url like this: https://image.tmdb.org/t/p/w500 + poster_path 4.1.16 Similar TV shows Endpoint This endpoint will be used to get information about TV shows similar to the selected TV show API Template: https://api.themoviedb.org/3/tv/<>/similar api_key=<>&language=e n-US&page=1 URL parameter in API Call: api_key: The API access Key. It is private, please do not share with anyone. See Homework 6. tvshow_id: id of the TV show API Example: https://api.themoviedb.org/3/tv/85271/similar api_key=97588ddc4a26e3091152aa0c9a40de 22&language=en-US&page=1 You will only need these fields: id – the ID of the Movie name – the name of the Movie 17 poster_path – You need to construct image url like this: https://image.tmdb.org/t/p/w500 + poster_path 4.1.17 TV show Video Endpoint This endpoint will be used to get video related to the selected TV show API Template: https://api.themoviedb.org/3/tv/<>/videos api_key=<>&language=e n-US&page=1 URL parameter in API Call: api_key: The API access Key. It is private, please do not share with anyone. See Homework 6. Tvshow_id: id of the TV show API Example: https://api.themoviedb.org/3/tv/85271/videos api_key=97588ddc4a26e3091152aa0c9a40de 22&language=en-US&page=1 You will only need these fields: site – the website where video is available type – the type of video available name – the caption for video key – You need to construct video link like this: “https://www.youtube.com/watch v=” +key 4.1.18 TV show Details Endpoint This endpoint will be used to get information about TV show details API Template: https://api.themoviedb.org/3/tv/<> api_key=<>&language=en- US&page=1 URL parameter in API Call: api_key: The API access Key. It is private, please do not share with anyone. See Homework 6. tvshow_id: id of the TV show API Example: https://api.themoviedb.org/3/tv/85271 api_key=97588ddc4a26e3091152aa0c9a40de22&lan guage=en-US&page=1 You will only need these fields: title – title of the TV show genres – TV show’s genres 18 spoken_languages – Languages in which TV show is available first_air_date – release date of the TV show episode_run_time – duration of TV show’s episode overview – TV show synopsis vote_average – TV show rating votes tagline – TV show tag line 4.1.19 TV show Reviews Endpoint This endpoint will be used to get reviews related to the selected TV show API Template: https://api.themoviedb.org/3/tv/<>/reviews api_key=<>&language= en-US&page=1 URL parameter in API Call: api_key: The API access Key. It is private, please do not share with anyone. See Homework 6. tvshow_id: id of the TV show API Example: https://api.themoviedb.org/3/tv/85271/reviews api_key=97588ddc