Refactoring ReactJS youtube player to use Grid

Image for post
Image for post
Photo by Nicole Wolf on Unsplash

The youtube player which we have created so far uses the usual bootstrap. Now i have learnt the hard way that if you want to be really good at frontend development, you have to ditch bootstrap and start using CSS.

Now the older float were really the great road-block for any developer learning CSS and they tends to go toward bootstrap. With the recent addition of flexbox and Grid, it now easy for anyone to ditch bootstrap.

Let’s refactor the youtube player which we created in the the Youtube player with react series.
We will now clone the repo and do a npm install.

So, this is our bootstrap app look now -

Image for post
Image for post
bootstap app

Written by

UI Lead- ReactJS, JavaScript and everything in-between.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store