Advanced Session in React

Topics

1- State management in React applications - Context API - Redux with TDD (The old fashion way) - React-Query 2- Testing in React - Testing your components - Testing your hooks - e2e with Cypress.io

Prequisis

• Install docker and have some basic knowledge of docker
  • docker compose up will be used during this workshop
• Install nodejs
• Have a good grasp of React
• Have a good grasp of Git

Todos

---

Our application is a simple Movie tracker: Hackflix.

Implement the following features using the context API

• Filter books by name
  • When searching in the input on the header, we should be able to filter the books based on the user inputs
• Filter books by category
  • When clicking on the category filters, the selected category should have an active color of red and the books should be filters

Hints: Combine all Context APIs in one

Implement the previous feature using Redux with TDD

Implement the previous feature using React-query

Add more Tests to our application