React
Styled-Components
React Hooks
React-Router-Dom
Recharts
This project fetches data from the balldontlie API and allows users to see any NBA game results or player statistics from any date going back to 1985. Having an interest in sports myself, I initially built this project for my personal use. I wanted to create an application that made it easy for me to see the results of NBA games and see who the best players were on a nightly basis. The main focus of this application was to create a straightforward user interface from an abundance of data that also allows for a smooth user experience.
The Problem
Every sports fan knows this situation: you had a long night at the office and didn't have the time nor the energy to watch the game, so what do you do? You head to one of the mainstream sports websites hoping to easily and quickly see the game results, only to be greeted by paywalls, slow loading times and having to click 20 links just to reach the content you want. All Ball solves these problems by not only having an intuitive UX, but also a clean UI that shows you what you want to see when you want to see it.
Tech Stack Explanation
I chose React to create this project due to the large amount of user interaction and constant changing of state. Another reason for choosing React was I wanted to solidify the skills I learned from my education and build an application from scratch. I chose to use styled-components to style the app because I wanted a hands-on experience with learning how to integrate it into a project. I also chose styled-components because I find that CSS-in-JS pairs perfectly with React and creates a smooth programming experience.
Lessons Learned
Because this was a passion project, I was a bit too eager to get started and I learned very quickly how important it is to write well-organized and clean code from the very start of the project. This project also taught me how to think creatively when dealing with APIs that either lack the required data or return data in different ways than what you need. Throughout this project, I learned about API rate limiting and how low limits or high limits can both respectively affect the UX of an application.