README

Tomflix is a personal rendition and clone of the media-streaming website Netflix that allows users to view Movies and TV Shows at their leisure. It is built using Ruby on Rails for the backend, PostgreSQL for the database, and React & Redux for the frontend. The website is hosted on Heroku while the media is stored on AWS.

Website: Tomflix

Features

Frontend and Backend User Authentication
Demo login
Main video upon login autoplays and can be muted/unmuted on the index page
CRUD functionality allowing user to add and remove from MyList (custom playlist of videos)
Searchbar implemented with debounce can be used to filter out videos
Movies are split up into genres with the ability for the user to play the video on hover
Videos can be played on a fullscreen video player
Users can navigate to different links on the navbar which display different categories such as Movies & TV Shows

Video Hover & MyList

Uses event listeners to play, pause, and set the time of the video with "onMouseOver" and "onMouseLeave"
On click of the video will bring the user to the video player where the video will play
Videos scale on hover after 750 milliseconds
Video hover mutes the main video
CRUD functionality reflected in real time for MyList

Event Handlers

handleHoverPlay(e){
    e.persist();
    e.target.play().then(null, () => {
      e.target.muted = true
      e.target.play();
    });
  }

handleHoverLeave(e){
    e.currentTarget.pause();
    e.currentTarget.currentTime = 0;
    e.currentTarget.load();
}

Contact Me

Email: KevinKTom@gmail.com