Skip to content

line-em/react-netflix

Repository files navigation

React Netflix Clone

This was a comprehensive project! Challenging, mostly because of Firebase, but I enjoyed its process 🎉 Check the final version here!

It's the result of this guide and an Scrimba exercise, both which I built upon. I was able to learn Tailwind and Firebase, specially Auth and Databases. I added modals, customizable homepage with various random categories, useRefs for the Rows, loading and error states, toast notifications, customizable alerts with Sweet Alert, extra hover and active effects like CSS transforms. My biggest challenge was making Firebase function smoothly, specially while loading your personal library and liked movies. You can create your own account and create your own movie library in this app, managing your movies.

Also, I'm using tools and libraries that I'm more comfortable with, such as Vite instead of CRA, and Phosphor Icons, which is a delightful library I love to use.

Overview

For this project, I used:

  • React
  • Firebase
  • Tailwind CSS & Tailwind-Scrollbar-hide
  • Axios
  • Vite

And as for visual libraries:

  • Phosphor Icons
  • @uiball/loaders
  • Sweet Alert

Challenges

I had a lot of difficulties with using Firebase - and until some things clicked, it took me a while. Handling its promises, getting data from the database, where some steps in which I struggled. I still find it is quite slow at first - when you try to like new movies, there's a slight delay with a fresh login. It works, but I think there could be improvements.

I think, because of this, there might be some bugs in edge cases in which I should probably locate and fix.

Changelog

  • 1.0 - Initial commit.
  • 2.0 - Huge bugfixes. Added SweetAlert and improved the Firebase code.

About

A React Netflix clone, for study!

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages