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.
- Our clone was made using this resource: http://archive.fo/Bss88
- HTML and CSS
*Here is a link to our live page: https://mikenath223.github.io/Youtube-Video-Player-Clone/
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