Skip to content

mikenath223/Youtube-Video-Player-Clone

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

44 Commits
 
 
 
 
 
 
 
 

Repository files navigation

Youtube Video Player Clone

For our first collaborative project at Microverse my coding partner and I make a clone of the youtube video player page using HTML5 sematics and clean code rules.

Mock-up resource used

Tools used

  • HTML and CSS

Live Page link

*Here is a link to our live page: https://mikenath223.github.io/Youtube-Video-Player-Clone/

Features and Implemented guidelines

Features
  • The navbar has embedded image logo aligned to the leftmost part of the navbar and three embedded images at the rightmost part of it representing icons and avatar.
  • The mid section of the page contains an embedded video showing video title number of views and like and dislike icons and subcribe button.
  • The sidebar has a recommended video thumbnail preview that shows the title of the video and the nnumber of views.
Implemented guidelines
  • We styled and positioned elements as requested using CSS grid and css flexbox positioning system.
  • We organized our commits into branches and then merged with master branch when we were done.
  • We used BEM naming conventions and regular semantic HTML for better visibility.
  • We validated our HTML with this tool from w3: https://validator.w3.org/#validate_by_upload .
  • We worked and implemented all issues raised by our code reviewers.

After-thoughts: It was a fun and great project to work on

Snapshot

Youtube Video Player Clone - Screenshot

About

YouTube cloned pages [For tutorial purposes]

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published