React Movies Demo

Description

This is a React movies project, based on TMDB made for educational purposes.

This application is made from scratch using a variety of tools and techniques that i wanted to learn or improve knwoledge about.

---

Built with:

• React.js
• react-query
• Context API and React Hooks
• axios
• Storybook
• Tailwind
• react-error-boundary
• @testing-library
• @heroicons
• Swiper
• TMDB API

Some features:

• Dark/light mode
• Custom UI components made with Tailwind
• Unit testing for UI components
• Usage of react-query for managing server state
• Usage of skeletons aproach for loading states
• Usage of Error boundaries
• Manage of localStorage
• Debounced global search on keypress with controlled routing
• API consumption

Demo

Hosted on https://cozy-cucurucho-1b993a.netlify.app/

Installation

Clone and install the dependencies for react-movies:

  git clone https://github.com/McPixeI/react-movies.git
  cd react-movies 
  npm install

Setup and running the app

1. Take a copy of .env.local.example and re-name to .env.local
2. Get your own TMDB API key
3. Put your API key in the .env.local file
4. Start the project using npm run start or npm start

Author

• @McPixeI

License

MIT