wdgisele / movies-list

Refactoring a page to use components for listing films according to a genre

movies list

Ignite Journey - Challenge 02

Project   |    Technologies   |    Layout   |    How to Use   |    Features   |    License

💻 Project

An application where your main objective is to refactor a page for listing films according to genre, to practice a little more about componentization in React. A challenge from Rocketseat's Ignite journey.

🚀 Technologies

This project was developed with the following technologies:

• React
• TypeScript

🔖 Layout

Created from Rocketseat template.

ℹ️ How To Use

To clone and run this application, you'll need Git and Yarn. From your command line:

# Clone the repository
$ git clone https://github.com/gisabernardess/movies-list.git 

# Go into the directory
$ cd movies-list 

# Install dependencies
$ yarn 

# Run the fake api
$ yarn server 

# Run the development server
$ yarn dev 

# Navigate to http://localhost:8080
# The app will automatically reload if you change any of the source files.

✨ Features

The application is already fully functional but much of its code is directly in the App.tsx file. To solve this in the best way, it is necessary to divide the application into at least two main parts: sidebar and the main content that has the header and the list of films.

• The application has only one main feature, which is the list of films;
• In the sidebar it is possible to select which category of films should be listed;
• The first category on the list (which is "Ação") should already start as checked;
• The application header has only the name of the selected category that must change dynamically;

📄 License

This project is under the MIT license. See the LICENSE for more information.

---

Made with ♥ by Gisele Silva 👋🏻 Get in touch!