hamburger menu icon
my quiz react project

Youtube Channel Search

A JavaScript and Youtube API Project

A Scrimba Bootcamp Project

This project accesses the YouTube Data API to find different YouTube Channels. The user can then select one of the different channels that are available in the dropdown menu. After the channel has been selected, the user can type in the search terms the want. The videos that match the search terms will be displayed below the search bar. Each result gives an image and details about each video. Each image is also a link that can be clicked on to take the user to the actual video on YouTube.

Programming Languages Used

  • HTML
  • CSS
  • JavaScript

Project Requirements

There were 5 main requirements for this project. The first was being able to search videos within a given YouTube channel. The second requirement was using the 'search' endpoint from the API documentation to return videos that matched the search query. The third requirement was to have at least the video thumbnail and it's title displayed when the results were returned. The fourth requirement was to let the user know if there were no results matching the entered terms. The final requirement was to have the thumbnail be a link to the actual video.

As extra stretch goals, I added a dropdown menu with a slection of different channels that could then be searched through when entering a search query. I also added other details about each video such as the published date and a description.

The GitHub:

https://github.com/KeithPetr/Youtube-Channel-Search

Click on the image below to go to the application

channel search gif