📖 League Challengers Tracker

League Challengers Tracker is a basic application that aims to provide users with access to real-time statistics from Riot Games for the top challenger players in League of Legends. With this project, you can retrieve stats such as champion scores, KDA, and win rate for recent games played by these players, across all regions. You can also filter players to find the ones that best meet your needs.

---

🛠 Built With

Tech Stack

• React
• Redux
• CSS/SCSS
• Javascript
• Jest

Key Features

• Display real-time statistics of the top players from every region
• Display real-time statistics of players match history
• Filter the list of players to find the one that meet your needs

(back to top)

🚀 Live Demo

• Open live demo

(back to top)

💻 Getting Started

To get a local copy up and running, follow these steps.

Prerequisites

In order to run this project you need to install these prerequisites:

• If you're running on Windows you can download the prerequisites from the links down below:

Nodejs

Git

• If you're running on Linux follow these steps down below:

• Install git.

 sudo apt install git

• Install nodejs and npm.

 sudo apt install nodejs

Setup

Clone this repository to your desired folder:

  git clone [email protected]:Kweeka1/metrics-app.git
  cd metrics-app

Install

Install this project with:

  npm install

Usage

To run the project, follow below instructions:

• Create an account at https://developer.riotgames.com/

• Generate an api key

• Create a new file in root directory called .env and insert below code:

REACT_APP_API_KEY={API_KEY_GENERATED}

• Example:

REACT_APP_API_KEY=RGAPI-2a9e6e8c-917c-8394-a8f3-baa489cd9fe8

• Now you can run the app in development mode by executing:

npm run start

• To get a production build, execute the following command

npm run build

Run tests

To run tests, run the following command:

  npm run test

Deployment

You can deploy the production build of this project using npm library called gh-pages:

• First install the library

npm install gh-pages --save-dev

• Then follow the instructions provided in their readme file to deploy the app

GH Pages README

• deploy the build folder after running npm run build.

(back to top)

👥 Authors

👤 Mohamed Talbi

• GitHub: Mohamed Talbi

(back to top)

🔭 Future Features

• Improve User Interface
• Make a desktop design for the app
• Add expand button to match history card to show additional info

(back to top)

🤝 Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page.

(back to top)

⭐️ Show your support

Give a ⭐️ if you like this project!

(back to top)

🙏 Acknowledgments

• I would like to thank Microverse for project inspiration.
• Original design is by Nelson Sakwa on Behance.

(back to top)

❓ FAQ

• What version of nodejs does this project works on?

  • The project runs well with nodejs 14+. you might face some issues while running this project in lower versions.

(back to top)

📝 License

This project is MIT licensed.

(back to top)