A simple LoL match statistics web app.
View Demo
·
Report Bug
Table of Contents
My passion project is developed using React and Redis. It utilizes Riot Games' API to retrieve the latest League of Legends matches for users and presents unique statistics not commonly found on popular LoL-stats websites. To reduce dependency on the API, I've implemented Redis to cache data during the initial lookup.
Node.js, npm
- Get a free API Key at Riot Games
- Create a Redis instance, you can do it for free on railway
- Clone the repo
git clone https://github.com/kol3x/League-Helper
- Install NPM packages for both react and express folders.
npm i
- Fill the react folder .env file with the following.
SERVER_URL = "http://localhost:5005";
- Run the react frontend and copy the adress of frontend instance.
npm run dev
- Enter your API, Redis URL, frontend adress and pot in
.env
of express folder.RIOT = "ENTER YOUR API"; REDIS_URL = "you Redis instance"; PORT = 5005; FRONTEND_URL = "ENTER FRONTEND URL FROM PREV STEP";
- Run the backend instance
npm run serverstart
By default it opens my League profile. To look at a different one, you should type a username, RIOT tag and select a server in the header. Another option is to click any on the teammates/enemys names to go and see their matches.
- Redesign match box.
- Add goals for next match.
I'd be happy for you to join and build up this project with me.
Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.
If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!
- Fork the Project
- Create your Feature Branch (
git checkout -b feature/AmazingFeature
) - Commit your Changes (
git commit -m 'Add some AmazingFeature'
) - Push to the Branch (
git push origin feature/AmazingFeature
) - Open a Pull Request