Skip to content

This project is a React application that displays a lazy-loaded list of characters from the Rick and Morty animated series, using the Rick and Morty API. It employs Redux for state management and Redux-Saga for handling asynchronous requests. Users can click on a character to view detailed information on a separate page.

Notifications You must be signed in to change notification settings

IhorSylakov/rickandmorty-task

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

5 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Rickandmorty test task

Description and requirements

Based on the API https://rickandmortyapi.com/, implement a React application with a lazy-loaded list of characters from the animated series. A lazy-loaded list is one where elements are loaded from the backend in parts, i.e., when the scroll reaches the end of the page, the next part of the list is fetched, and so on, until the backend has no more data for us.

  • Upon clicking on a character, the user should be redirected to a separate page with detailed information about that character.
  • Use Redux for state management and Redux-Saga for asynchronous requests.
  • Use SCSS or StyledComponents for styling.
  • Tests are encouraged.

App preview

The application supports theming with dark and light themes. Currently, the theme depends on the system preferences - if the system has a dark or light theme or an auto theme depending on the time of day, then the app will have a corresponding theme. I plan to add a toggle button to enable a mode different from the system settings.

Shows an illustrated light and dark modes Shows an illustrated dark and light modes

How it works

Check how it works

Project setup

npm install

Compiles and hot-reloads for development

npm run start

Compiles and minifies for production

npm run build

About

This project is a React application that displays a lazy-loaded list of characters from the Rick and Morty animated series, using the Rick and Morty API. It employs Redux for state management and Redux-Saga for handling asynchronous requests. Users can click on a character to view detailed information on a separate page.

Topics

Resources

Stars

Watchers

Forks