Making a Web Component Analysis a practical example

source: http://www.masisalab.com

So you probably have heard about this thing called components, Angular, React, Vue, Polymer, everyone is doing it.

Components are basically legos, small pieces of software that can be assembled into an app. So a big step when doing web components, is change the state of mind and start thinking in components

So, how do I think in components?

I’ll explain this to you, practically. With a simple exercise using a Netflix section, I’ll also add some pseudo data-code.

Let’s start by this row:

This is a Netflix section, actually they use it a lot, they just change the movies/series on it. So let’s take a look into the components here:

The Row itself

The Movie/Series/whatever card (I’ll call it Movie Card)

The pager

So Netflix uses the ‘Row’ component a lot, as you can see here: