Fakeflix: Un clon de Netflix creado con React, Redux, Firebase y Framer Motion



La mayoría de las personas en estos días están completamente obsesionados con Netflix. Ya sea por la selección de películas o series, la conveniencia o los precios bajos, Netflix se ha convertido en un destino para personas de todas las edades.

Sin embargo, un factor que no se puede ignorar es la conveniencia. Los jóvenes de hoy en dia son conocidos por ser adictos al trabajo. Con Netflix, puede ver sus programas favoritos a su propio ritmo, sin la necesidad de organizar un horario de televisión con sus amigos.

Si se siente cansado después de un largo día de trabajo, ver televisión en Netflix se ha convertido en la manera perfecta de relajarse. Al final del día, Netflix es solo otra forma de entretenimiento que es más barata que las películas y los programas de televisión.

Netflix cuenta con un sitio web que es sencillo de usar, pero al mismo tiempo es increíble en cuanto al diseño y funcionalidad. Podríamos pensar que fue desarrollado por desarrolladores y diseñadores talentosos, y así fue.

Pero te sorprendería saber que cualquier persona puede crear sitios web increíbles como Netflix.

Davide Mandelli es un desarrollador web que se propuso crear un “clon” o copia del famoso sitio web de películas y series. Y al parecer lo ha conseguido.

El mismo menciona que empezó el proyecto con el propósito de aprender a estructurar una aplicación web de complejidad media integrando la lógica de Redux y experimentar con cosas como Redux Thunk, Redux Saga, Reselect , Firebase y Framer Motion.

Intentó replicar el diseño original tanto como me fue posible y también hice algunas mejoras en algunas secciones insertando animaciones de ruta y microinteracciones.

En sus propias palabras: “es un clon de netflix”.

También insertó un clon muy cercano de la animación de bienvenida original de Netflix (bifurcada de un famoso codepen de Claudio Bonfati), hecha completamente con CSS, así como la animación de reproducción. Luego probé el sonido original «ta-duummm» de Netflix y lo hizo sonar junto con las dos animaciones.

Si quieres ver la página en funcionamiento da clic en este enlace. Si quieres ver el repositorio de GitHub con el código fuente da clic en este otro enlace.

Es importante mencionar que no debes usar tus credenciales para acceder. Puedes usar un usuario y contraseña demo que se otorga en el repositorio de GitHub.


También te podría gustar...

Deja una respuesta

Tu dirección de correo electrónico no será publicada.

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.