Movie listing page with genre categorization made with React JS

Overview

Watche me 📝

List of movies

🛠️ Challenge

Essa será uma aplicação onde o seu principal objetivo é refatorar uma página para listagem de filmes de acordo com gênero.

A aplicação já está totalmente funcional mas grande parte do seu código está diretamente no arquivo App.tsx. Para resolver isso da melhor forma, é necessário dividir a aplicação em pelo menos duas partes principais: sidebar e o conteúdo principal que possui o header e a listagem de filmes:

  • A aplicação possui apenas uma funcionalidade principal que é a listagem de filmes;
  • Na sidebar é possível selecionar qual categoria de filmes deve ser listada;
  • A primeira categoria da lista (que é "Ação") já deve começar como marcada;
  • O header da aplicação possui apenas o nome da categoria selecionada que deve mudar dinamicamente.

🛠️ Stack

  • React
  • Typescript
  • Yarn
  • Webpack
  • SCSS, Babel
  • json-server
  • axios

Run

  yarn install
  yarn dev

👩 Author

@laisfrigerio

📄 License

This project is licensed under the MIT License - see the LICENSE file for details

Owner
Lais Frigério
NodeJS | PHP | Java Developer
Lais Frigério
Create-React-App + TypeScript + Ant-Design (without Eject)

This project was bootstrapped with Create React App. Below you will find some information on how to perform common tasks. You can find the most recent

#кодеротбога 111 Sep 13, 2021
React version of Argon Dashboard

Argon Dashboard React Start your development with a Dashboard for Bootstrap 4, React and Reactstrap, made with create-react-app. It is open source, fr

Creative Tim 318 Sep 19, 2021
Now UI Kit React - Free Bootstrap 4, React, React Hooks and Reactstrap UI Kit

Now UI Kit React is a free Bootstrap 4, React, React Hooks and Reactstrap UI Kit provided for free by Invision and Creative Tim. It is a beautiful cross-platform UI kit featuring over 50 elements and 3 templates.

Creative Tim 107 Sep 6, 2021
Paper Dashboard React

Paper Dashboard React If you are a react developer or a react website owner that needs to work within a dashboard and want to have a pretty sight whil

Creative Tim 151 Jul 21, 2021
Black Dashboard React is a beautiful Bootstrap 4, Reacstrap and React (create-react-app) Admin Dashboard with a huge number of components built to fit together and look amazing.

Black Dashboard React Black Dashboard React is a beautiful Bootstrap 4, Reacstrap and React (create-react-app) Admin Dashboard with a huge number of c

Creative Tim 333 Sep 21, 2021
Free Open Source High Quality Dashboard based on Bootstrap 4 & React 16

Airframe React High Quality Dashboard / Admin / Analytics template that works great on any smartphone, tablet or desktop. Available as Open Source as

null 3.6k Sep 19, 2021
A frontend Framework for building B2B applications running in the browser on top of REST/GraphQL APIs, using ES6, React and Material Design

react-admin A frontend Framework for building data-driven applications running in the browser on top of REST/GraphQL APIs, using ES6, React and Materi

marmelab 17.9k Sep 23, 2021
Light Bootstrap Dashboard React is an admin dashboard template designed to be beautiful and simple.

Light Bootstrap Dashboard React Light Bootstrap Dashboard React is an admin dashboard template designed to be beautiful and simple. It is built on top

Creative Tim 615 Sep 20, 2021
A starter boilerplate for a universal webapp using express, react, redux, webpack, and react-transform

React Redux Universal Hot Example About This is a starter boilerplate app I've put together using the following technologies: Isomorphic Universal ren

Erik Rasmussen 12.1k Sep 20, 2021
React Dashboard made with Material UI’s components. Our pro template contains features like TypeScript version, authentication system with Firebase and Auth0 plus many other

Material Kit - React Free React Admin Dashboard made with Material UI's components, React and of course create-react-app to boost your app development

Devias 3.3k Sep 22, 2021
A Foundation for Scalable Cross-Platform Apps

Electron React Boilerplate uses Electron, React, React Router, Webpack and React Fast Refresh. Install If you have installation or compilation issues

Electron React Boilerplate 18.3k Sep 25, 2021
Notus React: Free Tailwind CSS UI Kit and Admin

Notus React A beautiful UI Kit and Admin for Tailwind CSS and React. Start your development with a Free Tailwind CSS and React UI Kit and Admin. Let N

Creative Tim 397 Sep 19, 2021
:fire: A highly scalable, offline-first foundation with the best developer experience and a focus on performance and best practices.

Start your next react project in seconds A highly scalable, offline-first foundation with the best DX and a focus on performance and best practices Cr

react-boilerplate 27.9k Sep 22, 2021
Build a simple React / Web3 Dapp that replicates a small portion of the Uniswap v2 interface

Today we're going to build a simple React / Web3 Dapp that replicates a small portion of the Uniswap v2 interface - specifically, we are building the

Jacob Edward Dawson 38 Sep 24, 2021
🔮 Sofia React Template - Admin Dashboard Template built with React

?? Sofia React Template - Admin Dashboard Template built with React

Flatlogic 62 Sep 14, 2021
React Typescript Login and Registration example - JWT Authentication & Authorization with Axios, Router, Rest API

React Typescript Login example with Axios and Web API Build React Typescript Login and Registration example with React Router, Axios and Bootstrap (wi

null 4 Sep 17, 2021
Application made with Nodejs typescript framework Nestjs and Reactjs Redux Saga to simulate simple vending machine workflow.

Project Description This project was made to simulate on how vending machine works. We have two application frontend and backend. Frontend is made wit

Roshan Ranabhat 9 Aug 24, 2021
Simple Light is a free landing page template built on top of TailwindCSS and fully coded in React.

Simple Light is a free landing page template built on top of TailwindCSS and fully coded in React. Simple light is designed to provide all the basic components a developer need to create a landing page for SaaS products, online services, and more.

Cruip 1k Sep 18, 2021
Volt React is a free and open source admin dashboard template built in React.js and based on the latest version of the Bootstrap 5

Volt React is a free and open source admin dashboard template built in React.js and based on the latest version of the Bootstrap 5 CSS framework. It features over 100 UI elements, plugins, and example based built with React components.

Themesberg 420 Sep 24, 2021