The Avengers Power Calculator is a web application that allows users to calculate the power of their custom Avengers team based on their chosen characters' characteristics. Users can assemble their own team by selecting Marvel characters from a provided list and determine how strong their team would be in battles against other teams. Or the users can choose an existing well-known team from Marvel comics.
- User-friendly interface with a Marvel-themed design.
- Integration with a MockApi source created using available sources.
- Display of detailed information about each character, including their name, description, skills, abilities, history and more.
- Ability to add selected characters to the user's team.
- Real-time calculation of the overall power of the team based on the characteristics of the chosen characters.
- The ability to save, view and analyze the history of all battles and team compositions in which the user played.
- Additional page with information about the Avengers team, including character details, superpowers, and the history of the Avengers.
- Engaging animations and interactive elements for an enhanced user experience.
- Adaptive layout: The app is designed to work on tablet and laptop screen sizes and that adapts to the user's device.
- React
- JavaScript
- React Router
- Redux Toolkit
- Axios
- MockAPI
- Styled-components, SASS
- Chakra UI
- Framer-motion
$ git clone https://github.com/Iryna-Gry/itis-team-6.git
$ cd your-project
$ npm install
$ npm start
- On the home page, you will find information about the project and a link to the game page.
- Navigate to the game page by clicking the provided link. - Browse the list of Marvel characters and select the ones you want to add to your own team.
- View detailed information about each character and use the provided interface to add them to your team.
- As you add characters, the team's overall power will be calculated and displayed in real time.
- Choose from already existing teams of Marvel heroes and try to play
- Read and discover more information about teams and heroes
- Save, view and analyze the history of all battles and team compositions which you played.
The app uses the MockAPI service as a backend. Information collected independently from open sources.
The application is designed to be compatible with a wide range of devices and screen sizes more then 768px. The app is optimized for desktop and laptop computers.
- '/' - Home page (Welcome and Introduction to the application)
- '/play' - Play page (Сreate own team and play)
- '/teamplay' - Teamplay page (Choose from already existing teams)
- '/statistics' - Statistics page (Save, view and analyze the history of all battles)