/opchamps

A react project attempting to clone specific features of the popular website op.gg.

Primary LanguageJavaScript

OPChamps

By Daniel Black - Check out OPChamps

  • League of Legends Lore
  • Enables user discussion

Table of Contents

OPChamps at a Glance

OPChamps is a full-stack web app that allows users to explore and discus the world and characters from the worlds most popular video game: League of Legends. An easy-to-use comment section for users to interact combined with a comrehensive info-rich database allow for an informative user expirience.

OPChamps uses the Riot API Data Dragon for retrieval of Static data, such as images and stories.

Application Architecture

OPChamps is a full stack application utilizing Express.js, Sequelize ORM and Postgress for the backend/database.

Backend Overview

The application Express.js server connects the database to the frontend(React). Redux and React Hooks manage the data it receives from the server.

Frontend Overview

React engine hosts the entire frontend. The backed is accessed through Fetches using the useEffect Hook. From there, the hooks temporarily store the data on a page. CSS then displays the data.

The main content on the site cannot be changed to fit a mobile screen in an effective way, and thus the site needs to be kept at at least a certain size.

Conclusion & Future Features

OPChamps not only enhanced my abilities as a software engineer but also allowed me to combine two passions. The application was a joy to create and serves as a reference to my first expirience with React.

Thanks for checking out OPChamps!