daceynolan / youtube-video-search

React app that utilizes the YouTube API

Home Page:https://daceynolan.github.io/youtube-video-search/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

YouTube Video Search App

Purpose

This application is based off of Stephen Grider's React Tutorial. This app allows the user to search for videos. The user will receive five videos from YouTube's API for each query they enter.

I found the tutorial very informative, but as my understanding for development began to grow, I decided to challenge myself further and make it my own.

Development Focus

  • Generated an access token through the Google Developer Console to make authenticated requests to a third-party API
  • Migrated the initial tutorial code from class-based components to hooks
    • focusing on useState and useEffect
  • Refactored the initial tutorial code from semantic ui classes to custom CSS rules
  • Used axios in combination with my access token to fetch video results based on a query

Screenshots

Setup Instructions

  1. Clone this repository.
  2. Install dependencies with yarn install
  3. Rename the .env.example file to .env
  4. Enter a YouTube API Key into .env
  5. Start app with yarn start

About

React app that utilizes the YouTube API

https://daceynolan.github.io/youtube-video-search/


Languages

Language:JavaScript 54.9%Language:CSS 28.2%Language:HTML 16.6%Language:Shell 0.3%