The project was created to train working with the stack: React, TypeScript, Redux Toolkit, RTKQuery, jest + react-testing-lib, cypress.
- list of cards, each of which displays a picture and information that came from the endpoint (public API selected Disney API)
- filter button
- application implemented as SPA
- filter button:
- is active only if there are liked cards
- when you click on the button, only liked cards are shown, the text on the button changes
- when pressed again, all cards are displayed again, the text on the button changes
- incoming data is stored in store
- while the image on the card is loading, the user sees the loader
- there is a like icon on the card:
- when you click on the button, put or remove a like
- icon is tinted when liked
- there is a delete icon on the card:
- when you click on the button, the card is deleted
- when deleting all cards, the corresponding inscription is displayed
- clicking on image opens gallery (using Core Components Gallery)
- implemented adaptive layout (breakpoints: 1440px, 1024px, 768px, 425px)